aardvarks/itsback.at

View on GitHub
assets/stylesheets/utilities/settings.styl

Summary

Maintainability
Test Coverage
//
// BREAKPOINTS AND MEDIA QUERIES
// Setup standard widths to pass to media queries
//

$mq--mobile--portrait  = 300px
$mq--mobile--landscape = 400px
$mq--tablet--portrait  = 550px
$mq--tablet--landscape = 800px
$mq--desktop--small    = 960px
$mq--desktop--medium   = 1280px
$mq--desktop--large    = 1600px

// Common aliases
$mq--mobile  = $mq--mobile--portrait
$mq--tablet  = $mq--tablet--portrait
$mq--desktop = $mq--desktop--small


//
// COLOURS
// Palette from:
// https://www.google.com/design/spec/style/color.html#color-color-palette
//

$color--white          = #ffffff
$color--blue-grey--50  = #607D8B
$color--blue-grey--100 = #CFD8DC
$color--blue-grey--200 = #B0BEC5
$color--blue-grey--300 = #90A4AE
$color--blue-grey--400 = #78909C
$color--blue-grey--500 = #607D8B
$color--blue-grey--600 = #546E7A
$color--blue-grey--700 = #455A64
$color--blue-grey--800 = #37474F
$color--blue-grey--900 = #263238

$color--primary = $color--blue-grey--50


//
// BASE
//

$base--font-family      = 'Gill Sans', 'Tahoma', sans-serif
$base--font-color       = $color--blue-grey--50
$base--background-color = $color--blue-grey--900
$base--spacing          = 20px