Files
openfoodnetwork/app/assets/stylesheets/darkswarm/tabs.css.sass

96 lines
2.0 KiB
Sass

@import typography
@import mixins
@import branding
// Foundation overrides
#tabs .tabs-content > .content p
max-width: 100% !important
.tabs-content > .content
padding-top: 0 !important
// Tabs styling
#tabs
background: url("/assets/gray_jean.png") top left repeat
@include box-shadow(inset 0 2px 3px 0 rgba(0,0,0,0.15))
display: block
color: $dark-grey
.header
text-align: center
text-transform: uppercase
color: $dark-grey
border-bottom: 1px solid $disabled-dark
margin-top: 0.75rem
margin-bottom: 0.75rem
padding-bottom: 0.25rem
font-size: 0.875rem
.panel
border-color: $clr-brick-bright
background-color: rgba(255, 255, 255, 0)
dl dd a
@include avenir
background: transparent
text-transform: uppercase
line-height: 50px
font-size: 0.875em
text-shadow: 0 -1px 1px #ffffff
&:hover, &:focus, &:active
color: $clr-brick-bright
@media all and (max-width: 768px)
line-height: 30px !important
border: none
&, &:hover
background: none
padding: 0px 2.2em
@media all and (max-width: 768px)
line-height: inherit !important
// inactive nav link
dl
dd
border-top: 4px solid transparent
a:after
padding-left: 8px
content: "\e634"
visibility: hidden
@include icon-font
dd:hover
a:after
visibility: visible
// active nav link
dl
dd.active
border-top: 4px solid $clr-brick
a
color: $clr-brick
a:after
content: "\e633"
visibility: visible
@include icon-font
// content revealed in accordion
.tabs-content
margin-bottom: 0
& > .content
background: none
border: none
img
margin: 0px 0px 0px 40px
p
max-width: 555px
@media all and (max-width: 768px)
height: auto !important
ul
list-style-type: none
padding-left: none
.panel
padding-bottom: 1.25em