Skip to content

Instantly share code, notes, and snippets.

@generatepress

generatepress/mobile.css

Last active Sep 12, 2015
Embed
What would you like to do?
Only display the mobile menu on mobile devices - not tablets
@media (max-width:769px) and (min-width: 768px) {
.menu-toggle,
.main-navigation.toggled .main-nav > ul {
display: none;
}
.main-navigation ul,
.main-navigation ul li:hover > ul,
.sf-menu li:hover > ul, .sf-menu li.sfHover > ul {
display: block;
}
.main-nav .sf-menu > li {
float: left;
clear: none;
}
.nav-aligned-center.nav-below-header .main-navigation .menu > li,
.nav-aligned-center.nav-below-header .main-navigation .sf-menu > li {
display: inline-block;
}
.main-navigation .main-nav ul ul {
display: none;
float: left;
position: absolute;
top: auto;
left: 0;
z-index: 99999;
width:200px;
text-align:left;
}
.main-navigation .main-nav ul ul ul {
left: 100%;
top: 0;
}
.main-navigation .main-nav ul li .dropdown-toggle {
display: none;
}
.sf-menu .menu-item-has-children > a:first-child,
.sf-menu .page_item_has_children > a:first-child {
padding-right: 2.5em;
}
.sf-menu .menu-item-has-children > a:first-child:after,
.sf-menu .page_item_has_children > a:first-child:after {
display: block;
}
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment