Skip to content

Commit 1a52dd9

Browse files
ShipowShipow
committed
chore(website): Responsive nav
1 parent e771e40 commit 1a52dd9

File tree

7 files changed

+54
-17
lines changed

7 files changed

+54
-17
lines changed

‎docs/_includes/header.html

Lines changed: 10 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -2,22 +2,26 @@
22
<nav class="navbar navbar-default navbar-inverse">
33
<div class="container-fluid">
44
<div class="navbar-header">
5-
<button type="button" class="text-white navbar-toggle collapsed" data-toggle="collapse" data-target="#instant-search-nav">
6-
Menu <i class="fa fa-bars m-l"></i>
5+
<button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#instant-search-nav">
6+
Menu&nbsp;&nbsp;<i class="fa fa-bars"></i>
77
</button>
88
<a class="navbar-brand" href="{{ site.baseurl }}/">{{ site.title }}</a>
99
</div>
1010
<div id="instant-search-nav" class="navbar-collapse collapse">
11-
<ul class="nav navbar-nav pull-right">
12-
{% assign url = page.url | remove: 'index.html' %}
11+
<ul class="nav navbar-nav navbar-right">
12+
{% assign url = page.url %}
13+
<li class="visible-xs {% if url == '/index.html' %}active{% endif %}">
14+
<a href="{{ site.baseurl }}/" title="Home">Home</a>
15+
</li>
1316
{% for link in site.navigation %}
1417
<li {% if url == link.url %}class="active"{% endif %}>
1518
<a href="{{ site.baseurl }}{{ link.url }}" title="{{ link.title }}">{{ link.text }}</a>
1619
</li>
1720
{% endfor %}
1821
<li>
19-
<a href="http://github.com/algolia/instantsearch.js" title="See more, open issues and get answers in our Github repository">
20-
<i class="fa fa-github"></i>
22+
<a href="http://github.com/algolia/instantsearch.js" title="See more, open issues and get answers in our Github repository" target="_blank">
23+
<i class="fa fa-github hidden-xs"></i>
24+
<span class="visible-xs">View project on github</span>
2125
</a>
2226
</li>
2327
</ul>

‎docs/_layouts/default.html

Lines changed: 6 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -22,21 +22,22 @@
2222
<body class="{% body_class %}">
2323
{% include header.html %}
2424

25-
<script src="https://cdn.jsdelivr.net/jquery/1.11.3/jquery.min.js"></script>
26-
2725
{{ content }}
26+
{{page.url}}
2827

2928
{%if page.noFooter == null %}
3029
{% include footer.html %}
3130
{% endif %}
32-
33-
<script src="https://use.fonticons.com/dff9b562.js"></script> <!-- replace font-awesome -->
3431
<script src="https://cdn.jsdelivr.net/jquery/1.11.3/jquery.min.js"></script>
32+
<script src="{{ "/js/bootstrap.min.js" | prepend: site.baseurl }}"></script>
33+
<script src="https://use.fonticons.com/dff9b562.js"></script> <!-- replace font-awesome -->
34+
{%if page.url == '/index.html' %}
3535
<script src="https://cdn.jsdelivr.net/gsap/1.11.8/TweenMax.min.js"></script>
3636
<script src="https://cdn.jsdelivr.net/gsap/1.11.8/TimelineMax.min.js"></script>
3737
<script src="https://cdn.jsdelivr.net/scrollmagic/2.0.5/ScrollMagic.min.js"></script>
3838
<script src="https://cdn.jsdelivr.net/scrollmagic/2.0.5/plugins/animation.gsap.min.js"></script>
39-
<script src="https://cdn.jsdelivr.net/bootstrap/3.3.5/js/bootstrap.min.js"></script>
39+
{% endif %}
40+
4041
{% if site.env == 'development' %}
4142
<script src="https://cdn.jsdelivr.net/scrollmagic/2.0.5/plugins/debug.addIndicators.min.js"></script>
4243
<script src="http://localhost:35730/livereload.js"></script>

‎docs/css/_bootstrap.scss

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -23,8 +23,8 @@
2323
@import "bootstrap/buttons";
2424

2525
// Components
26-
// @import "bootstrap/component-animations";
27-
@import "bootstrap/dropdowns";
26+
@import "bootstrap/component-animations";
27+
// @import "bootstrap/dropdowns";
2828
@import "bootstrap/button-groups";
2929
@import "bootstrap/input-groups";
3030
@import "bootstrap/navs";

‎docs/css/_header.sass

Lines changed: 21 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -8,9 +8,30 @@ header.site-header
88
background-color: #0B1724
99
border-radius: 0
1010
border: none
11+
.navbar-collapse.in
12+
background-color: #0B1724 !important
13+
animation: fadeInUp .2s ease-in-out
14+
position: fixed
15+
+position(0,0,0,0)
16+
padding: 20%
17+
font-size: 1.2em
18+
li
19+
padding-bottom: 1em
1120
.navbar-brand
1221
font-weight: 600
1322
color: white !important
23+
z-index: 1
24+
.navbar-header
25+
position: relative
26+
z-index: 2
27+
.navbar-toggle
28+
background-color: $brand-primary
29+
border: solid 1px $brand-primary
30+
color: white
31+
&.collapsed
32+
background-color: transparent
33+
border: solid 1px rgba(white,.4)
34+
color: white
1435
.navbar-nav
1536
> li > a
1637
padding-bottom: 0

‎docs/index.haml

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -7,14 +7,14 @@ layout: default
77
.container
88
.row
99
.col-sm-6
10-
.spacer80
11-
.spacer80
10+
.spacer100
1211
.presented-by
1312
%a{href: "https://www.algolia.com", title: "Instant Search as a Service", target: "_blank"}
1413
%img{src:"img/algolia-logo.svg", width: 100, alt:"Logo Algolia"}
1514
presents:
15+
.spacer40
1616
%h1.logo
17-
%img.img-responsive.m-r{src:"img/logo-instantsearch.svg", alt:"Logo InstantSearch.js"}
17+
%img.img-responsive.m-r{src:"img/logo-instantsearch.svg", alt:"Logo InstantSearch.js", width:500}
1818
%p.vp
1919
The library of UI widgets to build the best instant-search experience with
2020
%a{href:"https://www.algolia.com"} Algolia's Hosted Search API.

‎docs/js/bootstrap.min.js

Lines changed: 11 additions & 0 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎docs/js/doc.js

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -17,7 +17,7 @@
1717
indexName: 'instant_search'
1818
};
1919
var codeSnippets = q('.code-sample-snippet:not(.start):not(.config):not(.ignore)');
20-
var configSnippet = q('.code-sample-snippet.config')[0];
20+
var configSnippet = q('.code-sample-snippet.config')[0];
2121
var startSnippet = q('.code-sample-snippet.start')[0];
2222

2323
var source = codeSnippets.map(function(snippet) {

0 commit comments

Comments
 (0)