]> git.ipfire.org Git - thirdparty/bulma.git/commitdiff
Add normal header, Fix hero colors
authorJeremy Thomas <bbxdesign@gmail.com>
Sat, 27 Feb 2016 13:29:54 +0000 (13:29 +0000)
committerJeremy Thomas <bbxdesign@gmail.com>
Sat, 27 Feb 2016 13:29:54 +0000 (13:29 +0000)
bulma/layout/header.sass
bulma/layout/hero.sass

index 0a3a02aec76914fac002bc5b4eca0802f3f61c91..fc28c50992e904b638256d7531284094e1990783 100644 (file)
@@ -1,23 +1,28 @@
 .header
   +clearfix
   background: white
-  box-shadow: 0 1px 2px rgba(black, 0.1)
   display: flex
-  height: 50px
   line-height: 24px
   position: relative
   text-align: center
   z-index: 2
   .container
     align-items: stretch
-    box-shadow: 0 1px 0 rgba($border, 0.3)
     display: flex
     width: 100%
+  &.has-shadow
+    box-shadow: 0 1px 2px rgba(black, 0.1)
+  +mobile
+    .container
+      flex-direction: column
   +tablet
     height: $header-height
 
 .header-toggle
   @extend .hamburger
+  position: absolute
+  right: 0
+  top: 0
   +tablet
     display: none
 
@@ -31,6 +36,7 @@
     max-height: 24px
   a
     color: $text
+    flex: 1
     &:hover
       color: $link-hover
     &.is-active
   .fa
     font-size: 21px
     line-height: 24px
+  .button + .button
+    margin-left: 10px
+  +mobile
+    text-align: left
 
 .header-icon
   +fa(14px, 24px)
@@ -69,6 +79,8 @@
   overflow: hidden
   overflow-x: auto
   white-space: nowrap
+  +mobile
+    height: $header-height
   +desktop
     .header-item:first-child
       padding-left: 0
 
 .header-menu
   +mobile
-    background: white
     box-shadow: 0 4px 7px rgba(black, 0.1)
     display: none
-    min-width: 120px
-    position: absolute
-    right: 0
-    top: 50px
-    z-index: 100
     .header-item
       border-top: 1px solid rgba($border, 0.5)
       padding: 10px
index c88007523f5aedbdea10e0919a68f1614ee1b311..6f3dcead583c4ee67c4530d076b7a9b1ccf33161 100644 (file)
@@ -36,7 +36,8 @@
   text-align: center
   .header
     background: none
-    box-shadow: none
+    .container
+      box-shadow: 0 1px 0 rgba($border, 0.3)
   .tabs
     a
       border: none
@@ -45,9 +46,6 @@
     &.is-boxed
       a
         padding: 8px 15px
-  &.is-alt
-    background: $background
-    color: $text-light
   @each $name, $pair in $colors
     $color: nth($pair, 1)
     $color-invert: nth($pair, 2)
             span
               background: $color-invert
         .header-menu
-          background: $color
           .header-item
             border-top-color: rgba($color-invert, 0.2)
   &.is-fullheight,