mirror of
https://github.com/openfoodfoundation/openfoodnetwork
synced 2026-02-05 22:26:07 +00:00
135 lines
3.1 KiB
Sass
135 lines
3.1 KiB
Sass
@import compass
|
|
@import branding
|
|
@import mixins
|
|
@import typography
|
|
@import variables
|
|
|
|
|
|
nav
|
|
@include textpress
|
|
text-shadow: none
|
|
|
|
// Create center style for nav ul (foundation provides left and right)
|
|
text-align: center
|
|
.top-bar-section
|
|
// Avoid menu items blocking logo
|
|
li:not(.has-form), li:not(.has-form) a:not(.button), li:not(.has-form) a:not(.button):hover
|
|
background-color: transparent
|
|
|
|
ul.center
|
|
display: inline-block
|
|
// By default, we center between the left and right uls, but we want to be centered
|
|
// relative to the whole page. The difference in width between the other uls is 74px,
|
|
// so we offset by that amount here.
|
|
margin-left: -74px
|
|
|
|
.joyride-tip-guide .button
|
|
text-shadow: none
|
|
|
|
// Default overrides - big menu
|
|
.top-bar-section .has-dropdown > a
|
|
padding-right: $topbar-height / 2 !important
|
|
|
|
i.ofn-i_022-cog
|
|
font-size: 24px
|
|
line-height: $topbar-height
|
|
|
|
.top-bar-section .has-dropdown > a:after
|
|
display: none
|
|
|
|
.top-bar-section ul li > a
|
|
font-size: 0.75rem
|
|
height: $topbar-height
|
|
opacity: 0.8
|
|
&:hover, &:focus, &:active
|
|
opacity: 1
|
|
@include transition(all 0.3s ease-in-out)
|
|
|
|
.top-bar-section ul li.ofn-logo > a
|
|
display: table-cell
|
|
vertical-align: middle
|
|
opacity: 1
|
|
|
|
.nav-branded
|
|
color: $australia-orange
|
|
span
|
|
font-size: 13px
|
|
.nav-primary
|
|
@include headingFont
|
|
font-size: 0.875rem
|
|
font-weight: 300
|
|
ul .nav-primary
|
|
text-transform: uppercase
|
|
ul.dropdown
|
|
border: 1px solid $smoke
|
|
border-top: none
|
|
|
|
|
|
// Mobile Menu
|
|
|
|
.tab-bar
|
|
background-color: white
|
|
|
|
.off-canvas-wrap.move-right .tab-bar .menu-icon
|
|
@include box-shadow(inset 0 0 6px 2px rgba(0,0,0,0.5))
|
|
|
|
.off-canvas-wrap .tab-bar .menu-icon
|
|
@include box-shadow(none)
|
|
|
|
.off-canvas-wrap.move-right .tab-bar .menu-icon span
|
|
-moz-box-shadow: 0 0px 0 1px #666, 0 7px 0 1px #666, 0 14px 0 1px #666
|
|
-webkit-box-shadow: 0 0px 0 1px #666, 0 7px 0 1px #666, 0 14px 0 1px #666
|
|
box-shadow: 0 0px 0 1px #666, 0 7px 0 1px #666, 0 14px 0 1px #666
|
|
|
|
.tab-bar .menu-icon span::after
|
|
box-shadow: 0 0 0 1px black, 0 7px 0 1px black, 0 14px 0 1px black
|
|
|
|
.left-off-canvas-menu
|
|
background-color: white
|
|
|
|
.off-canvas-wrap.move-right ul.off-canvas-list
|
|
font-size: 0.875rem
|
|
|
|
.li-menu
|
|
@include headingFont
|
|
font-size: 1rem
|
|
a
|
|
color: rgba(0, 0, 0, 0.9)
|
|
li a
|
|
color: rgba(0, 0, 0, 0.9)
|
|
&:hover
|
|
background-color: transparent
|
|
color: $australia-orange
|
|
@include transition(all 0.3s ease-in-out)
|
|
|
|
.off-canvas-wrap.move-right ul.off-canvas-list i
|
|
font-size: 1.5rem
|
|
margin-right: 0.25rem
|
|
|
|
|
|
|
|
// Responsive
|
|
|
|
@media screen and (max-width: 1350px)
|
|
nav .top-bar-section
|
|
ul li a, .has-dropdown > a
|
|
padding: 0 $topbar-height / 4 !important
|
|
|
|
ul.center
|
|
margin-left: -24px
|
|
|
|
|
|
@media screen and (min-width: 1025px)
|
|
body.off-canvas
|
|
// padding required to placehold for fixed menu bar
|
|
padding-top: $topbar-height
|
|
|
|
|
|
@media screen and (max-width: 1025px)
|
|
body.off-canvas
|
|
// padding required to placehold for fixed menu bar
|
|
padding-top: 0
|
|
section.right
|
|
.nav-branded
|
|
padding: 0 1em
|