Skip to content

Commit

Permalink
build: update design tokens
Browse files Browse the repository at this point in the history
  • Loading branch information
ModulesUnraveled committed Mar 22, 2022
1 parent b750fa0 commit f434675
Show file tree
Hide file tree
Showing 3 changed files with 1,142 additions and 0 deletions.
227 changes: 227 additions & 0 deletions build/css/tokens.css
Original file line number Diff line number Diff line change
@@ -0,0 +1,227 @@
/**
* Do not edit directly
* Generated on Tue, 22 Mar 2022 22:27:51 GMT
*/

:root {
--radius-20: 1.25rem;
--radius-10: 0.625rem;
--radius-4: 0.25rem;
--radius-0: 0rem;
--drop-shadow-level-4: 0px 0.9975153207778931px 1.9285296201705933px 0px #00000012,0px 3.3504464626312256px 6.477529525756836px 0px #00000012,0px 15px 28px 0px #00000059;
--drop-shadow-level-3: 0px 0.33000001311302185px 1.7290265560150146px 0px #0000001a,0px 2.4700000286102295px 2.809999942779541px 0px #0000001f,0px 16px 23px 0px #00000038;
--drop-shadow-level-2: 0px 0.5985091924667358px 0.7980122566223145px 0px #00000014,0px 2.010267734527588px 2.680356979370117px 0px #0000001c,0px 9px 12px 0px #00000030;
--drop-shadow-level-1: 0px 1px 2px 0px #00000029,0px 4px 4px 0px #00000017,0px 6px 8px 0px #00000021;
--font-size-61: 3.8125rem;
--font-size-58: 3.625rem;
--font-size-55: 3.4375rem;
--font-size-49: 3.0625rem;
--font-size-46: 2.875rem;
--font-size-43: 2.6875rem;
--font-size-41: 2.5625rem;
--font-size-39: 2.4375rem;
--font-size-38: 2.375rem;
--font-size-36: 2.25rem;
--font-size-33: 2.0625rem;
--font-size-30: 1.875rem;
--font-size-28: 1.75rem;
--font-size-27: 1.6875rem;
--font-size-26: 1.625rem;
--font-size-25: 1.5625rem;
--font-size-24: 1.5rem;
--font-size-23: 1.4375rem;
--font-size-22: 1.375rem;
--font-size-20: 1.25rem;
--font-size-19: 1.1875rem;
--font-size-18: 1.125rem;
--font-size-17: 1.0625rem;
--font-size-16: 1rem;
--font-size-15: 0.9375rem;
--font-size-14: 0.875rem;
--font-size-13: 0.8125rem;
--font-families-yalenew: YaleNew, serif;
--font-families-mallory: Mallory, sans-serif;
--font-families-mallory-compact: 'Mallory Compact', sans-serif;
--color-gray-800: hsl(0, 0%, 13%);
--color-gray-700: hsl(0, 0%, 25%);
--color-gray-600: hsl(0, 0%, 37%);
--color-gray-500: hsl(0, 0%, 46%);
--color-gray-400: hsl(0, 0%, 61%);
--color-gray-300: hsl(0, 0%, 73%);
--color-gray-200: hsl(0, 0%, 85%);
--color-gray-100: hsl(0, 0%, 97%);
--color-basics-brown-gray: hsl(28, 7%, 44%);
--color-basics-beige: hsl(35, 74%, 95%);
--color-basics-black: hsl(0, 0%, 0%);
--color-basics-white: hsl(0, 0%, 100%);
--color-blue-light: hsl(213, 100%, 69%);
--color-blue-medium: hsl(213, 66%, 45%);
--color-blue-yale: hsl(210, 100%, 21%);
--site-header-layout-right-flex-direction: row;
--site-header-layout-center-flex-direction: column;
--site-header-layout-left-flex-direction: column;
--font-text-transform-h6-mallory-compact-book: uppercase;
--font-text-transform-h6-mallory-compact-medium: uppercase;
--font-text-transform-h6-yale-new: uppercase;
--font-letter-spacing-h6-mallory-compact-book: 0.02em;
--font-letter-spacing-h2-mallory-compact-book: -0.01em;
--font-letter-spacing-h1-mallory-compact-book: -0.01em;
--font-letter-spacing-h6-mallory-compact-medium: 0.02em;
--font-letter-spacing-h2-mallory-compact-medium: -0.01em;
--font-letter-spacing-h1-mallory-compact-medium: -0.01em;
--font-letter-spacing-h6-yale-new: 0.03em;
--font-weights-yalenew-bold: 500;
--font-weights-yalenew-roman: 400;
--font-weights-mallory-medium: 500;
--font-weights-mallory-book: 400;
--size-thickness-hairline: 0.031rem;
--size-thickness-8: 0.5rem;
--size-thickness-6: 0.375rem;
--size-thickness-4: 0.25rem;
--size-thickness-2: 0.125rem;
--size-thickness-1: 0.063rem;
--size-thickness-0: 0rem;
--size-spacing-13: 10rem;
--size-spacing-12: 6rem;
--size-spacing-11: 5rem;
--size-spacing-10: 4rem;
--size-spacing-9: 3rem;
--size-spacing-8: 2.5rem;
--size-spacing-7: 2rem;
--size-spacing-6: 1.5rem;
--size-spacing-5: 1rem;
--size-spacing-4: 0.75rem;
--size-spacing-3: 0.5rem;
--size-spacing-2: 0.25rem;
--size-spacing-1: 0.125rem;
--size-spacing-0: 0rem;
--size-click-target-minimum: 2.75rem;
--size-component-layout-width-content: 49.375rem;
--size-component-layout-width-highlight: 65rem;
--size-component-layout-width-feature: 84rem;
--size-component-layout-width-max: 150rem;
--layout-flex-position-right: flex-end;
--layout-flex-position-center: center;
--layout-flex-position-left: flex-start;
--layout-width-100: 100%;
--layout-width-75: 75%;
--layout-width-50: 50%;
--layout-width-25: 25%;
--break-max-width: 2400px;
--break-2xl: 1400px;
--break-xl: 1200px;
--break-l: 992px;
--break-m: 768px;
--break-s: 576px;
--link-styles-no-underline-transform-hover: scale(1, 1);
--link-styles-no-underline-transform: scale(0, 1);
--link-styles-underline-transform-hover: scale(0, 1);
--link-styles-underline-transform: scale(1, 1);
--site-header-layout-center-align: var(--layout-flex-position-center);
--site-header-layout-center-justify: var(--layout-flex-position-center);
--site-header-layout-left-align: var(--layout-flex-position-left);
--site-header-layout-left-justify: var(--layout-flex-position-left);
--site-header-themes-blue-yale-divider-color: var(--color-gray-500);
--site-header-themes-blue-yale-border-color: var(--color-blue-light);
--site-header-themes-blue-yale-site-branding: var(--color-basics-white);
--site-header-themes-blue-yale-yale-branding: var(--color-blue-light);
--site-header-themes-blue-yale-background: var(--color-blue-yale);
--site-header-themes-white-divider-color: var(--color-gray-300);
--site-header-themes-white-border-color: var(--color-blue-yale);
--site-header-themes-white-site-branding: var(--color-blue-yale);
--site-header-themes-white-yale-branding: var(--color-blue-yale);
--site-header-themes-white-background: var(--color-basics-white);
--site-header-themes-gray-100-divider-color: var(--color-gray-300);
--site-header-themes-gray-100-border-color: var(--color-blue-yale);
--site-header-themes-gray-100-site-branding: var(--color-blue-yale);
--site-header-themes-gray-100-yale-branding: var(--color-blue-yale);
--site-header-themes-gray-100-background: var(--color-gray-100);
--site-footer-themes-white-border-color: var(--color-blue-yale);
--site-footer-themes-gray-100-border-color: var(--color-blue-yale);
--site-footer-themes-gray-700-border-color: var(--color-blue-light);
--site-footer-themes-gray-800-border-color: var(--color-blue-light);
--site-footer-themes-blue-yale-border-color: var(--color-blue-light);
--font-scale-13-14: clamp(var(--font-size-13), calc(0.12vw + 0.7688rem), var(--font-size-14));
--font-scale-15-16: clamp(var(--font-size-15), calc(0.12vw + 0.8938rem), var(--font-size-16));
--font-scale-15-18: clamp(var(--font-size-15), calc(0.36vw + 0.8064rem), var(--font-size-18));
--font-scale-16-19: clamp(var(--font-size-16), calc(0.36vw + 0.8689rem), var(--font-size-19));
--font-scale-17-20: clamp(var(--font-size-17), calc(0.36vw + 0.9314rem), var(--font-size-20));
--font-scale-19-24: clamp(var(--font-size-19), calc(0.61vw + 0.9691rem), var(--font-size-24));
--font-scale-22-26: clamp(var(--font-size-22), calc(0.49vw + 1.2002rem), var(--font-size-26));
--font-scale-23-28: clamp(var(--font-size-23), calc(0.61vw + 1.2191rem), var(--font-size-28));
--font-scale-25-30: clamp(var(--font-size-25), calc(0.61vw + 1.3441rem), var(--font-size-30));
--font-scale-27-36: clamp(var(--font-size-27), calc(1.09vw + 1.2943rem), var(--font-size-36));
--font-scale-30-39: clamp(var(--font-size-30), calc(1.09vw + 1.4818rem), var(--font-size-39));
--font-scale-33-46: clamp(var(--font-size-33), calc(1.58vw + 1.4945rem), var(--font-size-46));
--font-scale-36-49: clamp(var(--font-size-36), calc(1.58vw + 1.6820rem), var(--font-size-49));
--font-scale-38-55: clamp(var(--font-size-38), calc(2.06vw + 1.6323rem), var(--font-size-55));
--font-scale-41-58: clamp(var(--font-size-41), calc(2.06vw + 1.8198rem), var(--font-size-58));
--font-scale-43-61: clamp(var(--font-size-43), calc(2.18vw + 1.9011rem), var(--font-size-61));
--font-style-branding-site: 400 clamp(2.25rem, calc(1.58vw + 1.6820rem), 3.0625rem)/1 YaleNew, serif;
--font-style-branding-yale: 400 clamp(1.1875rem, calc(0.61vw + 0.9691rem), 1.5rem)/1.05 YaleNew, serif;
--font-style-body-xs: 400 clamp(0.8125rem, calc(0.12vw + 0.7688rem), 0.875rem)/1.45 'Mallory Compact', sans-serif;
--font-style-body-s-condensed: 400 clamp(0.9375rem, calc(0.12vw + 0.8938rem), 1rem)/1.29 'Mallory Compact', sans-serif;
--font-style-body-s: 400 clamp(0.9375rem, calc(0.12vw + 0.8938rem), 1rem)/1.60 'Mallory Compact', sans-serif;
--font-style-body-default-condensed: 400 clamp(1.0625rem, calc(0.36vw + 0.9314rem), 1.25rem)/1.29 'Mallory Compact', sans-serif;
--font-style-body-default: 400 clamp(1.0625rem, calc(0.36vw + 0.9314rem), 1.25rem)/1.65 'Mallory Compact', sans-serif;
--font-style-body-l: 400 clamp(1.1875rem, calc(0.61vw + 0.9691rem), 1.5rem)/1.45 'Mallory Compact', sans-serif;
--font-style-body-xl: 400 clamp(1.4375rem, calc(0.61vw + 1.2191rem), 1.75rem)/1.4 'Mallory Compact', sans-serif;
--font-style-heading-h6-mallory-compact-book: 400 clamp(0.9375rem, calc(0.36vw + 0.8064rem), 1.125rem)/1.05 'Mallory Compact', sans-serif;
--font-style-heading-h5-mallory-compact-book: 400 clamp(1.1875rem, calc(0.61vw + 0.9691rem), 1.5rem)/1.15 'Mallory Compact', sans-serif;
--font-style-heading-h4-mallory-compact-book: 400 clamp(1.4375rem, calc(0.61vw + 1.2191rem), 1.75rem)/1.10 'Mallory Compact', sans-serif;
--font-style-heading-h3-mallory-compact-book: 400 clamp(1.6875rem, calc(1.09vw + 1.2943rem), 2.25rem)/1.05 'Mallory Compact', sans-serif;
--font-style-heading-h2-mallory-compact-book: 400 clamp(2.0625rem, calc(1.58vw + 1.4945rem), 2.875rem)/1 'Mallory Compact', sans-serif;
--font-style-heading-h1-mallory-compact-book: 400 clamp(2.5625rem, calc(2.06vw + 1.8198rem), 3.625rem)/1 'Mallory Compact', sans-serif;
--font-style-heading-h6-mallory-compact-medium: 500 clamp(0.9375rem, calc(0.36vw + 0.8064rem), 1.125rem)/1.05 'Mallory Compact', sans-serif;
--font-style-heading-h5-mallory-compact-medium: 500 clamp(1.1875rem, calc(0.61vw + 0.9691rem), 1.5rem)/1.15 'Mallory Compact', sans-serif;
--font-style-heading-h4-mallory-compact-medium: 500 clamp(1.4375rem, calc(0.61vw + 1.2191rem), 1.75rem)/1.10 'Mallory Compact', sans-serif;
--font-style-heading-h3-mallory-compact-medium: 500 clamp(1.6875rem, calc(1.09vw + 1.2943rem), 2.25rem)/1.05 'Mallory Compact', sans-serif;
--font-style-heading-h2-mallory-compact-medium: 500 clamp(2.0625rem, calc(1.58vw + 1.4945rem), 2.875rem)/1 'Mallory Compact', sans-serif;
--font-style-heading-h1-mallory-compact-medium: 500 clamp(2.5625rem, calc(2.06vw + 1.8198rem), 3.625rem)/1 'Mallory Compact', sans-serif;
--font-style-heading-h6-yale-new: 400 clamp(1rem, calc(0.36vw + 0.8689rem), 1.1875rem)/1.05 YaleNew, serif;
--font-style-heading-h5-yale-new: 400 clamp(1.375rem, calc(0.49vw + 1.2002rem), 1.625rem)/1.05 YaleNew, serif;
--font-style-heading-h4-yale-new: 400 clamp(1.5625rem, calc(0.61vw + 1.3441rem), 1.875rem)/1.04 YaleNew, serif;
--font-style-heading-h3-yale-new: 400 clamp(1.875rem, calc(1.09vw + 1.4818rem), 2.4375rem)/1.02 YaleNew, serif;
--font-style-heading-h2-yale-new: 400 clamp(2.25rem, calc(1.58vw + 1.6820rem), 3.0625rem)/1 YaleNew, serif;
--font-style-heading-h1-yale-new: 400 clamp(2.6875rem, calc(2.18vw + 1.9011rem), 3.8125rem)/1 YaleNew, serif;
--font-style-nav-primary-2: var(--font-weights-mallory-book) var(--font-size-17)/1.18 var(--font-families-mallory-compact);
--font-style-nav-primary-1: var(--font-weights-mallory-book) var(--font-size-19)/1.65 var(--font-families-mallory-compact);
--font-style-nav-primary-0: var(--font-weights-mallory-book) var(--font-size-20)/1.65 var(--font-families-mallory-compact);
--callout-themes-beige-background-color: var(--color-basics-beige);
--callout-themes-gray-700-background-color: var(--color-gray-700);
--callout-themes-blue-yale-background-color: var(--color-blue-yale);
--border-thickness-hairline: var(--size-thickness-hairline);
--border-thickness-8: var(--size-thickness-8);
--border-thickness-6: var(--size-thickness-6);
--border-thickness-4: var(--size-thickness-4);
--border-thickness-2: var(--size-thickness-2);
--border-thickness-1: var(--size-thickness-1);
--border-thickness-0: var(--size-thickness-0);
--component-themes-blue-yale-heading: var(--color-basics-white);
--component-themes-blue-yale-text: var(--color-basics-white);
--component-themes-blue-yale-background: var(--color-blue-yale);
--component-themes-white-heading: var(--color-gray-800);
--component-themes-white-text: var(--color-gray-700);
--component-themes-white-background: var(--color-basics-white);
--component-themes-beige-heading: var(--color-gray-800);
--component-themes-beige-text: var(--color-gray-700);
--component-themes-beige-background: var(--color-basics-beige);
--component-themes-gray-100-heading: var(--color-gray-800);
--component-themes-gray-100-text: var(--color-gray-700);
--component-themes-gray-100-background: var(--color-gray-100);
--component-themes-gray-200-heading: var(--color-gray-800);
--component-themes-gray-200-text: var(--color-gray-700);
--component-themes-gray-200-background: var(--color-gray-200);
--component-themes-gray-700-heading: var(--color-basics-white);
--component-themes-gray-700-text: var(--color-basics-white);
--component-themes-gray-700-background: var(--color-gray-700);
--component-themes-gray-800-heading: var(--color-basics-white);
--component-themes-gray-800-text: var(--color-basics-white);
--component-themes-gray-800-background: var(--color-gray-800);
--break-mobile-max: var(--break-l) - 0.05;
--break-mobile: var(--break-l);
--link-color-hover: var(--color-gray-700);
--link-color-base: var(--color-blue-medium);
--link-styles-no-underline-bg-color: var(--link-color-hover);
--link-styles-underline-bg-color: var(--link-color-base);
}
Loading

0 comments on commit f434675

Please sign in to comment.