add menu text to the hamburger menu on mobile

This commit is contained in:
Michael Q Larson
2015-02-26 13:22:12 -08:00
parent 907415e13d
commit dfa15d8fc1
2 changed files with 26 additions and 7 deletions

View File

@ -247,7 +247,7 @@ ul {
.nav-logo {
height: 40px;
margin-top: -10px;
@media (max-width: 365px) {
@media (max-width: 381px) {
height: 30px;
margin-top: -5px;
}
@ -710,7 +710,6 @@ iframe.iphone {
}
.btn-primary-ghost{
background: transparent;
color: @brand-primary;
@ -723,6 +722,23 @@ iframe.iphone {
}
.hamburger {
width: 80px;
padding-left: 0px;
padding-right: 0px;
margin-left: 0px;
margin-right: 2px;
text-align:left;
font-size: 10px;
}
.hamburger-text {
line-height: 0.75em;
margin-top: 10px;
font-size: 16px;
margin-left: -5px;
}
//uncomment this to see the dimensions of all elements outlined in red
//* {
// border-color: red;

View File

@ -1,9 +1,12 @@
.navbar-header
button.navbar-toggle(type='button', data-toggle='collapse', data-target='.navbar-collapse')
span.sr-only Toggle navigation
span.icon-bar
span.icon-bar
span.icon-bar
button.hamburger.navbar-toggle(type='button', data-toggle='collapse', data-target='.navbar-collapse')
.col-xs-6
span.hamburger-text Menu
.col-xs-6
span.sr-only Toggle navigation
span.icon-bar
span.icon-bar
span.icon-bar
a.navbar-brand(href='/')
img.img-responsive.nav-logo(src='https://s3.amazonaws.com/freecodecamp/freecodecamp_logo.svg', alt='learn to code javascript at Free Code Camp logo')
.collapse.navbar-collapse