Files
openfoodnetwork/app/assets/stylesheets/darkswarm/groups.css.sass
2015-05-04 18:23:04 +10:00

107 lines
2.6 KiB
Sass

@import branding
@import mixins
@import typography
// Search page
#groups
background-color: lighten($clr-brick, 56%)
background-image: url("/assets/groups.svg")
background-position: center 50px
background-repeat: no-repeat
background-size: 922px 922px
@include sidepaddingSm
@include panepadding
a > .group-name
&:hover, &:focus, &:active
text-decoration: underline
.groups-icons
text-align: right
a
font-size: 1.5em
.groups-header
border: 2px solid $clr-brick-light-bright
@include border-radius-mixed(0.5em, 0.5em, 0, 0)
margin: -1rem 0 1rem
padding: 1rem 0.9375rem
@media screen and (min-width: 640px)
border: 0 none
@include border-radius(0)
margin: 0
padding: 0
.group
padding-bottom: 0.5em
.row div
font-size: 110%
.row a
vertical-align: middle
.ofn-i_035-groups
font-size: 120%
vertical-align: middle
// Individual Page
#group-page
.group-logo, .group-header
text-align: center
.group-logo
padding-bottom: 1em
max-height: 200px
.group-name
border-bottom: 1px solid #ccc
@media screen and (min-width: 768px)
.group-logo, .group-header
text-align: left
.group-logo
max-height: 120px
float: left
padding-right: 1em
background-color: white
// Tabs
.tabs dd a // Mobile first
padding: 0.25rem 0.45rem 0rem
font-size: 0.75rem
border: none
margin-bottom: -2px
margin-right: 2px
text-transform: capitalize
@include headingFont
@include border-radius(1em 0.25em 0 0)
@include gradient($disabled-light, $disabled-bright)
@media screen and (min-width: 768px)
.tabs dd a
padding: 0.5rem 1rem 0.25em
font-size: 0.875rem
@include border-radius(1.5em 0.25em 0 0)
@media screen and (min-width: 1024px)
.tabs dd a
padding: 0.75rem 1.5rem 0.5em
font-size: 1rem
@include border-radius(2em 0.25em 0 0)
.tabs dd.active a
@include gradient(white, white)
margin-bottom: -1px
border-top: 1px solid $light-grey
border-left: 1px solid $light-grey
border-right: 1px solid $light-grey
border-bottom: 0
.tabs-content
border-top: 1px solid $light-grey
border-left: 1px solid $light-grey
border-right: 1px solid $light-grey
border-bottom: 1px solid $light-grey
padding: 1.5em
// Producers tab
.producers
background-image: none
.active_table .active_table_node a.is_distributor, .active_table .active_table_node a.is_distributor i.ofn-i_059-producer
color: $clr-turquoise
// Hubs tab
.hubs
background-image: none
padding-top: 0
padding-bottom: 0