Adding Custom CSS
Within the SCSS sheet there is an area designed to give you the boilerplate for your custom CSS. Here there are preset areas to help you target items in your DOM depending on the state of the menu.
Targeting the menu globally
Targeting the menu when its specifically not mobile
Targeting the menu when its at the breakpoint
Targeting the menu when its open on mobile
/* ----------------------YOUR CUSTOM CSS--------------------- */
// Global Mega Menu Styling
.mm {
//nest items here
}
// Specifically Not Mobile Menu
.mm:not(.brx-open) {
//nest items here
}
// Mega Menu Styling Only At Breakpoint
@media (max-width: $navigation-breakpoint) {
.mm {
//nest items here
}
}
// Mega Menu Styling On Mobile Menu
.mm.brx-open {
//nest items here
}
/* -----------------------END OF YOUR CUSTOM CSS-------------------- */Last updated