// ==================
// EDGE TYPOGRAPHY
// ==================

// BODY
$body-background  : #fff !default;
$body-font-color  : #222 !default;
$body-font-weight : 400 !default;

// Compass' VERTICAL RHYTM
// note: variable for $body-font-size and $body-line-height is in _base.scss due to it being used in em conversion
$base-font-size   : $body-font-size;
$base-line-height : $body-line-height;

// FONT FAMILY
$header-font-family : Helvetica, Arial, "sans-serif" !default;
$body-font-family   : Helvetica, Arial, "sans-serif" !default;

// HEADER
$h1-font-size : 44px !default;
$h2-font-size : 36px !default;
$h3-font-size : 28px !default;
$h4-font-size : 22px !default;
$h5-font-size : 18px !default;
$h6-font-size : 16px !default;

$header-font-color  : $body-font-color !default;
$header-font-weight : 700 !default;

// LIST
$ul-parent-style  : disc !default;
$ul-child-style   : circle !default;

$ol-parent-style  : decimal !default;
$ol-child-style   : lower-alpha !default;

// ------------------------------------------------
// VERTICAL RHYTHM
// - Apply vertically-aligned paragraph and header
// ------------------------------------------------
@mixin vertical-rhythm(
  $font-size   : $base-font-size,
  $line-height : $base-line-height,
  $for-base    : false) {

  $base-font-size   : $font-size;
  $base-line-height : $font-size * $line-height;
  
  @if not $for-base {
    font-size: em($font-size);
    line-height: $line-height;
  }
  
  h1 { @include adjust-font-size-to($h1-font-size); }
  h2 { @include adjust-font-size-to($h2-font-size); }
  h3 { @include adjust-font-size-to($h3-font-size); }
  h4 { @include adjust-font-size-to($h4-font-size); }
  h5 { @include adjust-font-size-to($h5-font-size); }
  h6 { @include adjust-font-size-to($h6-font-size); }
  
  p {
    @include trailer(1);

    &:last-child {
      @include trailer(0);
    }
  }

  ul,
  ol {
    @include trailer(1);
  }
}

// ------------------------------
// BASELINE
// - Create notebook-like row
// ------------------------------
@mixin baseline(
  $font-size   : $base-font-size,
  $line-height : $base-line-height) {

  @include background(
    linear-gradient(to bottom, rgba(black, 0) 95%, rgba(black, .1) 100%)
  );
  background-size: 100% em($font-size * $line-height, $font-size);
}

// ----------------------
// Create Inline List
// ----------------------
@mixin inline-list() {
  @include clearfix();

  > li {
    display: inline-block;
    float: left;
    vertical-align: top;
  }
}

@if $include-typography and not $user-mode {

/* -----------------
  EDGE Typography
----------------- */

body {
  position: relative;
  background: $body-background;
  font-size: $base-font-size;
  font-family: $body-font-family;
  font-weight: $body-font-weight;
  line-height: $base-line-height;
  color: $body-font-color;
}

h1, h2, h3, h4, h5, h6 {
  color: $header-font-color;
  font-family: $header-font-family;
  font-weight: $header-font-weight;
}

a {
  color: $link-color;
}


h1 { font-size: em($h1-font-size); }
h2 { font-size: em($h2-font-size); }
h3 { font-size: em($h3-font-size); }
h4 { font-size: em($h4-font-size); }
h5 { font-size: em($h5-font-size); }
h6 { font-size: em($h6-font-size); }

p {
  margin-top: 0;
  margin-bottom: 0;
}

// -----------
// LIST
// -----------

.inline-list {
  @include inline-list();
}

ul {
  list-style-type: $ul-parent-style;
  padding-left: 20px;
  
  &[class] {
    list-style-type: none;
    padding-left: 0;
  }

  ul {
    list-style-type: $ul-child-style;
  }
}

ol {
  list-style-type: $ol-parent-style;
  padding-left: 25px;

  ol {
    list-style-type: $ol-child-style;
  }
}

blockquote {
  cite {
    display: block;
    font-style: italic;
  }
}

} // include-typography