@aesthetic/design-systems/lib/material/index.js

Collection of design systems, including Aesthetic's.

'use strict';

const core = require('@aesthetic/core');
/* Auto-generated by Aesthetic. Do not modify! */


const design = new core.Design('material-design', {
  border: {
    sm: {
      radius: '0.14rem',
      // 2px
      width: '0.07rem' // 1px

    },
    df: {
      radius: '0.29rem',
      // 4px
      width: '0.14rem' // 2px

    },
    lg: {
      radius: '0.43rem',
      // 6px
      width: '0.21rem' // 3px

    }
  },
  breakpoint: {
    xs: {
      query: 'screen and (min-width: 42.86em)',
      querySize: 600,
      rootLineHeight: 1.53,
      rootTextSize: '14.94px'
    },
    sm: {
      query: 'screen and (min-width: 64.29em)',
      querySize: 900,
      rootLineHeight: 1.63,
      rootTextSize: '15.94px'
    },
    md: {
      query: 'screen and (min-width: 85.71em)',
      querySize: 1200,
      rootLineHeight: 1.74,
      rootTextSize: '17.01px'
    },
    lg: {
      query: 'screen and (min-width: 109.71em)',
      querySize: 1536,
      rootLineHeight: 1.85,
      rootTextSize: '18.15px'
    },
    xl: {
      query: 'screen and (min-width: 137.14em)',
      querySize: 1920,
      rootLineHeight: 1.98,
      rootTextSize: '19.36px'
    }
  },
  heading: {
    l1: {
      letterSpacing: '-1.50px',
      lineHeight: 1.17,
      size: '6.86rem' // 96px

    },
    l2: {
      letterSpacing: '-0.50px',
      lineHeight: 1.2,
      size: '4.29rem' // 60px

    },
    l3: {
      letterSpacing: '0px',
      lineHeight: 1.17,
      size: '3.43rem' // 48px

    },
    l4: {
      letterSpacing: '0.25px',
      lineHeight: 1.24,
      size: '2.43rem' // 34px

    },
    l5: {
      letterSpacing: '0px',
      lineHeight: 1.33,
      size: '1.71rem' // 24px

    },
    l6: {
      letterSpacing: '0.15px',
      lineHeight: 1.6,
      size: '1.43rem' // 20px

    }
  },
  shadow: {
    xs: {
      x: '0rem',
      // 0px
      y: '0.07rem',
      // 1px
      blur: '0.07rem',
      // 1px
      spread: '0rem' // 0px

    },
    sm: {
      x: '0rem',
      // 0px
      y: '0.43rem',
      // 6px
      blur: '0.71rem',
      // 10px
      spread: '0rem' // 0px

    },
    md: {
      x: '0rem',
      // 0px
      y: '0.86rem',
      // 12px
      blur: '1.21rem',
      // 17px
      spread: '0.14rem' // 2px

    },
    lg: {
      x: '0rem',
      // 0px
      y: '1.36rem',
      // 19px
      blur: '2.07rem',
      // 29px
      spread: '0.14rem' // 2px

    },
    xl: {
      x: '0rem',
      // 0px
      y: '1.71rem',
      // 24px
      blur: '2.71rem',
      // 38px
      spread: '0.21rem' // 3px

    }
  },
  spacing: {
    xxs: '0.07rem',
    // 1px
    xs: '0.14rem',
    // 2px
    sm: '0.29rem',
    // 4px
    df: '0.57rem',
    // 8px
    md: '0.86rem',
    // 12px
    lg: '1.14rem',
    // 16px
    xl: '1.71rem',
    // 24px
    xxl: '2.29rem',
    // 32px
    type: 'unit',
    unit: 8
  },
  text: {
    sm: {
      lineHeight: 1.6,
      size: '0.86rem' // 12px

    },
    df: {
      lineHeight: 1.43,
      size: '1rem' // 14px

    },
    lg: {
      lineHeight: 1.5,
      size: '1.14rem' // 16px

    }
  },
  typography: {
    font: {
      heading: '"Roboto", "Helvetica", "Arial", sans-serif',
      locale: {},
      monospace: 'Menlo, Monaco, Consolas, "Lucida Console", "Liberation Mono", "Courier New", monospace',
      text: '"Roboto", "Helvetica", "Arial", sans-serif',
      system: '-apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji"'
    },
    rootLineHeight: 1.43,
    rootTextSize: '14px'
  }
});
module.exports = design;
//# sourceMappingURL=index.js.map