_design-tokens.artifact.scss

// DO NOT EDIT THIS FILE.  This is a gitignored artifact created by Gulp.
// Design tokens should be edited in config.design-tokens.yml
$gesso: (
  palette: (
    brand: (
      blue: (
        base: #0071BC,
        light: #4773aa,
        light-1: #8ba6ca,
        light-2: #dce4ef,
        dark: #205493,
        dark-1: #112E51,
      ),
      ocean-blue: (
        base: #02bfe7,
        light: #9bdaf1,
        light-1: #e1f3f8,
        dark: #00a6d2,
        dark-1: #046b99,
      ),
      org-default: (
        uw-black: (
          lvl1: #dfdfdf,
          lvl2: #a2a2a2,
          lvl3: #787878,
          lvl4: #000,
          primary: #000,
        ),
        uw-gold: (
          lvl1: #fffaaa,
          lvl2: #ffea30,
          lvl3: #fdd54f,
          lvl4: #e4b429,
          primary: #fdd54f,
        ),
        uw-white: (
          lvl1: #fff,
          primary: #fff,
        ),
      ),
      org-ahs: (
        lvl1: #97dfef,
        lvl2: #00bed0,
        lvl3: #0098a5,
        lvl4: #005963,
        primary: #005963,
      ),
      org-art: (
        lvl1: #ffd5a5,
        lvl2: #fbaf00,
        lvl3: #e78100,
        lvl4: #d93f00,
        primary: #d93f00,
      ),
      org-eng: (
        lvl1: #d0b4ef,
        lvl2: #be33da,
        lvl3: #8100b4,
        lvl4: #57058b,
        primary: #57058b,
      ),
      org-env: (
        lvl1: #daf582,
        lvl2: #bed500,
        lvl3: #b4be00,
        lvl4: #607000,
        primary: #607000,
      ),
      org-mat: (
        lvl1: #ffbeef,
        lvl2: #ff63aa,
        lvl3: #df2498,
        lvl4: #c60078,
        primary: #c60078,
      ),
      org-sci: (
        lvl1: #b4d5ff,
        lvl2: #63a0ff,
        lvl3: #0073ce,
        lvl4: #0033be,
        primary: #0033be,
      ),
      org-ren: (
        green: #00693c,
        red: #de3831,
        gold: #d2c295,
      ),
      org-stj: (
        green: #01573e,
        gold: #c88a11,
      ),
      org-stp: (
        green: #879637,
        brown: #584528,
      ),
      org-cgc: (
        red: #c4262e,
      ),
      org-school: (
        lvl1: #ffa5aa,
        lvl2: #e41740,
        lvl3: #b71233,
        lvl4: #80001f,
        primary: #b71233,
      ),
    ),
    grayscale: (
      white: #fff,
      gray-1: #fafafa,
      gray-2: #eee,
      gray-3: #ccc,
      gray-4: #A2A2A2,
      gray-5: #757575,
      gray-6: #4e4e4e,
      gray-7: #333,
      black: #000,
    ),
    other: (
      yellow: (
        base: #fad980,
        light: #fff1d2,
      ),
      yellow-neon: (
        base: #ff0,
      ),
      green: (
        base: #4d8f46,
        dark: #0a6700,
        light: #e7f4e4,
      ),
      red: (
        base: #e31c3d,
        light: #e59393,
        light-1: #f9dede,
        dark: #cd2026,
        dark-1: #981b1e,
        orange-light: #f69231,
        orange-dark: #ef6114,
      ),
    ),
  ),
  box-shadow: (
    0: none,
    1: '0 1px 3px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24)',
    2: '0 3px 6px rgba(0, 0, 0, 0.16), 0 3px 6px rgba(0, 0, 0, 0.23)',
    3: '0 10px 20px rgba(0, 0, 0, 0.19), 0 6px 6px rgba(0, 0, 0, 0.23)',
    4: '0 14px 28px rgba(0, 0, 0, 0.25), 0 10px 10px rgba(0, 0, 0, 0.22)',
    5: '0 19px 38px rgba(0, 0, 0, 0.3), 0 15px 12px rgba(0, 0, 0, 0.22)',
    6: '0 0 10px rgba(0, 0, 0, 0.3) ,0 0 0 rgba(0, 0, 0, 0.3)',
  ),
  constrains: (
    sm: 800px,
    md: 1440px,
    lg: 2200px,
  ),
  breakpoints: (
    xs: 480px,
    sm: 641px,
    md: 769px,
    lg: 1011px,
    xl: 1200px,
    xxl: 1640px,
    onek: 1920px,
    twok: 2559px,
  ),
  colors: (
    text: (
      primary: #000,
      secondary: #4e4e4e,
      on-light: #000,
      on-dark: #fff,
      link: #4e4e4e,
      link-hover: #000,
      link-active: #4e4e4e,
      link-visited: #4e4e4e,
    ),
    background: (
      site: #fff,
    ),
    button: (
      default: (
        background: #757575,
        background-hover: #eee,
        background-active: #757575,
        text: #fff,
        text-hover: #4e4e4e,
        text-active: #fff,
      ),
      primary: (
        background: #4d8f46,
        background-hover: #0a6700,
        background-active: #0a6700,
        text: #fff,
        text-hover: #fff,
        text-active: #fff,
      ),
      secondary: (
        background: #02bfe7,
        background-hover: #00a6d2,
        background-active: #046b99,
        text: #fff,
        text-hover: #fff,
        text-active: #fff,
      ),
      disabled: (
        background: #eee,
        text: #A2A2A2,
      ),
      danger: (
        background: #e31c3d,
        background-hover: #cd2026,
        background-active: #981b1e,
        text: #fff,
        text-hover: #fff,
        text-active: #fff,
      ),
      cancel: (
        background: #f69231,
        background-hover: #ef6114,
        background-active: #ef6114,
        text: #fff,
        text-hover: #fff,
        text-active: #fff,
      ),
    ),
    form: (
      background: #fafafa,
      background-active: #fff,
      background-checked: #0071BC,
      background-unchecked: #fff,
      border: #ccc,
      border-dark: #757575,
      border-light: #fafafa,
      input: (
        input-background: #fff,
        input-border: #ccc,
        input-border-focus: #757575,
        input-color: #4e4e4e,
        input-outline: #eee,
        input-focus: #757575,
      ),
      fieldset: (
        fieldset-background: #fafafa,
      ),
      thumb: #757575,
      track: #A2A2A2,
    ),
    mark: (
      background: #ff0,
      text: #000,
    ),
    selection: (
      background: #0071BC,
      text: #fff,
    ),
    table: (
      border: #757575,
      background: #fff,
      background-head: #eee,
      background-foot: #eee,
    ),
    ui: (
      generic: (
        background: #A2A2A2,
        background-darker: #000,
        background-dark: #757575,
        background-light: #eee,
        background-lighter: #fafafa,
        border: #A2A2A2,
        border-dark: #4e4e4e,
        border-light: #eee,
        text-lighter: #fff,
        text-light: #A2A2A2,
        text-dark: #757575,
        text-darker: #000,
        accent: #000,
        accent-dark: #e4b429,
        accent-light: #ffea30,
        focus: #000,
      ),
      error: (
        background: #f9dede,
        border: #e59393,
      ),
      success: (
        background: #e7f4e4,
        border: #4d8f46,
      ),
      warning: (
        background: #fff1d2,
        border: #fad980,
      ),
    ),
  ),
  typography: (
    font-family: (
      primary: (
        name: Primary,
        stack: 'georgia, "droid serif", "Times New Roman", Times, serif',
      ),
      secondary: (
        name: Secondary,
        stack: 'BureauGrot, impact, "avenir next condensed heavy", "Droid Sans", sans-serif;',
      ),
      book: (
        name: Book,
        stack: '"BureauGrot Book", impact, "avenir next condensed heavy", "Droid Sans", sans-serif',
      ),
      condensed: (
        name: Condensed,
        stack: 'BureauGrotCond, impact, "avenir next condensed heavy", "Droid Sans", sans-serif',
      ),
      condensedbook: (
        name: Condensed-Book,
        stack: '"BureauGrotCond Book", impact, "avenir next condensed heavy", "Droid Sans", sans-serif',
      ),
      system: (
        name: 'System  Typ1451-Regular',
        stack: 'Typ1451-Regular,-apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Oxygen-Sans", Ubuntu, Cantarell, "Fira Sans", Droid Sans, sans-serif',
      ),
      systemlight: (
        name: 'System light Typ1451-Light',
        stack: 'Typ1451-light,-apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Oxygen-Sans", Ubuntu, Cantarell, "Fira Sans", Droid Sans, sans-serif',
      ),
      systemmedium: (
        name: 'System Medium  Typ1451-Medium',
        stack: 'Typ1451-Medium,-apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Oxygen-Sans", Ubuntu, Cantarell, "Fira Sans", Droid Sans, sans-serif',
      ),
      systembold: (
        name: 'System Bold  Typ1451-Bold',
        stack: 'Typ1451-Bold,-apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Oxygen-Sans", Ubuntu, Cantarell, "Fira Sans", Droid Sans, sans-serif',
      ),
      monospace: (
        name: Monospace,
        stack: 'Consolas, "Lucida Console", "Liberation Mono", "Courier New", monospace, sans-serif',
      ),
      iconfont: (
        name: icon-font,
        stack: fdsu-rwd,
      ),
    ),
    base-font-size: 16px,
    font-size: (
      0: 16px,
      1: 18px,
      2: 20.256px,
      3: 22.784px,
      4: 25.632px,
      5: 28.832px,
      6: 32.432px,
      7: 36.496px,
      8: 41.056px,
      9: 46.192px,
      10: 51.952px,
      11: 58.448px,
      12: 65.76px,
      13: 73.984px,
      14: 83.232px,
      15: 93.632px,
      16: 105.328px,
      -6: 7.888px,
      -5: 8.88px,
      -4: 9.984px,
      -3: 11.232px,
      -2: 12.64px,
      -1: 14.22224px,
    ),
    font-weight: (
      hairline: 200,
      light: 300,
      regular: 400,
      bold: 600,
      semibold: 600,
      extrabold: 700,
      black: 800,
    ),
    line-height: (
      tight: 1.1,
      base: 1.45,
      loose: 1.7,
    ),
    display: (
      display: (
        font-family: 'georgia, "droid serif", "Times New Roman", Times, serif',
        font-size: 41.056px,
        font-weight: 400,
      ),
      h1: (
        font-family: '"BureauGrotCond Book", impact, "avenir next condensed heavy", "Droid Sans", sans-serif',
        font-size: 41.056px,
        font-weight: 400,
        line-height: 1.1,
      ),
      h2: (
        font-family: '"BureauGrotCond Book", impact, "avenir next condensed heavy", "Droid Sans", sans-serif',
        font-size: 28.832px,
        font-weight: 400,
        line-height: 1.1,
      ),
      h3: (
        font-family: '"BureauGrotCond Book", impact, "avenir next condensed heavy", "Droid Sans", sans-serif',
        font-size: 22.784px,
        font-weight: 400,
        line-height: 1.1,
      ),
      h4: (
        font-family: '"BureauGrotCond Book", impact, "avenir next condensed heavy", "Droid Sans", sans-serif',
        font-size: 20.256px,
        font-weight: 400,
        line-height: 1.1,
      ),
      h5: (
        font-family: '"BureauGrotCond Book", impact, "avenir next condensed heavy", "Droid Sans", sans-serif',
        font-size: 18px,
        font-weight: 400,
        line-height: 1.1,
      ),
      h6: (
        font-family: '"BureauGrotCond Book", impact, "avenir next condensed heavy", "Droid Sans", sans-serif',
        font-size: 16px,
        font-weight: 400,
        line-height: 1.1,
      ),
      blockquote: (
        font-family: 'georgia, "droid serif", "Times New Roman", Times, serif',
        font-size: 22.784px,
        font-weight: 400,
        line-height: 1.45,
      ),
      body: (
        color: #000,
        font-family: 'georgia, "droid serif", "Times New Roman", Times, serif',
        font-size: 16px,
        font-weight: 400,
        line-height: 1.45,
      ),
      body-large: (
        color: #000,
        font-family: 'georgia, "droid serif", "Times New Roman", Times, serif',
        font-size: 20.256px,
        font-weight: 400,
        line-height: 1.45,
      ),
      cite: (
        color: #4e4e4e,
        font-family: 'georgia, "droid serif", "Times New Roman", Times, serif',
        font-size: 16px,
        font-style: normal,
        font-weight: 600,
        letter-spacing: .02rem,
        line-height: 1.1,
      ),
      input: (
        color: #4e4e4e,
        font-family: 'Typ1451-Medium,-apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Oxygen-Sans", Ubuntu, Cantarell, "Fira Sans", Droid Sans, sans-serif',
        font-size: 16px,
        font-style: normal,
        font-weight: 600,
        letter-spacing: .02rem,
        line-height: 1.1,
      ),
    ),
  ),
  transitions: (
    ease: (
      ease-in-out: 'cubic-bezier(0.4, 0, 0.2, 1)',
      ease-out: 'cubic-bezier(0.0, 0, 0.2, 1)',
      ease-in: 'cubic-bezier(0.4, 0, 1, 1)',
      sharp: 'cubic-bezier(0.4, 0, 0.6, 1)',
    ),
    duration: (
      shortest: 150ms,
      short: 200ms,
      standard: 375ms,
      long: 400ms,
      intro: 270ms,
      outro: 195ms,
    ),
  ),
  z-index: (
    modal: 10,
    drawer: 9,
    overlay: 9,
    nav: 8,
    logo: 8,
    dropdown: 7,
    mobilemenu: 6,
    interact: 5,
    header: 4,
    content: 3,
    footer: 2,
    slides: 2,
    wrapper: 2,
    background: 1,
  ),
  spacing: (
    xxs: 4px,
    xs: 8px,
    sm: 16px,
    md: 24px,
    lg: 32px,
    xl: 56px,
    xxl: 96px,
  ),
  gutter-width: 40px,
);