assets/stylesheets/utilities/settings.styl
//
// 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