gaspersic/freeCodeCamp
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

Nav dropdown responsive fixes

Browse Source 
Fixed responsive dropdown collapse edge case
This commit is contained in:
Sahat Yalkabov
2016-01-30 23:24:34 -05:00
parent 76c75b8e48
commit 2276abb711
1 changed files with 26 additions and 17 deletions
Download Patch File Download Diff File Expand all files Collapse all files

39
client/less/main.less
View File

@ -271,20 +271,26 @@ ul {
.nav-logo { .nav-logo {
height: 40px; height: 40px;
margin-top: -10px; margin-top: -10px;
@media (max-width: 381px) {
@media (max-width: 397px) {
height: 30px; height: 30px;
margin-top: -5px; margin-top: -5px;
} }
@media (max-width: 335px) {
height: 25px;
margin-top: -2px;
}
} }
.navbar-right { .navbar-right {
@media (min-width: 767px) { @media (min-width: 767px) {
margin-right:0; margin-right:0;
} }
@media (max-width: 991px) and (min-width: 768px) { @media (max-width: 991px) and (min-width: 767px) {
position: absolute; position: absolute;
left: 0;
right: 0; right: 0;
margin-right: 10px; margin-right: 0px;
white-space: nowrap; white-space: nowrap;
} }
background-color: @brand-primary; background-color: @brand-primary;
@ -467,10 +473,17 @@ thead {
margin-top: -5px; margin-top: -5px;
margin-bottom: -5px; margin-bottom: -5px;
} }
.navbar-toggle { .navbar-toggle {
color: @body-bg; color: @body-bg;
&:hover,
&:focus {
color: #4a2b0f;
}
} }
.signup-btn-nav { .signup-btn-nav {
margin-top: -2px !important; margin-top: -2px !important;
padding-top: 10px !important; padding-top: 10px !important;
@ -587,13 +600,8 @@ thead {
} }
} }
.hamburger-dropdown { .navbar-collapse {
@media (max-width: 991px) { border-top: 0;
margin-top: -5px !important;
}
@media (min-width: 768px) and (max-width: 991px) {
width: 105%;
}
} }
.challenge-list-header { .challenge-list-header {
@ -808,8 +816,7 @@ iframe.iphone {
} }
.navbar-nav { .navbar-nav {
float: none !important; margin-top: 0;
margin: 7.5px -15px;
} }
.navbar-nav > li { .navbar-nav > li {
@ -833,15 +840,17 @@ iframe.iphone {
.collapsing { .collapsing {
overflow: hidden !important; overflow: hidden !important;
position: absolute;
left: 0;
right: 0;
} }
} }
.navbar-toggle { .navbar-toggle {
width: 80px; width: 80px;
padding-left: 0px; padding-left: 0;
padding-right: 8px; padding-right: 8px;
margin-left: 0px; margin: 7px 2px 7px 0;
margin-right: 2px;
text-align: left; text-align: left;
font-size: 10px; font-size: 10px;
} }