diff options
author | steren <steren@google.com> | 2017-06-22 18:47:17 +0200 |
---|---|---|
committer | Marcel Hlopko <hlopko@google.com> | 2017-06-26 18:30:34 +0200 |
commit | 505b78cf7cceba8088b0f1153832201373d5e8ad (patch) | |
tree | 6a6a629eb686addcf061b95c2eb9ff5e33e70f04 /site/_sass/navbar.scss | |
parent | 225c78b3b26f0d6a3e8b2ff075f0b77a609c7330 (diff) |
Update logo. Update Header and Footer to use new style from bazel-website.
Refactor CSS structure to only contain shared and docs CSS
RELNOTES: None
PiperOrigin-RevId: 159837919
Diffstat (limited to 'site/_sass/navbar.scss')
-rw-r--r-- | site/_sass/navbar.scss | 96 |
1 files changed, 96 insertions, 0 deletions
diff --git a/site/_sass/navbar.scss b/site/_sass/navbar.scss new file mode 100644 index 0000000000..42be12e0e1 --- /dev/null +++ b/site/_sass/navbar.scss @@ -0,0 +1,96 @@ +// Navbar styles +$navbar-bg-color: $bazel-green; +$navbar-hover-bg-color: $bazel-green-light; +$navbar-color: $color-on-bazel-green; +$navbar-hover-color: #444; +$navbar-input-bg-color: $bazel-green-light; +$navbar-input-focus-bg-color: $color-on-bazel-green; +$navbar-input-border-color: $bazel-green; + +.navbar-inverse { + margin-bottom: 0; + background-color: $navbar-bg-color; + border-bottom: 1px solid $navbar-bg-color; + + .navbar-brand { + .navbar-logo { + height: 22px; + } + } + + a.navbar-brand { + color: $navbar-color; + + &:focus, + &:hover { + color: $navbar-hover-color; + background-color: $navbar-bg-color; + } + } + + .navbar-nav > li > a { + color: $navbar-color; + + &:focus, + &:hover { + color: $navbar-hover-color; + background-color: $navbar-hover-bg-color; + } + + &.nav-icon { + font-size: 18px; + } + } + + .navbar-nav > li.active > a { + background-color: $navbar-hover-bg-color; + + &:focus, + &:hover { + background-color: $navbar-hover-bg-color; + } + } + + .navbar-form { + border-color: $navbar-bg-color; + + .input-sm { + margin-top: 2px; + } + + input[type="search"] { + background-color: $navbar-input-bg-color; + border-color: $navbar-input-border-color; + + &::placeholder { + color: $navbar-color; + } + + &:focus, + &:active { + background-color: $navbar-input-focus-bg-color; + } + } + } + + .navbar-toggle { + border: 1px solid $navbar-bg-color; + + &.active, + &:focus, + &:hover { + background-color: $navbar-hover-bg-color; + } + } + + .navbar-collapse { + border-color: $navbar-bg-color; + } +} + +@media (max-width: 768px) { + #cse-search-box { + margin-top: 0; + margin-bottom: 0; + } +} |