Tweak menu for small screens

This commit is contained in:
Paulus Schoutsen 2014-12-21 20:16:05 -08:00
parent 58ff384360
commit d98cc6f353

View File

@ -26,8 +26,13 @@ body{ -webkit-animation: bugfix infinite 1s; }
/*--------------------------------
Presentation Styles (Editable)
---------------------------------*/
header .grid {
height: 68px;
}
.menu {
margin: 0;
top: 68px;
}
.menu > li > a{
@ -86,6 +91,7 @@ body{ -webkit-animation: bugfix infinite 1s; }
text-align: center;
font-size: 12px;
color: $white;
white-space: nowrap;
}
.toggle:hover::after{
@ -98,9 +104,15 @@ body{ -webkit-animation: bugfix infinite 1s; }
}
@media only screen and (max-width: 479px){
.toggle {
display: inline-block;
position: absolute;
top: -3px;
right: 10px;
}
.toggle::after {
margin: 0 0 20px;
text-align: center;
width: 100%;
padding: 10px 15px;
font-family: "FontAwesome";
content: "\f0c9";
}
}