typerules/lib/_variables.styl

A typography toolkit that sets vertical rhythm and provides type functions.

// Colors
$color ?= {
  bg: #FFF
  font: #000
}

$selection-color ?= {
  bg: $color.font,
  font: $color.bg
}

$debug-color-line ?= {
  primary: rgba(233, 0, 0, .8)
  secondary: rgba(0, 233, 0, .6)
}

// Typography
$font-family-serif ?= Georgia, "Times New Roman", Times, serif
$font-family-sans ?= -apple-system, BlinkMacSystemFont, "Segoe UI", "Roboto", "Oxygen", "Ubuntu", "Cantarell", "Fira Sans", "Droid Sans", "Helvetica Neue", Helvetica, Arial, sans-serif
$font-family-mono ?= 'Lucida Console', Monaco, "Courier New", Courier, monospace
$font-family-base ?= $font-family-sans


$header ?= {
  weight: bold
  h1: 36px
  h2: 32px
  h3: 30px
  h4: 28px
  h5: 24px
  h6: 20px
}

// Vertical Rhythmn
$debug-vertical-rhythm ?= true
$show-secondary-debug-line ?= false

$debug-line-divisions ?= 4

// The default base font size.
$base-font-size ?= 16px

// The base line height determines the basic unit of vertical rhythm.
$base-line-height ?= 24px

// Set the default border style for rhythm borders.
$default-rhythm-border-style ?= solid black

$header-weight ?= bold

// Allows the `adjust-font-size-to` mixin and the `lines-for-font-size` function
// to round the line height to the nearest half line height instead of the
// nearest integral line height to avoid large spacing between lines.
$round-to-nearest-half-line ?= false

// Ensure there is at least this many pixels of vertical padding above and below the text.
$min-line-padding ?= 2px


/* Support */

// Use em units to support < ie11
$support ?= false

// Set to false if you want to use absolute pixels in sizing your typography.
$relative-font-sizing ?= false