#22 - adicionando link pra home

src/js/components/navigation-header/templates/navigation-header.template.html

@@ -1,9 +1,19 @@
 <div class='navigation-header navigation-header--is-fixed'>
     <div class="navigation-header__content">
-<!--         <img src='images/ilove-blogs-logo.png' class='navigation-header__logo'> -->
-        <span class="input-box input-box--is-default navigation-header__input-box">
+
+        <span class='navigation-header__breadcrumb'>
+            <a href='http://iloveblogs.github.io' class='navigation-header__breadcrumb__item'>
+                <img src='images/ilove-blogs-logo.png' class='navigation-header__logo p-vertical-align-middle'>
+            </a>
+            <a ui-sref='home'
+                class='navigation-header__breadcrumb__item p-vertical-align-middle p-margin-left-1'>
+                / guest post
+            </a>
+        </span>
+
+<!--         <span class="input-box input-box--is-default navigation-header__input-box">
             <input type="text" placeholder="Encontre um blog" class='input-box__input'>
             <i class="fa fa-search input-box__icon"></i>
-        </span>
+        </span> -->
     </div>
 </div>

src/styl/base/base.styl

@@ -1,6 +1,7 @@
-@import "spacing"
 @import "breakpoints"
 @import "html-body-asterisk"
-@import "z-indexes"
-@import "placeholder"
 @import "keyframes"
+@import "placeholder"
+@import "properties"
+@import "spacing"
+@import "z-indexes"

src/styl/base/properties.styl

@@ -1,5 +1,8 @@
 .p-float-right
-    float: right
+    float: right !important
 
 .p-float-left
-    float: left
+    float: left !important
+
+.p-vertical-align-middle
+    vertical-align: middle !important

src/styl/module/navigation-header.styl

@@ -4,6 +4,7 @@
     top: 0
     z-index: get-z-index(navigation)
     padding: 0
+    line-height: 40px
 
     @media (min-width: screen-tablet-min)
         padding: 0 get-spacing(2)
@@ -21,17 +22,29 @@
         height: 20px
 
     &__input-box
-        align-self: flex-end
+        align-self: flex-start
+        @media (min-width: screen-tablet-min)
+            align-self: flex-end
 
         .input-box__input
             background-color: #5babc8
             color: #fff
+            &:hover
+                color: #fff
 
             + m-placeholder()
                 color: #fff
 
         .input-box__icon
             color: #fff
 
+
+    &__breadcrumb
+        line-height: inherit
+        &__item
+            font-size: 13px
+            color: #fff
+            text-decoration: none
+
     &--is-fixed
         background-color: rgba(28, 131, 176, .9)