From 354cecb05ff9da4db36ab483e54c710153d8c644 Mon Sep 17 00:00:00 2001 From: Jeremy Thomas Date: Sat, 27 Feb 2016 13:29:54 +0000 Subject: [PATCH] Add normal header, Fix hero colors --- bulma/layout/header.sass | 24 +++++++++++++++--------- bulma/layout/hero.sass | 7 ++----- 2 files changed, 17 insertions(+), 14 deletions(-) diff --git a/bulma/layout/header.sass b/bulma/layout/header.sass index 0a3a02ae..fc28c509 100644 --- a/bulma/layout/header.sass +++ b/bulma/layout/header.sass @@ -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 @@ -38,6 +44,10 @@ .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 @@ -101,14 +113,8 @@ .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 diff --git a/bulma/layout/hero.sass b/bulma/layout/hero.sass index c8800752..6f3dcead 100644 --- a/bulma/layout/hero.sass +++ b/bulma/layout/hero.sass @@ -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) @@ -105,7 +103,6 @@ span background: $color-invert .header-menu - background: $color .header-item border-top-color: rgba($color-invert, 0.2) &.is-fullheight,