experimenting with navbar logo, but we're still a long way from a finished theme

Author: jonschlinkert

about.html

@@ -40,7 +40,10 @@
             <span class="icon-bar"></span>
             <span class="icon-bar"></span>
           </button>
-          <a href="index.html" class="navbar-brand">LESS</a>
+          <a href="index.html" class="navbar-brand">
+            <img src="assets/img/logo.png" alt="LESS extends CSS with dynamic behavior such as variables, mixins, operations and functions. LESS runs on both the server-side (with Node.js and Rhino) or client-side (modern browsers only).
+">
+          </a>
         </div>
         <nav class="collapse navbar-collapse bs-navbar-collapse" role="navigation">
           <ul class="nav navbar-nav">

assets/css/docs.css

@@ -3540,7 +3540,7 @@ textarea.input-group-sm > .input-group-btn > .btn {
 .navbar {
   position: relative;
   z-index: 1000;
-  min-height: 70px;
+  min-height: 60px;
   margin-bottom: 20px;
   border: 1px solid transparent;
 }
@@ -3694,7 +3694,7 @@ textarea.input-group-sm > .input-group-btn > .btn {
 }
 .navbar-brand {
   float: left;
-  padding: 25px 15px;
+  padding: 20px 15px;
   font-size: 18px;
   line-height: 20px;
 }
@@ -3712,8 +3712,8 @@ textarea.input-group-sm > .input-group-btn > .btn {
   float: right;
   margin-right: 15px;
   padding: 9px 10px;
-  margin-top: 18px;
-  margin-bottom: 18px;
+  margin-top: 13px;
+  margin-bottom: 13px;
   background-color: transparent;
   border: 1px solid transparent;
   border-radius: 4px;
@@ -3733,7 +3733,7 @@ textarea.input-group-sm > .input-group-btn > .btn {
   }
 }
 .navbar-nav {
-  margin: 12.5px -15px;
+  margin: 10px -15px;
 }
 .navbar-nav > li > a {
   padding-top: 10px;
@@ -3771,8 +3771,8 @@ textarea.input-group-sm > .input-group-btn > .btn {
     float: left;
   }
   .navbar-nav > li > a {
-    padding-top: 25px;
-    padding-bottom: 25px;
+    padding-top: 20px;
+    padding-bottom: 20px;
   }
 }
 @media (min-width: 768px) {
@@ -3791,8 +3791,8 @@ textarea.input-group-sm > .input-group-btn > .btn {
   border-bottom: 1px solid transparent;
   -webkit-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.1), 0 1px 0 rgba(255, 255, 255, 0.1);
   box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.1), 0 1px 0 rgba(255, 255, 255, 0.1);
-  margin-top: 18px;
-  margin-bottom: 18px;
+  margin-top: 13px;
+  margin-bottom: 13px;
 }
 @media (min-width: 768px) {
   .navbar-form .form-group {
@@ -3848,13 +3848,13 @@ textarea.input-group-sm > .input-group-btn > .btn {
   right: 0;
 }
 .navbar-btn {
-  margin-top: 18px;
-  margin-bottom: 18px;
+  margin-top: 13px;
+  margin-bottom: 13px;
 }
 .navbar-text {
   float: left;
-  margin-top: 25px;
-  margin-bottom: 25px;
+  margin-top: 20px;
+  margin-bottom: 20px;
 }
 @media (min-width: 768px) {
   .navbar-text {
@@ -6846,14 +6846,14 @@ h1[id] {
 /* All levels of nav */
 .sidebar .nav > li > a {
   display: block;
-  color: #716b7a;
+  color: #428bca;
   padding: 5px 20px;
 }
 .sidebar .nav > li > a:hover,
 .sidebar .nav > li > a:focus {
   text-decoration: none;
   background-color: #e5e3e9;
-  border-right: 1px solid #dbd8e0;
+  border-right: 1px solid #428bca;
 }
 .sidebar .nav > .active > a,
 .sidebar .nav > .active:hover > a,
@@ -6908,7 +6908,7 @@ h1[id] {
   }
 }
 body {
-  padding-top: 70px;
+  padding-top: 60px;
 }
 /**
  * Neutralize background color to allow our
@@ -6917,6 +6917,15 @@ body {
 pre code {
   background: transparent;
 }
+/**
+ * Navbar Logo
+ */
+.navbar-brand {
+  padding: 15px 15px 10px;
+}
+.navbar-brand img {
+  max-width: 85px;
+}
 /**
  * Page headers
  * Jumbotron-esque headers at the top of every
@@ -6966,7 +6975,6 @@ pre code {
  * Turn the `.navbar` at the top of the docs dark blue.
  */
 .docs-nav {
-  text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.15);
   background-color: #1d365d;
   border-color: #111f36;
   box-shadow: 0 1px 0 rgba(255, 255, 255, 0.1);

assets/img/log/logo-med.png

@@ -40,7 +40,10 @@
             <span class="icon-bar"></span>
             <span class="icon-bar"></span>
           </button>
-          <a href="index.html" class="navbar-brand">LESS</a>
+          <a href="index.html" class="navbar-brand">
+            <img src="assets/img/logo.png" alt="LESS extends CSS with dynamic behavior such as variables, mixins, operations and functions. LESS runs on both the server-side (with Node.js and Rhino) or client-side (modern browsers only).
+">
+          </a>
         </div>
         <nav class="collapse navbar-collapse bs-navbar-collapse" role="navigation">
           <ul class="nav navbar-nav">

assets/img/log/logo-mini.png

@@ -40,7 +40,10 @@
             <span class="icon-bar"></span>
             <span class="icon-bar"></span>
           </button>
-          <a href="index.html" class="navbar-brand">LESS</a>
+          <a href="index.html" class="navbar-brand">
+            <img src="assets/img/logo.png" alt="LESS extends CSS with dynamic behavior such as variables, mixins, operations and functions. LESS runs on both the server-side (with Node.js and Rhino) or client-side (modern browsers only).
+">
+          </a>
         </div>
         <nav class="collapse navbar-collapse bs-navbar-collapse" role="navigation">
           <ul class="nav navbar-nav">

assets/img/log/logo-small.png

@@ -40,7 +40,10 @@
             <span class="icon-bar"></span>
             <span class="icon-bar"></span>
           </button>
-          <a href="index.html" class="navbar-brand">LESS</a>
+          <a href="index.html" class="navbar-brand">
+            <img src="assets/img/logo.png" alt="LESS extends CSS with dynamic behavior such as variables, mixins, operations and functions. LESS runs on both the server-side (with Node.js and Rhino) or client-side (modern browsers only).
+">
+          </a>
         </div>
         <nav class="collapse navbar-collapse bs-navbar-collapse" role="navigation">
           <ul class="nav navbar-nav">