swapping fa-reorder in the place of icon-bar

diff --git a/src/_includes/navbar.html b/src/_includes/navbar.html
index 507a4de67682ad9cc4a2c35521848a0efa7f8d3c..cc149f341ff72214f30af11e1d96f12c1dd3f2f1 100644 (file)
--- a/src/_includes/navbar.html
+++ b/src/_includes/navbar.html
@@ -3,9 +3,7 @@
     <div class="navbar-header">
       <button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse">
         <span class="sr-only">Toggle navigation</span>
-        <span class="icon-bar"></span>
-        <span class="icon-bar"></span>
-        <span class="icon-bar"></span>
+        <i class="fa fa-reorder fa-lg"></i>
       </button>
       <a class="navbar-brand" href="{{ page.relative_path }}"><i class="fa fa-flag"></i> Font Awesome</a>
     </div>

diff --git a/src/assets/less/site/bootstrap/navbar.less b/src/assets/less/site/bootstrap/navbar.less
index 40db1ddf0e737df82a95cbff8b70544e0e7e813c..833f0028f86d8f387b77c1047b011abf2994ebe3 100644 (file)
--- a/src/assets/less/site/bootstrap/navbar.less
+++ b/src/assets/less/site/bootstrap/navbar.less
@@ -17,3 +17,17 @@
 }
 
 .navbar-inverse .navbar-collapse, .navbar-inverse .navbar-form { border-color: @jumbotron-border; }
+
+.navbar-inverse .navbar-toggle {
+  color: @jumbotron-color;
+  text-shadow: 0 1px 0 rgba(0,0,0,0.15);
+  padding: 4px 10px;
+  margin-top: 5px;
+  margin-bottom: 5px;
+  &:hover {
+    background-color: mix(@jumbotron-color, @jumbotron-bg, 95%);
+    border-color: mix(@jumbotron-color, @jumbotron-bg, 95%);
+    color: @jumbotron-bg;
+    text-shadow: 0 -1px 0 @jumbotron-color;
+  }
+}
\ No newline at end of file

diff --git a/src/assets/less/site/bootstrap/variables.less b/src/assets/less/site/bootstrap/variables.less
index e260f0d445991cc52a8672ab5ba223243c52e98b..da851b31ae485ab8d013dbc6894777025088924d 100644 (file)
--- a/src/assets/less/site/bootstrap/variables.less
+++ b/src/assets/less/site/bootstrap/variables.less
@@ -89,8 +89,7 @@
 @navbar-inverse-link-active-bg:             @navbar-inverse-border;
 
 // Inverted navbar toggle
-@navbar-inverse-toggle-hover-bg:            @fa-green-dark;
-@navbar-inverse-toggle-icon-bar-bg:         @jumbotron-color;
+@navbar-inverse-toggle-hover-bg:            @jumbotron-color;
 @navbar-inverse-toggle-border-color:        mix(@jumbotron-color, @fa-green, 75%);