spaCy/website/assets/css/_layout/_header.sass
2016-04-01 01:24:48 +11:00

51 lines
1.2 KiB
Sass

// Header - Variables
// ============================================================================
$header-background : color($theme) pattern($theme)
$header-color-highlight : color($theme, dark)
$header-min-height : 250px
$header-padding : 4rem 5rem 5rem
$header-text-color : color(white)
$header-text-shadow : 2px 2px
$hero-credit-bottom : -2em
$hero-credit-right : 1em
// Header - Style
// ============================================================================
.header
background: $header-background
display: flex
flex-flow: column nowrap
justify-content: center
margin-top: $height-navbar
min-height: $header-min-height
text-align: center
.header-title
@extend .h0
color: $header-text-color
&.header-title--center
@extend .text-center
.header-body
color: $header-text-color
padding: $header-padding
text-align: left
.header-text
text-shadow: $header-text-shadow $header-color-highlight
// Hero image
.hero
position: relative
min-height: 0
.hero-credit
@extend .text-credit
@include position(absolute, bottom, right, $hero-credit-bottom, $hero-credit-right)