czifui/dist/variables.css

2021 Create-a-thon Science Initiative Component Library

/**
 * Do not edit directly
 * Generated on Thu, 06 Apr 2023 19:19:47 GMT
 */

:root {
  --sds-font-letter-spacing-default: 0.3px;
  --sds-font-letter-spacing-caps: 1px;
  --sds-font-color: black;
  --sds-font-font-family: 'Open Sans', 'OpenSans-Regular';
  --sds-font-body-xxxs-400-font: 400 11px/16px 'Open Sans', 'OpenSans-Regular';
  --sds-font-body-xxxs-600-font: 600 11px/16px 'Open Sans', 'OpenSans-SemiBold';
  --sds-font-body-xxs-400-font: 400 12px/18px 'Open Sans', 'OpenSans-Regular';
  --sds-font-body-xxs-600-font: 600 12px/18px 'Open Sans', 'OpenSans-SemiBold';
  --sds-font-body-xs-400-font: 400 13px/20px 'Open Sans', 'OpenSans-Regular';
  --sds-font-body-xs-600-font: 600 13px/20px 'Open Sans', 'OpenSans-SemiBold';
  --sds-font-body-s-400-font: 400 14px/24px 'Open Sans', 'OpenSans-Regular';
  --sds-font-body-s-600-font: 600 14px/24px 'Open Sans', 'OpenSans-SemiBold';
  --sds-font-body-m-400-font: 400 16px/26px 'Open Sans', 'OpenSans-Regular';
  --sds-font-body-m-600-font: 600 16px/26px 'Open Sans', 'OpenSans-SemiBold';
  --sds-font-body-l-400-font: 400 18px/28px 'Open Sans', 'OpenSans-Regular';
  --sds-font-body-l-600-font: 600 18px/28px 'Open Sans', 'OpenSans-SemiBold';
  --sds-font-caps-xxxxs-600-font: 600 10px/14px 'Open Sans', 'OpenSans-SemiBold';
  --sds-font-caps-xxxxs-600-text-transform:  uppercase;
  --sds-font-caps-xxxs-600-font: 600 11px/16px 'Open Sans', 'OpenSans-SemiBold';
  --sds-font-caps-xxxs-600-text-transform:  uppercase;
  --sds-font-caps-xxs-600-font: 600 12px/18px 'Open Sans', 'OpenSans-SemiBold';
  --sds-font-caps-xxs-600-text-transform:  uppercase;
  --sds-font-header-xxxs-600-font: 600 11px/16px 'Open Sans', 'OpenSans-SemiBold';
  --sds-font-header-xxs-600-font: 600 12px/18px 'Open Sans', 'OpenSans-SemiBold';
  --sds-font-header-xs-600-font: 600 13px/18px 'Open Sans', 'OpenSans-SemiBold';
  --sds-font-header-s-600-font: 600 14px/20px 'Open Sans', 'OpenSans-SemiBold';
  --sds-font-header-m-600-font: 600 16px/22px 'Open Sans', 'OpenSans-SemiBold';
  --sds-font-header-l-600-font: 600 18px/24px 'Open Sans', 'OpenSans-SemiBold';
  --sds-font-header-xl-600-font: 600 22px/30px 'Open Sans', 'OpenSans-SemiBold';
  --sds-font-header-xxl-600-font: 600 26px/34px 'Open Sans', 'OpenSans-SemiBold';
  --sds-color-overlay-100: rgba(0, 0, 0, 0.08);
  --sds-color-overlay-200: rgba(0, 0, 0, 0.03);
  --sds-color-beta-100: #f4f0f9;
  --sds-color-beta-200: #f0ebf6;
  --sds-color-beta-400: #7a41ce;
  --sds-color-beta-600: #693bac;
  --sds-color-error-100: #fef2f2;
  --sds-color-error-200: #f8e8e8;
  --sds-color-error-400: #dc132c;
  --sds-color-error-600: #b70016;
  --sds-color-gray-100: #f8f8f8;
  --sds-color-gray-200: #eaeaea;
  --sds-color-gray-300: #cccccc;
  --sds-color-gray-400: #999999;
  --sds-color-gray-500: #767676;
  --sds-color-gray-600: #545454;
  --sds-color-gray-black: #000000;
  --sds-color-gray-white: #ffffff;
  --sds-color-info-100: #eff2fc;
  --sds-color-info-200: #ebeffc;
  --sds-color-info-400: #3867fa;
  --sds-color-info-600: #223f9c;
  --sds-color-primary-100: #f8f9fe;
  --sds-color-primary-200: #eff2fc;
  --sds-color-primary-300: #a9bdfc;
  --sds-color-primary-400: #3867fa;
  --sds-color-primary-500: #2b52cd;
  --sds-color-primary-600: #223f9c;
  --sds-color-secondary-400: #9bc74e;
  --sds-color-success-100: #ecf5f0;
  --sds-color-success-200: #e6f7ed;
  --sds-color-success-400: #3cb371;
  --sds-color-success-600: #1c7f48;
  --sds-color-warning-100: #fcf6ec;
  --sds-color-warning-200: #fff3e1;
  --sds-color-warning-400: #f5a623;
  --sds-color-warning-600: #946314;
  --sds-drop-shadows-shadow-l: 0.0px 2.0px 12.0px 0px rgba(0, 0, 0, 0.3);
  --sds-drop-shadows-shadow-m: 0.0px 2.0px 10.0px 0px rgba(0, 0, 0, 0.15),0.0px 2.0px 4.0px 0px rgba(0, 0, 0, 0.15);
  --sds-drop-shadows-shadow-s: 0.0px 2.0px 4.0px 0px rgba(0, 0, 0, 0.25);
  --sds-borders-error-400: 1px solid #dc132c;
  --sds-borders-gray-100: 1px solid #f8f8f8;
  --sds-borders-gray-200: 1px solid #eaeaea;
  --sds-borders-gray-300: 1px solid #cccccc;
  --sds-borders-gray-400: 1px solid #999999;
  --sds-borders-gray-500: 1px solid #767676;
  --sds-borders-gray-dashed: 2px dashed #999999;
  --sds-borders-link-dashed: 1px dashed;
  --sds-borders-link-solid: 1px solid;
  --sds-borders-primary-300: 1px solid #a9bdfc;
  --sds-borders-primary-400: 1px solid #3867fa;
  --sds-borders-primary-500: 1px solid #2b52cd;
  --sds-borders-primary-600: 1px solid #223f9c;
  --sds-borders-primary-dashed: 2px dashed #3867fa;
  --sds-borders-success-400: 1px solid #3cb371;
  --sds-borders-warning-400: 1px solid #f5a623;
  --sds-spaces-default: 10px;
  --sds-spaces-xxxs: 2px;
  --sds-spaces-xxs: 4px;
  --sds-spaces-xs: 6px;
  --sds-spaces-s: 8px;
  --sds-spaces-m: 10px;
  --sds-spaces-l: 14px;
  --sds-spaces-xl: 22px;
  --sds-spaces-xxl: 38px;
  --sds-icon-sizes-input-height: 16px; /* for use with input icons only */
  --sds-icon-sizes-input-width: 16px; /* for use with input icons only */
  --sds-icon-sizes-xs-height: 10px;
  --sds-icon-sizes-xs-width: 10px;
  --sds-icon-sizes-s-height: 14px;
  --sds-icon-sizes-s-width: 14px;
  --sds-icon-sizes-l-height: 22px;
  --sds-icon-sizes-l-width: 22px;
  --sds-icon-sizes-xl-height: 32px;
  --sds-icon-sizes-xl-width: 32px;
  --sds-corners-corner-l: 20px;
  --sds-corners-corner-m: 4px;
  --sds-corners-corner-s: 2px;
  --sds-corners-corner-none: 0px;
}