@import "colors";
@import "compass/utilities/links/link-colors";
@import "compass/utilities/general/float";

$blueprint-font-family: "Helvetica Neue", Arial, Helvetica, sans-serif !default;

$blueprint-fixed-font-family: "andale mono", "lucida console", monospace !default;

$blueprint-font-size: 12px !default;

// Usage examples:
// As a top-level mixin, apply to any page that includes the stylesheet:
// <pre class="source-code sass">
// +blueprint-typography
// </pre>
//
// Scoped by a presentational class:
// <pre class="source-code sass">
// body.blueprint
//  +blueprint-typography(true)
// </pre>
//
// Scoped by semantic selectors:
// <pre class="source-code sass">
// body#page-1, body#page-2, body.a-special-page-type
//   +blueprint-typography(true)
// </pre>
@mixin blueprint-typography($nested: false) {
  @if $nested {
    @include blueprint-typography-body;
    @include blueprint-typography-defaults;
  } @else {
    body { @include blueprint-typography-body; }
    @include blueprint-typography-defaults;
  }
}

@mixin normal-text      { font-family: $blueprint-font-family; color: $font-color; }
@mixin fixed-width-text { font: 1em $blueprint-fixed-font-family; line-height: 1.5; }
@mixin header-text      { font-weight: normal; color: $header-color; }
@mixin quiet            { color: $quiet-color; }
@mixin loud             { color: $loud-color; }

@mixin blueprint-typography-body($font-size: $blueprint-font-size) {
  line-height: 1.5;
  @include normal-text;
  font-size: 100% * $font-size / 16px;
}

@mixin blueprint-typography-defaults {
  #{headers(all)} { @include header-text;
    img           { margin: 0; } }
  h1              { font-size: 3em;   line-height: 1;    margin-bottom: 0.50em; }
  h2              { font-size: 2em;                      margin-bottom: 0.75em; }
  h3              { font-size: 1.5em; line-height: 1;    margin-bottom: 1.00em; }
  h4              { font-size: 1.2em; line-height: 1.25; margin-bottom: 1.25em; }
  h5              { font-size: 1em;   font-weight: bold; margin-bottom: 1.50em; }
  h6              { font-size: 1em;   font-weight: bold;                        }
  p               { margin: 0 0 1.5em; 
    .left         { @include float-left;  margin: 1.5em 1.5em 1.5em 0; padding: 0; }
    .right        { @include float-right; margin: 1.5em 0 1.5em 1.5em; padding: 0; } }
  a               { text-decoration: underline; @include link-colors($link-color, $link-hover-color, $link-active-color, $link-visited-color, $link-focus-color); }
  blockquote      { margin: 1.5em; color: $alt-text-color; font-style: italic; }
  strong, dfn     { font-weight: bold; }
  em, dfn         { font-style: italic; }
  sup, sub        { line-height: 0; }
  abbr, acronym   { border-bottom: 1px dotted #666666; }
  address         { margin: 0 0 1.5em; font-style: italic; }
  del             { color: $alt-text-color; }
  pre             { margin: 1.5em 0; white-space: pre; }
  pre, code, tt   { @include fixed-width-text; }
  li ul, li ol    { margin: 0; }
  ul, ol          { margin: 0 1.5em 1.5em 0; padding-left: 1.5em; }
  ul              { list-style-type: disc; }
  ol              { list-style-type: decimal; }
  dl              { margin: 0 0 1.5em 0;
    dt            { font-weight: bold; } }
  dd              { margin-left: 1.5em; }
  table           { margin-bottom: 1.4em; width: 100%; }
  th              { font-weight: bold; }
  thead th        { background: $blueprint-table-header-color; }
  th, td, caption { padding: 4px 10px 4px 5px; }
  table.striped tr:nth-child(even) td,
  table         tr.even            td
                  { background: $blueprint-table-stripe-color; }
  tfoot           { font-style: italic; }
  caption         { background: $blueprint-background-color; }
  .quiet          { @include quiet; }
  .loud           { @include loud; }
}