From 0505cf46dda4d53a22d640bd5849b5c79d8375bf Mon Sep 17 00:00:00 2001 From: Jake Howard Date: Sun, 28 Feb 2016 22:27:01 +0000 Subject: [PATCH] Fix navbar --- static/src/less/navbar.less | 59 +++++++++++++++++----------------- static/src/less/variables.less | 2 +- 2 files changed, 30 insertions(+), 31 deletions(-) diff --git a/static/src/less/navbar.less b/static/src/less/navbar.less index caff666..264173f 100644 --- a/static/src/less/navbar.less +++ b/static/src/less/navbar.less @@ -8,23 +8,13 @@ .transition(~"ease-in-out .3s color"); } & > li { + height: @navbar-height; @media (min-width: @screen-md-min) { margin-right: 23px; } - &:not(.dropdown) > a { - padding-top: 12px; - } - & > a { - @media (min-width: @screen-md-min) { - padding: 10px 10px; - } - @media (max-width: @screen-xs-max) { - padding: 15px 15px; - } - } } .dropdown-toggle, & > li > a { - font-size: 18px; + font-size: 19px; } .dropdown-menu { @media (min-width: @screen-sm) { @@ -44,9 +34,6 @@ .open & { opacity: 1; } - a { - padding-left: 20px; - } } } @@ -54,6 +41,7 @@ .navbar { max-height: @navbar-height; border-radius: 0; + border: none; .home-button a { .transition(~"ease-in-out .3 all"); } @@ -68,7 +56,8 @@ } #navbar-container { - z-index: 0; + margin: 0; + z-index: 10000; @media (max-width: @screen-xs-max) { width: 96%; left: 2%; @@ -76,8 +65,6 @@ @media (min-width: @screen-sm-min) { width: 100%; } - margin: 0; - z-index: 10000; i + *, .glyphicon + * { margin-left: 5px; } @@ -87,7 +74,7 @@ } &.align { @media (min-width: @screen-sm) { - position: absolute; + position: initial; height: @navbar-height; } @media (max-width: @screen-sm) { @@ -125,20 +112,32 @@ z-index: 10000; } -@media (min-width: @screen-xs-max) { - navbar + * { - margin-top: @navbar-height; - } -} - /* @group Header Navbar*/ -@media (min-width: @screen-xs-max) { - .header navbar{ +@media (min-width: @screen-sm-min) { + .header { #navbar-container { margin: 0 auto; - width: 100%; + width: 110%; + margin-left: -5%; + &:not(.stick-top) { + position: initial; + } + &.stick-top { + @container-size: 720px; + width: @container-size * 1.1; + margin-left: -@container-size * 0.05; + @media (min-width: @screen-md-min) { + @container-size: 940px; + width: @container-size * 1.1; + margin-left: -@container-size * 0.05; + } + @media (min-width: @screen-lg-min) { + @container-size: 1140px; + width: @container-size * 1.1; + margin-left: -@container-size * 0.05; + } + } } - }; + } } - /* @end Header Navbar*/ diff --git a/static/src/less/variables.less b/static/src/less/variables.less index 91d4d69..8155f87 100644 --- a/static/src/less/variables.less +++ b/static/src/less/variables.less @@ -142,7 +142,7 @@ @container-md: @container-desktop; @container-large-desktop: (1140px + @grid-gutter-width); @container-lg: @container-large-desktop; -@navbar-height: 52px; +@navbar-height: 50px; @navbar-margin-bottom: @line-height-computed; @navbar-border-radius: @border-radius-base; @navbar-padding-horizontal: floor((@grid-gutter-width / 2));