@spectrum-web-components/styles
Version:
Spectrum Web Components are a [`LitElement`](https://lit-element.polymer-project.org) powered web component library of patterns built ontop of the [Spectrum CSS](https://opensource.adobe.com/spectrum-css) specification. Styles for these components are mad
1,324 lines (1,321 loc) • 53.9 kB
CSS
/*
Copyright 2020 Adobe. All rights reserved.
This file is licensed to you under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License. You may obtain a copy
of the License at http://www.apache.org/licenses/LICENSE-2.0
Unless required by applicable law or agreed to in writing, software distributed under
the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS
OF ANY KIND, either express or implied. See the License for the specific language
governing permissions and limitations under the License.
*/
/* stylelint-disable */
:host,
:root {
--spectrum-global-animation-duration-0: 0ms;
--spectrum-global-animation-duration-100: 130ms;
--spectrum-global-animation-duration-200: 160ms;
--spectrum-global-animation-duration-300: 190ms;
--spectrum-global-animation-duration-400: 220ms;
--spectrum-global-animation-duration-500: 250ms;
--spectrum-global-animation-duration-600: 300ms;
--spectrum-global-animation-duration-700: 350ms;
--spectrum-global-animation-duration-800: 400ms;
--spectrum-global-animation-duration-900: 450ms;
--spectrum-global-animation-duration-1000: 500ms;
--spectrum-global-animation-duration-2000: 1000ms;
--spectrum-global-animation-duration-4000: 2000ms;
--spectrum-global-animation-ease-in-out: cubic-bezier(0.45, 0, 0.4, 1);
--spectrum-global-animation-ease-in: cubic-bezier(0.5, 0, 1, 1);
--spectrum-global-animation-ease-out: cubic-bezier(0, 0, 0.4, 1);
--spectrum-global-animation-linear: cubic-bezier(0, 0, 1, 1);
--spectrum-global-color-status: Verified;
--spectrum-global-color-version: 5.1;
--spectrum-global-color-static-black: #000;
--spectrum-global-color-static-white: #fff;
--spectrum-global-color-static-blue: #1473e6;
--spectrum-global-color-static-gray-50: #fff;
--spectrum-global-color-static-gray-75: #fff;
--spectrum-global-color-static-gray-100: #fff;
--spectrum-global-color-static-gray-200: #f4f4f4;
--spectrum-global-color-static-gray-300: #eaeaea;
--spectrum-global-color-static-gray-400: #d3d3d3;
--spectrum-global-color-static-gray-500: #bcbcbc;
--spectrum-global-color-static-gray-600: #959595;
--spectrum-global-color-static-gray-700: #747474;
--spectrum-global-color-static-gray-800: #505050;
--spectrum-global-color-static-gray-900: #323232;
--spectrum-global-color-static-blue-200: #5aa9fa;
--spectrum-global-color-static-blue-300: #4b9cf5;
--spectrum-global-color-static-blue-400: #378ef0;
--spectrum-global-color-static-blue-500: #2680eb;
--spectrum-global-color-static-blue-600: #1473e6;
--spectrum-global-color-static-blue-700: #0d66d0;
--spectrum-global-color-static-blue-800: #095aba;
--spectrum-global-color-static-red-400: #ec5b62;
--spectrum-global-color-static-red-500: #e34850;
--spectrum-global-color-static-red-600: #d7373f;
--spectrum-global-color-static-red-700: #c9252d;
--spectrum-global-color-static-red-800: #bb121a;
--spectrum-global-color-static-orange-400: #f29423;
--spectrum-global-color-static-orange-500: #e68619;
--spectrum-global-color-static-orange-600: #da7b11;
--spectrum-global-color-static-orange-700: #cb6f10;
--spectrum-global-color-static-orange-800: #bd640d;
--spectrum-global-color-static-green-400: #33ab84;
--spectrum-global-color-static-green-500: #2d9d78;
--spectrum-global-color-static-green-600: #268e6c;
--spectrum-global-color-static-green-700: #12805c;
--spectrum-global-color-static-green-800: #107154;
--spectrum-global-color-static-celery-200: #58e06f;
--spectrum-global-color-static-celery-300: #51d267;
--spectrum-global-color-static-celery-400: #4bc35f;
--spectrum-global-color-static-celery-500: #44b556;
--spectrum-global-color-static-celery-600: #3da74e;
--spectrum-global-color-static-celery-700: #379947;
--spectrum-global-color-static-celery-800: #318b40;
--spectrum-global-color-static-chartreuse-300: #9bec54;
--spectrum-global-color-static-chartreuse-400: #8ede49;
--spectrum-global-color-static-chartreuse-500: #85d044;
--spectrum-global-color-static-chartreuse-600: #7cc33f;
--spectrum-global-color-static-chartreuse-700: #73b53a;
--spectrum-global-color-static-chartreuse-800: #6aa834;
--spectrum-global-color-static-yellow-200: #ffe22e;
--spectrum-global-color-static-yellow-300: #fad900;
--spectrum-global-color-static-yellow-400: #edcc00;
--spectrum-global-color-static-yellow-500: #dfbf00;
--spectrum-global-color-static-yellow-600: #d2b200;
--spectrum-global-color-static-yellow-700: #c4a600;
--spectrum-global-color-static-yellow-800: #b79900;
--spectrum-global-color-static-magenta-200: #f56bb7;
--spectrum-global-color-static-magenta-300: #ec5aaa;
--spectrum-global-color-static-magenta-400: #e2499d;
--spectrum-global-color-static-magenta-500: #d83790;
--spectrum-global-color-static-magenta-600: #ca2982;
--spectrum-global-color-static-magenta-700: #bc1c74;
--spectrum-global-color-static-magenta-800: #ae0e66;
--spectrum-global-color-static-fuchsia-400: #cf3edc;
--spectrum-global-color-static-fuchsia-500: #c038cc;
--spectrum-global-color-static-fuchsia-600: #b130bd;
--spectrum-global-color-static-fuchsia-700: #a228ad;
--spectrum-global-color-static-fuchsia-800: #93219e;
--spectrum-global-color-static-purple-400: #9d64e1;
--spectrum-global-color-static-purple-500: #9256d9;
--spectrum-global-color-static-purple-600: #864ccc;
--spectrum-global-color-static-purple-700: #7a42bf;
--spectrum-global-color-static-purple-800: #6f38b1;
--spectrum-global-color-static-indigo-200: #9090fa;
--spectrum-global-color-static-indigo-300: #8282f6;
--spectrum-global-color-static-indigo-400: #7575f1;
--spectrum-global-color-static-indigo-500: #6767ec;
--spectrum-global-color-static-indigo-600: #5c5ce0;
--spectrum-global-color-static-indigo-700: #5151d3;
--spectrum-global-color-static-indigo-800: #4646c6;
--spectrum-global-color-static-seafoam-200: #26c0c7;
--spectrum-global-color-static-seafoam-300: #23b2b8;
--spectrum-global-color-static-seafoam-400: #20a3a8;
--spectrum-global-color-static-seafoam-500: #1b959a;
--spectrum-global-color-static-seafoam-600: #16878c;
--spectrum-global-color-static-seafoam-700: #0f797d;
--spectrum-global-color-static-seafoam-800: #096c6f;
--spectrum-global-color-opacity-100: 1;
--spectrum-global-color-opacity-90: 0.9;
--spectrum-global-color-opacity-80: 0.8;
--spectrum-global-color-opacity-60: 0.6;
--spectrum-global-color-opacity-50: 0.5;
--spectrum-global-color-opacity-42: 0.42;
--spectrum-global-color-opacity-40: 0.4;
--spectrum-global-color-opacity-30: 0.3;
--spectrum-global-color-opacity-25: 0.25;
--spectrum-global-color-opacity-20: 0.2;
--spectrum-global-color-opacity-15: 0.15;
--spectrum-global-color-opacity-10: 0.1;
--spectrum-global-color-opacity-8: 0.08;
--spectrum-global-color-opacity-7: 0.07;
--spectrum-global-color-opacity-6: 0.06;
--spectrum-global-color-opacity-5: 0.05;
--spectrum-global-color-opacity-4: 0.04;
--spectrum-semantic-negative-color-background: var(
--spectrum-global-color-static-red-700
);
--spectrum-semantic-negative-color-default: var(
--spectrum-global-color-red-500
);
--spectrum-semantic-negative-color-state-hover: var(
--spectrum-global-color-red-600
);
--spectrum-semantic-negative-color-dark: var(
--spectrum-global-color-red-600
);
--spectrum-semantic-negative-color-border: var(
--spectrum-global-color-red-400
);
--spectrum-semantic-negative-color-icon: var(
--spectrum-global-color-red-600
);
--spectrum-semantic-negative-color-status: var(
--spectrum-global-color-red-400
);
--spectrum-semantic-negative-color-text-large: var(
--spectrum-global-color-red-500
);
--spectrum-semantic-negative-color-text-small: var(
--spectrum-global-color-red-600
);
--spectrum-semantic-negative-color-state-down: var(
--spectrum-global-color-red-700
);
--spectrum-semantic-negative-color-state-focus: var(
--spectrum-global-color-red-400
);
--spectrum-semantic-negative-background-color-default: var(
--spectrum-global-color-static-red-600
);
--spectrum-semantic-negative-background-color-hover: var(
--spectrum-global-color-static-red-700
);
--spectrum-semantic-negative-background-color-down: var(
--spectrum-global-color-static-red-800
);
--spectrum-semantic-negative-background-color-key-focus: var(
--spectrum-global-color-static-red-700
);
--spectrum-semantic-notice-color-background: var(
--spectrum-global-color-static-orange-700
);
--spectrum-semantic-notice-color-default: var(
--spectrum-global-color-orange-500
);
--spectrum-semantic-notice-color-dark: var(
--spectrum-global-color-orange-600
);
--spectrum-semantic-notice-color-border: var(
--spectrum-global-color-orange-400
);
--spectrum-semantic-notice-color-icon: var(
--spectrum-global-color-orange-600
);
--spectrum-semantic-notice-color-status: var(
--spectrum-global-color-orange-400
);
--spectrum-semantic-notice-color-text-large: var(
--spectrum-global-color-orange-500
);
--spectrum-semantic-notice-color-text-small: var(
--spectrum-global-color-orange-600
);
--spectrum-semantic-notice-color-state-down: var(
--spectrum-global-color-orange-700
);
--spectrum-semantic-notice-color-state-focus: var(
--spectrum-global-color-orange-400
);
--spectrum-semantic-notice-background-color-default: var(
--spectrum-global-color-static-orange-600
);
--spectrum-semantic-notice-background-color-hover: var(
--spectrum-global-color-static-orange-700
);
--spectrum-semantic-notice-background-color-down: var(
--spectrum-global-color-static-orange-800
);
--spectrum-semantic-notice-background-color-key-focus: var(
--spectrum-global-color-static-orange-700
);
--spectrum-semantic-positive-color-background: var(
--spectrum-global-color-static-green-700
);
--spectrum-semantic-positive-color-default: var(
--spectrum-global-color-green-500
);
--spectrum-semantic-positive-color-dark: var(
--spectrum-global-color-green-600
);
--spectrum-semantic-positive-color-border: var(
--spectrum-global-color-green-400
);
--spectrum-semantic-positive-color-icon: var(
--spectrum-global-color-green-600
);
--spectrum-semantic-positive-color-status: var(
--spectrum-global-color-green-400
);
--spectrum-semantic-positive-color-text-large: var(
--spectrum-global-color-green-500
);
--spectrum-semantic-positive-color-text-small: var(
--spectrum-global-color-green-600
);
--spectrum-semantic-positive-color-state-down: var(
--spectrum-global-color-green-700
);
--spectrum-semantic-positive-color-state-focus: var(
--spectrum-global-color-green-400
);
--spectrum-semantic-positive-background-color-default: var(
--spectrum-global-color-static-green-600
);
--spectrum-semantic-positive-background-color-hover: var(
--spectrum-global-color-static-green-700
);
--spectrum-semantic-positive-background-color-down: var(
--spectrum-global-color-static-green-800
);
--spectrum-semantic-positive-background-color-key-focus: var(
--spectrum-global-color-static-green-700
);
--spectrum-semantic-informative-color-background: var(
--spectrum-global-color-static-blue-700
);
--spectrum-semantic-informative-color-default: var(
--spectrum-global-color-blue-500
);
--spectrum-semantic-informative-color-dark: var(
--spectrum-global-color-blue-600
);
--spectrum-semantic-informative-color-border: var(
--spectrum-global-color-blue-400
);
--spectrum-semantic-informative-color-icon: var(
--spectrum-global-color-blue-600
);
--spectrum-semantic-informative-color-status: var(
--spectrum-global-color-blue-400
);
--spectrum-semantic-informative-color-text-large: var(
--spectrum-global-color-blue-500
);
--spectrum-semantic-informative-color-text-small: var(
--spectrum-global-color-blue-600
);
--spectrum-semantic-informative-color-state-down: var(
--spectrum-global-color-blue-700
);
--spectrum-semantic-informative-color-state-focus: var(
--spectrum-global-color-blue-400
);
--spectrum-semantic-informative-background-color-default: var(
--spectrum-global-color-static-blue-600
);
--spectrum-semantic-informative-background-color-hover: var(
--spectrum-global-color-static-blue-700
);
--spectrum-semantic-informative-background-color-down: var(
--spectrum-global-color-static-blue-800
);
--spectrum-semantic-informative-background-color-key-focus: var(
--spectrum-global-color-static-blue-700
);
--spectrum-semantic-cta-color-background-default: var(
--spectrum-global-color-static-blue-600
);
--spectrum-semantic-cta-color-background-hover: var(
--spectrum-global-color-static-blue-700
);
--spectrum-semantic-cta-color-background-down: var(
--spectrum-global-color-static-blue-800
);
--spectrum-semantic-cta-color-background-key-focus: var(
--spectrum-global-color-static-blue-600
);
--spectrum-semantic-neutral-background-color-default: var(
--spectrum-global-color-static-gray-700
);
--spectrum-semantic-neutral-background-color-hover: var(
--spectrum-global-color-static-gray-800
);
--spectrum-semantic-neutral-background-color-down: var(
--spectrum-global-color-static-gray-900
);
--spectrum-semantic-neutral-background-color-key-focus: var(
--spectrum-global-color-static-gray-800
);
--spectrum-semantic-presence-color-1: var(
--spectrum-global-color-static-red-500
);
--spectrum-semantic-presence-color-2: var(
--spectrum-global-color-static-orange-400
);
--spectrum-semantic-presence-color-3: var(
--spectrum-global-color-static-yellow-400
);
--spectrum-semantic-presence-color-4: #4bcca2;
--spectrum-semantic-presence-color-5: #00c7ff;
--spectrum-semantic-presence-color-6: #008cb8;
--spectrum-semantic-presence-color-7: #7e4bf3;
--spectrum-semantic-presence-color-8: var(
--spectrum-global-color-static-fuchsia-600
);
--spectrum-global-dimension-static-size-0: 0px;
--spectrum-global-dimension-static-size-10: 1px;
--spectrum-global-dimension-static-size-25: 2px;
--spectrum-global-dimension-static-size-40: 3px;
--spectrum-global-dimension-static-size-50: 4px;
--spectrum-global-dimension-static-size-65: 5px;
--spectrum-global-dimension-static-size-75: 6px;
--spectrum-global-dimension-static-size-85: 7px;
--spectrum-global-dimension-static-size-100: 8px;
--spectrum-global-dimension-static-size-115: 9px;
--spectrum-global-dimension-static-size-125: 10px;
--spectrum-global-dimension-static-size-130: 11px;
--spectrum-global-dimension-static-size-150: 12px;
--spectrum-global-dimension-static-size-160: 13px;
--spectrum-global-dimension-static-size-175: 14px;
--spectrum-global-dimension-static-size-200: 16px;
--spectrum-global-dimension-static-size-225: 18px;
--spectrum-global-dimension-static-size-250: 20px;
--spectrum-global-dimension-static-size-275: 22px;
--spectrum-global-dimension-static-size-300: 24px;
--spectrum-global-dimension-static-size-325: 26px;
--spectrum-global-dimension-static-size-400: 32px;
--spectrum-global-dimension-static-size-450: 36px;
--spectrum-global-dimension-static-size-500: 40px;
--spectrum-global-dimension-static-size-550: 44px;
--spectrum-global-dimension-static-size-600: 48px;
--spectrum-global-dimension-static-size-700: 56px;
--spectrum-global-dimension-static-size-800: 64px;
--spectrum-global-dimension-static-size-900: 72px;
--spectrum-global-dimension-static-size-1000: 80px;
--spectrum-global-dimension-static-size-1200: 96px;
--spectrum-global-dimension-static-size-1700: 136px;
--spectrum-global-dimension-static-size-2400: 192px;
--spectrum-global-dimension-static-size-2500: 200px;
--spectrum-global-dimension-static-size-2600: 208px;
--spectrum-global-dimension-static-size-2800: 224px;
--spectrum-global-dimension-static-size-3200: 256px;
--spectrum-global-dimension-static-size-3400: 272px;
--spectrum-global-dimension-static-size-3500: 280px;
--spectrum-global-dimension-static-size-3600: 288px;
--spectrum-global-dimension-static-size-3800: 304px;
--spectrum-global-dimension-static-size-4600: 368px;
--spectrum-global-dimension-static-size-5000: 400px;
--spectrum-global-dimension-static-size-6000: 480px;
--spectrum-global-dimension-static-size-16000: 1280px;
--spectrum-global-dimension-static-font-size-50: 11px;
--spectrum-global-dimension-static-font-size-75: 12px;
--spectrum-global-dimension-static-font-size-100: 14px;
--spectrum-global-dimension-static-font-size-150: 15px;
--spectrum-global-dimension-static-font-size-200: 16px;
--spectrum-global-dimension-static-font-size-300: 18px;
--spectrum-global-dimension-static-font-size-400: 20px;
--spectrum-global-dimension-static-font-size-500: 22px;
--spectrum-global-dimension-static-font-size-600: 25px;
--spectrum-global-dimension-static-font-size-700: 28px;
--spectrum-global-dimension-static-font-size-800: 32px;
--spectrum-global-dimension-static-font-size-900: 36px;
--spectrum-global-dimension-static-font-size-1000: 40px;
--spectrum-global-dimension-static-percent-50: 50%;
--spectrum-global-dimension-static-percent-100: 100%;
--spectrum-global-dimension-static-breakpoint-xsmall: 304px;
--spectrum-global-dimension-static-breakpoint-small: 768px;
--spectrum-global-dimension-static-breakpoint-medium: 1280px;
--spectrum-global-dimension-static-breakpoint-large: 1768px;
--spectrum-global-dimension-static-breakpoint-xlarge: 2160px;
--spectrum-global-dimension-static-grid-columns: 12;
--spectrum-global-dimension-static-grid-fluid-width: 100%;
--spectrum-global-dimension-static-grid-fixed-max-width: 1280px;
--spectrum-global-font-family-base: adobe-clean, 'Source Sans Pro',
-apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Ubuntu,
'Trebuchet MS', 'Lucida Grande', sans-serif;
--spectrum-global-font-family-serif: adobe-clean-serif, 'Source Serif Pro',
Georgia, serif;
--spectrum-global-font-family-code: 'Source Code Pro', Monaco, monospace;
--spectrum-global-font-weight-thin: 100;
--spectrum-global-font-weight-ultra-light: 200;
--spectrum-global-font-weight-light: 300;
--spectrum-global-font-weight-regular: 400;
--spectrum-global-font-weight-medium: 500;
--spectrum-global-font-weight-semi-bold: 600;
--spectrum-global-font-weight-bold: 700;
--spectrum-global-font-weight-extra-bold: 800;
--spectrum-global-font-weight-black: 900;
--spectrum-global-font-style-regular: normal;
--spectrum-global-font-style-italic: italic;
--spectrum-global-font-letter-spacing-none: 0;
--spectrum-global-font-letter-spacing-small: 0.0125em;
--spectrum-global-font-letter-spacing-han: 0.05em;
--spectrum-global-font-letter-spacing-medium: 0.06em;
--spectrum-global-font-line-height-large: 1.7;
--spectrum-global-font-line-height-medium: 1.5;
--spectrum-global-font-line-height-small: 1.3;
--spectrum-global-font-multiplier-25: 0.25em;
--spectrum-global-font-multiplier-75: 0.75em;
--spectrum-alias-border-size-thin: var(
--spectrum-global-dimension-static-size-10
);
--spectrum-alias-border-size-thick: var(
--spectrum-global-dimension-static-size-25
);
--spectrum-alias-border-size-thicker: var(
--spectrum-global-dimension-static-size-50
);
--spectrum-alias-border-size-thickest: var(
--spectrum-global-dimension-static-size-100
);
--spectrum-alias-border-offset-thin: var(
--spectrum-global-dimension-static-size-25
);
--spectrum-alias-border-offset-thick: var(
--spectrum-global-dimension-static-size-50
);
--spectrum-alias-border-offset-thicker: var(
--spectrum-global-dimension-static-size-100
);
--spectrum-alias-border-offset-thickest: var(
--spectrum-global-dimension-static-size-200
);
--spectrum-alias-grid-baseline: var(
--spectrum-global-dimension-static-size-100
);
--spectrum-alias-grid-gutter-xsmall: var(
--spectrum-global-dimension-static-size-200
);
--spectrum-alias-grid-gutter-small: var(
--spectrum-global-dimension-static-size-300
);
--spectrum-alias-grid-gutter-medium: var(
--spectrum-global-dimension-static-size-400
);
--spectrum-alias-grid-gutter-large: var(
--spectrum-global-dimension-static-size-500
);
--spectrum-alias-grid-gutter-xlarge: var(
--spectrum-global-dimension-static-size-600
);
--spectrum-alias-grid-margin-xsmall: var(
--spectrum-global-dimension-static-size-200
);
--spectrum-alias-grid-margin-small: var(
--spectrum-global-dimension-static-size-300
);
--spectrum-alias-grid-margin-medium: var(
--spectrum-global-dimension-static-size-400
);
--spectrum-alias-grid-margin-large: var(
--spectrum-global-dimension-static-size-500
);
--spectrum-alias-grid-margin-xlarge: var(
--spectrum-global-dimension-static-size-600
);
--spectrum-alias-grid-layout-region-margin-bottom-xsmall: var(
--spectrum-global-dimension-static-size-200
);
--spectrum-alias-grid-layout-region-margin-bottom-small: var(
--spectrum-global-dimension-static-size-300
);
--spectrum-alias-grid-layout-region-margin-bottom-medium: var(
--spectrum-global-dimension-static-size-400
);
--spectrum-alias-grid-layout-region-margin-bottom-large: var(
--spectrum-global-dimension-static-size-500
);
--spectrum-alias-grid-layout-region-margin-bottom-xlarge: var(
--spectrum-global-dimension-static-size-600
);
--spectrum-alias-radial-reaction-size-default: var(
--spectrum-global-dimension-static-size-550
);
--spectrum-alias-font-family-ar: myriad-arabic, adobe-clean,
'Source Sans Pro', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto,
Ubuntu, 'Trebuchet MS', 'Lucida Grande', sans-serif;
--spectrum-alias-font-family-he: myriad-hebrew, adobe-clean,
'Source Sans Pro', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto,
Ubuntu, 'Trebuchet MS', 'Lucida Grande', sans-serif;
--spectrum-alias-font-family-zh: adobe-clean-han-traditional,
source-han-traditional, 'MingLiu', 'Heiti TC Light', 'sans-serif';
--spectrum-alias-font-family-zhhans: adobe-clean-han-simplified-c,
source-han-simplified-c, 'SimSun', 'Heiti SC Light', 'sans-serif';
--spectrum-alias-font-family-ko: adobe-clean-han-korean, source-han-korean,
'Malgun Gothic', 'Apple Gothic', 'sans-serif';
--spectrum-alias-font-family-ja: adobe-clean-han-japanese,
source-han-japanese, 'Yu Gothic', '\\30E1 \\30A4 \\30EA \\30AA',
'\\30D2 \\30E9 \\30AE \\30CE \\89D2 \\30B4 Pro W3',
'Hiragino Kaku Gothic Pro W3', 'Osaka',
'\\FF2D \\FF33 \\FF30 \\30B4 \\30B7 \\30C3 \\30AF', 'MS PGothic',
'sans-serif';
--spectrum-alias-font-family-condensed: adobe-clean-han-traditional,
source-han-traditional, 'MingLiu', 'Heiti TC Light', adobe-clean,
'Source Sans Pro', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto,
Ubuntu, 'Trebuchet MS', 'Lucida Grande', sans-serif;
--spectrum-alias-body-text-font-family: var(
--spectrum-global-font-family-base
);
--spectrum-alias-body-text-line-height: var(
--spectrum-global-font-line-height-medium
);
--spectrum-alias-body-text-font-weight: var(
--spectrum-global-font-weight-regular
);
--spectrum-alias-body-text-font-weight-strong: var(
--spectrum-global-font-weight-bold
);
--spectrum-alias-button-text-line-height: var(
--spectrum-global-font-line-height-small
);
--spectrum-alias-component-text-line-height: var(
--spectrum-global-font-line-height-small
);
--spectrum-alias-han-component-text-line-height: var(
--spectrum-global-font-line-height-medium
);
--spectrum-alias-heading-text-line-height: var(
--spectrum-global-font-line-height-small
);
--spectrum-alias-heading-text-font-weight-regular: var(
--spectrum-global-font-weight-bold
);
--spectrum-alias-heading-text-font-weight-regular-strong: var(
--spectrum-global-font-weight-black
);
--spectrum-alias-heading-text-font-weight-quiet: var(
--spectrum-global-font-weight-light
);
--spectrum-alias-heading-text-font-weight-quiet-strong: var(
--spectrum-global-font-weight-bold
);
--spectrum-alias-heading-text-font-weight-strong: var(
--spectrum-global-font-weight-black
);
--spectrum-alias-heading-text-font-weight-strong-strong: var(
--spectrum-global-font-weight-black
);
--spectrum-alias-subheading-text-font-weight: var(
--spectrum-global-font-weight-bold
);
--spectrum-alias-subheading-text-font-weight-strong: var(
--spectrum-global-font-weight-black
);
--spectrum-alias-detail-text-font-weight: var(
--spectrum-global-font-weight-bold
);
--spectrum-alias-detail-text-font-weight-light: var(
--spectrum-global-font-weight-regular
);
--spectrum-alias-detail-text-font-weight-strong: var(
--spectrum-global-font-weight-black
);
--spectrum-alias-serif-text-font-family: var(
--spectrum-global-font-family-serif
);
--spectrum-alias-article-body-text-font-weight: var(
--spectrum-global-font-weight-regular
);
--spectrum-alias-article-body-text-font-weight-strong: var(
--spectrum-global-font-weight-black
);
--spectrum-alias-article-heading-text-font-weight: var(
--spectrum-global-font-weight-bold
);
--spectrum-alias-article-heading-text-font-weight-strong: var(
--spectrum-global-font-weight-black
);
--spectrum-alias-article-heading-text-font-weight-quiet: var(
--spectrum-global-font-weight-regular
);
--spectrum-alias-article-heading-text-font-weight-quiet-strong: var(
--spectrum-global-font-weight-bold
);
--spectrum-alias-article-subheading-text-font-weight: var(
--spectrum-global-font-weight-bold
);
--spectrum-alias-article-subheading-text-font-weight-strong: var(
--spectrum-global-font-weight-black
);
--spectrum-alias-article-detail-text-font-weight: var(
--spectrum-global-font-weight-regular
);
--spectrum-alias-article-detail-text-font-weight-strong: var(
--spectrum-global-font-weight-bold
);
--spectrum-alias-code-text-font-family: var(
--spectrum-global-font-family-code
);
--spectrum-alias-han-heading-text-line-height: var(
--spectrum-global-font-line-height-medium
);
--spectrum-alias-han-heading-text-font-weight-regular: var(
--spectrum-global-font-weight-bold
);
--spectrum-alias-han-heading-text-font-weight-regular-emphasis: var(
--spectrum-global-font-weight-extra-bold
);
--spectrum-alias-han-heading-text-font-weight-regular-strong: var(
--spectrum-global-font-weight-black
);
--spectrum-alias-han-heading-text-font-weight-quiet-strong: var(
--spectrum-global-font-weight-bold
);
--spectrum-alias-han-heading-text-font-weight-light: var(
--spectrum-global-font-weight-light
);
--spectrum-alias-han-heading-text-font-weight-light-emphasis: var(
--spectrum-global-font-weight-regular
);
--spectrum-alias-han-heading-text-font-weight-light-strong: var(
--spectrum-global-font-weight-bold
);
--spectrum-alias-han-heading-text-font-weight-heavy: var(
--spectrum-global-font-weight-black
);
--spectrum-alias-han-heading-text-font-weight-heavy-emphasis: var(
--spectrum-global-font-weight-black
);
--spectrum-alias-han-heading-text-font-weight-heavy-strong: var(
--spectrum-global-font-weight-black
);
--spectrum-alias-han-body-text-line-height: var(
--spectrum-global-font-line-height-large
);
--spectrum-alias-han-body-text-font-weight-regular: var(
--spectrum-global-font-weight-regular
);
--spectrum-alias-han-body-text-font-weight-emphasis: var(
--spectrum-global-font-weight-bold
);
--spectrum-alias-han-body-text-font-weight-strong: var(
--spectrum-global-font-weight-black
);
--spectrum-alias-han-subheading-text-font-weight-regular: var(
--spectrum-global-font-weight-bold
);
--spectrum-alias-han-subheading-text-font-weight-emphasis: var(
--spectrum-global-font-weight-extra-bold
);
--spectrum-alias-han-subheading-text-font-weight-strong: var(
--spectrum-global-font-weight-black
);
--spectrum-alias-han-detail-text-font-weight: var(
--spectrum-global-font-weight-regular
);
--spectrum-alias-han-detail-text-font-weight-emphasis: var(
--spectrum-global-font-weight-bold
);
--spectrum-alias-han-detail-text-font-weight-strong: var(
--spectrum-global-font-weight-black
);
--spectrum-alias-code-text-font-weight-regular: var(
--spectrum-global-font-weight-regular
);
--spectrum-alias-code-text-font-weight-strong: var(
--spectrum-global-font-weight-bold
);
--spectrum-alias-code-text-line-height: var(
--spectrum-global-font-line-height-medium
);
--spectrum-alias-heading-margin-bottom: var(
--spectrum-global-font-multiplier-25
);
--spectrum-alias-body-margin-bottom: var(
--spectrum-global-font-multiplier-75
);
--spectrum-alias-focus-ring-gap: var(
--spectrum-global-dimension-static-size-25
);
--spectrum-alias-focus-ring-size: var(
--spectrum-global-dimension-static-size-25
);
--spectrum-alias-loupe-entry-animation-duration: var(
--spectrum-global-animation-duration-300
);
--spectrum-alias-loupe-exit-animation-duration: var(
--spectrum-global-animation-duration-300
);
--spectrum-alias-dropshadow-blur: var(--spectrum-global-dimension-size-50);
--spectrum-alias-dropshadow-offset-y: var(
--spectrum-global-dimension-size-10
);
--spectrum-alias-font-size-default: var(
--spectrum-global-dimension-font-size-100
);
--spectrum-alias-layout-label-gap-size: var(
--spectrum-global-dimension-size-100
);
--spectrum-alias-pill-button-text-size: var(
--spectrum-global-dimension-font-size-100
);
--spectrum-alias-pill-button-text-baseline: var(
--spectrum-global-dimension-static-size-150
);
--spectrum-alias-border-radius-xsmall: var(
--spectrum-global-dimension-size-10
);
--spectrum-alias-border-radius-small: var(
--spectrum-global-dimension-size-25
);
--spectrum-alias-border-radius-regular: var(
--spectrum-global-dimension-size-50
);
--spectrum-alias-border-radius-medium: var(
--spectrum-global-dimension-size-100
);
--spectrum-alias-border-radius-large: var(
--spectrum-global-dimension-size-200
);
--spectrum-alias-single-line-height: var(
--spectrum-global-dimension-size-400
);
--spectrum-alias-single-line-width: var(
--spectrum-global-dimension-size-2400
);
--spectrum-alias-item-height-s: var(--spectrum-global-dimension-size-300);
--spectrum-alias-item-height-m: var(--spectrum-global-dimension-size-400);
--spectrum-alias-item-height-l: var(--spectrum-global-dimension-size-500);
--spectrum-alias-item-height-xl: var(--spectrum-global-dimension-size-600);
--spectrum-alias-item-rounded-border-radius-s: var(
--spectrum-global-dimension-size-150
);
--spectrum-alias-item-rounded-border-radius-m: var(
--spectrum-global-dimension-size-200
);
--spectrum-alias-item-rounded-border-radius-l: var(
--spectrum-global-dimension-size-250
);
--spectrum-alias-item-rounded-border-radius-xl: var(
--spectrum-global-dimension-size-300
);
--spectrum-alias-item-text-size-s: var(
--spectrum-global-dimension-font-size-75
);
--spectrum-alias-item-text-size-m: var(
--spectrum-global-dimension-font-size-100
);
--spectrum-alias-item-text-size-l: var(
--spectrum-global-dimension-font-size-200
);
--spectrum-alias-item-text-size-xl: var(
--spectrum-global-dimension-font-size-300
);
--spectrum-alias-item-text-padding-top-s: var(
--spectrum-global-dimension-static-size-50
);
--spectrum-alias-item-text-padding-top-m: var(
--spectrum-global-dimension-size-75
);
--spectrum-alias-item-text-padding-top-xl: var(
--spectrum-global-dimension-size-150
);
--spectrum-alias-item-text-padding-bottom-m: var(
--spectrum-global-dimension-size-115
);
--spectrum-alias-item-text-padding-bottom-l: var(
--spectrum-global-dimension-size-130
);
--spectrum-alias-item-text-padding-bottom-xl: var(
--spectrum-global-dimension-size-175
);
--spectrum-alias-item-icon-padding-top-s: var(
--spectrum-global-dimension-size-50
);
--spectrum-alias-item-icon-padding-top-m: var(
--spectrum-global-dimension-size-85
);
--spectrum-alias-item-icon-padding-top-l: var(
--spectrum-global-dimension-size-125
);
--spectrum-alias-item-icon-padding-top-xl: var(
--spectrum-global-dimension-size-160
);
--spectrum-alias-item-icon-padding-bottom-s: var(
--spectrum-global-dimension-size-50
);
--spectrum-alias-item-icon-padding-bottom-m: var(
--spectrum-global-dimension-size-85
);
--spectrum-alias-item-icon-padding-bottom-l: var(
--spectrum-global-dimension-size-125
);
--spectrum-alias-item-icon-padding-bottom-xl: var(
--spectrum-global-dimension-size-160
);
--spectrum-alias-item-mark-padding-top-s: var(
--spectrum-global-dimension-size-40
);
--spectrum-alias-item-mark-padding-top-l: var(
--spectrum-global-dimension-size-115
);
--spectrum-alias-item-mark-padding-top-xl: var(
--spectrum-global-dimension-size-130
);
--spectrum-alias-item-mark-padding-bottom-s: var(
--spectrum-global-dimension-size-40
);
--spectrum-alias-item-mark-padding-bottom-l: var(
--spectrum-global-dimension-size-115
);
--spectrum-alias-item-mark-padding-bottom-xl: var(
--spectrum-global-dimension-size-130
);
--spectrum-alias-item-padding-s: var(--spectrum-global-dimension-size-115);
--spectrum-alias-item-padding-m: var(--spectrum-global-dimension-size-150);
--spectrum-alias-item-padding-l: var(--spectrum-global-dimension-size-185);
--spectrum-alias-item-padding-xl: var(--spectrum-global-dimension-size-225);
--spectrum-alias-item-rounded-padding-s: var(
--spectrum-global-dimension-size-150
);
--spectrum-alias-item-rounded-padding-m: var(
--spectrum-global-dimension-size-200
);
--spectrum-alias-item-rounded-padding-l: var(
--spectrum-global-dimension-size-250
);
--spectrum-alias-item-rounded-padding-xl: var(
--spectrum-global-dimension-size-300
);
--spectrum-alias-item-icononly-padding-s: var(
--spectrum-global-dimension-size-50
);
--spectrum-alias-item-icononly-padding-m: var(
--spectrum-global-dimension-size-85
);
--spectrum-alias-item-icononly-padding-l: var(
--spectrum-global-dimension-size-125
);
--spectrum-alias-item-icononly-padding-xl: var(
--spectrum-global-dimension-size-160
);
--spectrum-alias-item-workflow-padding-left-s: var(
--spectrum-global-dimension-size-85
);
--spectrum-alias-item-workflow-padding-left-l: var(
--spectrum-global-dimension-size-160
);
--spectrum-alias-item-workflow-padding-left-xl: var(
--spectrum-global-dimension-size-185
);
--spectrum-alias-item-rounded-workflow-padding-left-s: var(
--spectrum-global-dimension-size-125
);
--spectrum-alias-item-rounded-workflow-padding-left-l: var(
--spectrum-global-dimension-size-225
);
--spectrum-alias-item-mark-padding-left-s: var(
--spectrum-global-dimension-size-85
);
--spectrum-alias-item-mark-padding-left-l: var(
--spectrum-global-dimension-size-160
);
--spectrum-alias-item-mark-padding-left-xl: var(
--spectrum-global-dimension-size-185
);
--spectrum-alias-item-control-1-size-s: var(
--spectrum-global-dimension-static-size-100
);
--spectrum-alias-item-control-1-size-m: var(
--spectrum-global-dimension-size-100
);
--spectrum-alias-item-control-2-size-m: var(
--spectrum-global-dimension-size-175
);
--spectrum-alias-item-control-2-size-l: var(
--spectrum-global-dimension-size-200
);
--spectrum-alias-item-control-2-size-xl: var(
--spectrum-global-dimension-size-225
);
--spectrum-alias-item-control-2-size-xxl: var(
--spectrum-global-dimension-size-250
);
--spectrum-alias-item-control-3-height-m: var(
--spectrum-global-dimension-size-175
);
--spectrum-alias-item-control-3-height-l: var(
--spectrum-global-dimension-size-200
);
--spectrum-alias-item-control-3-height-xl: var(
--spectrum-global-dimension-size-225
);
--spectrum-alias-item-mark-size-s: var(
--spectrum-global-dimension-size-225
);
--spectrum-alias-item-mark-size-l: var(
--spectrum-global-dimension-size-275
);
--spectrum-alias-item-mark-size-xl: var(
--spectrum-global-dimension-size-325
);
--spectrum-alias-workflow-icon-size-s: var(
--spectrum-global-dimension-size-200
);
--spectrum-alias-workflow-icon-size-m: var(
--spectrum-global-dimension-size-225
);
--spectrum-alias-workflow-icon-size-xl: var(
--spectrum-global-dimension-size-275
);
--spectrum-alias-ui-icon-alert-size-75: var(
--spectrum-global-dimension-size-200
);
--spectrum-alias-ui-icon-alert-size-100: var(
--spectrum-global-dimension-size-225
);
--spectrum-alias-ui-icon-alert-size-200: var(
--spectrum-global-dimension-size-250
);
--spectrum-alias-ui-icon-alert-size-300: var(
--spectrum-global-dimension-size-275
);
--spectrum-alias-ui-icon-triplegripper-size-100-height: var(
--spectrum-global-dimension-size-100
);
--spectrum-alias-ui-icon-doublegripper-size-100-width: var(
--spectrum-global-dimension-size-200
);
--spectrum-alias-ui-icon-singlegripper-size-100-width: var(
--spectrum-global-dimension-size-300
);
--spectrum-alias-ui-icon-cornertriangle-size-75: var(
--spectrum-global-dimension-size-65
);
--spectrum-alias-ui-icon-cornertriangle-size-200: var(
--spectrum-global-dimension-size-75
);
--spectrum-alias-ui-icon-asterisk-size-75: var(
--spectrum-global-dimension-static-size-100
);
--spectrum-alias-ui-icon-asterisk-size-100: var(
--spectrum-global-dimension-size-100
);
--spectrum-alias-item-control-gap-s: var(
--spectrum-global-dimension-size-115
);
--spectrum-alias-item-control-gap-m: var(
--spectrum-global-dimension-size-125
);
--spectrum-alias-item-control-gap-l: var(
--spectrum-global-dimension-size-130
);
--spectrum-alias-item-control-gap-xl: var(
--spectrum-global-dimension-size-160
);
--spectrum-alias-item-workflow-icon-gap-s: var(
--spectrum-global-dimension-size-85
);
--spectrum-alias-item-workflow-icon-gap-m: var(
--spectrum-global-dimension-size-100
);
--spectrum-alias-item-workflow-icon-gap-l: var(
--spectrum-global-dimension-size-115
);
--spectrum-alias-item-workflow-icon-gap-xl: var(
--spectrum-global-dimension-size-125
);
--spectrum-alias-item-mark-gap-s: var(--spectrum-global-dimension-size-85);
--spectrum-alias-item-mark-gap-m: var(--spectrum-global-dimension-size-100);
--spectrum-alias-item-mark-gap-l: var(--spectrum-global-dimension-size-115);
--spectrum-alias-item-mark-gap-xl: var(
--spectrum-global-dimension-size-125
);
--spectrum-alias-item-ui-icon-gap-s: var(
--spectrum-global-dimension-size-85
);
--spectrum-alias-item-ui-icon-gap-m: var(
--spectrum-global-dimension-size-100
);
--spectrum-alias-item-ui-icon-gap-l: var(
--spectrum-global-dimension-size-115
);
--spectrum-alias-item-ui-icon-gap-xl: var(
--spectrum-global-dimension-size-125
);
--spectrum-alias-item-clearbutton-gap-s: var(
--spectrum-global-dimension-size-50
);
--spectrum-alias-item-clearbutton-gap-m: var(
--spectrum-global-dimension-size-85
);
--spectrum-alias-item-clearbutton-gap-l: var(
--spectrum-global-dimension-size-125
);
--spectrum-alias-item-clearbutton-gap-xl: var(
--spectrum-global-dimension-size-150
);
--spectrum-alias-heading-xxxl-text-size: var(
--spectrum-global-dimension-font-size-1300
);
--spectrum-alias-heading-han-xxxl-text-size: var(
--spectrum-global-dimension-font-size-1300
);
--spectrum-alias-heading-han-xxxl-margin-top: var(
--spectrum-global-dimension-font-size-1200
);
--spectrum-alias-heading-xxxl-margin-top: var(
--spectrum-global-dimension-font-size-1200
);
--spectrum-alias-heading-xxl-text-size: var(
--spectrum-global-dimension-font-size-1100
);
--spectrum-alias-heading-xxl-margin-top: var(
--spectrum-global-dimension-font-size-900
);
--spectrum-alias-heading-han-xxl-text-size: var(
--spectrum-global-dimension-font-size-900
);
--spectrum-alias-heading-han-xxl-margin-top: var(
--spectrum-global-dimension-font-size-800
);
--spectrum-alias-heading-xl-text-size: var(
--spectrum-global-dimension-font-size-900
);
--spectrum-alias-heading-xl-margin-top: var(
--spectrum-global-dimension-font-size-800
);
--spectrum-alias-heading-han-xl-text-size: var(
--spectrum-global-dimension-font-size-800
);
--spectrum-alias-heading-han-xl-margin-top: var(
--spectrum-global-dimension-font-size-700
);
--spectrum-alias-heading-l-text-size: var(
--spectrum-global-dimension-font-size-700
);
--spectrum-alias-heading-l-margin-top: var(
--spectrum-global-dimension-font-size-600
);
--spectrum-alias-heading-han-l-text-size: var(
--spectrum-global-dimension-font-size-600
);
--spectrum-alias-heading-han-l-margin-top: var(
--spectrum-global-dimension-font-size-500
);
--spectrum-alias-heading-m-text-size: var(
--spectrum-global-dimension-font-size-500
);
--spectrum-alias-heading-m-margin-top: var(
--spectrum-global-dimension-font-size-400
);
--spectrum-alias-heading-han-m-text-size: var(
--spectrum-global-dimension-font-size-400
);
--spectrum-alias-heading-han-m-margin-top: var(
--spectrum-global-dimension-font-size-300
);
--spectrum-alias-heading-s-text-size: var(
--spectrum-global-dimension-font-size-300
);
--spectrum-alias-heading-s-margin-top: var(
--spectrum-global-dimension-font-size-200
);
--spectrum-alias-heading-xs-text-size: var(
--spectrum-global-dimension-font-size-200
);
--spectrum-alias-heading-xs-margin-top: var(
--spectrum-global-dimension-font-size-100
);
--spectrum-alias-heading-xxs-text-size: var(
--spectrum-global-dimension-font-size-100
);
--spectrum-alias-heading-xxs-margin-top: var(
--spectrum-global-dimension-font-size-75
);
--spectrum-alias-avatar-size-50: var(--spectrum-global-dimension-size-200);
--spectrum-alias-avatar-size-75: var(--spectrum-global-dimension-size-225);
--spectrum-alias-avatar-size-200: var(--spectrum-global-dimension-size-275);
--spectrum-alias-avatar-size-300: var(--spectrum-global-dimension-size-325);
--spectrum-alias-avatar-size-500: var(--spectrum-global-dimension-size-400);
--spectrum-alias-avatar-size-700: var(--spectrum-global-dimension-size-500);
--spectrum-alias-background-color-default: var(
--spectrum-global-color-gray-100
);
--spectrum-alias-background-color-disabled: var(
--spectrum-global-color-gray-200
);
--spectrum-alias-background-color-transparent: transparent;
--spectrum-alias-background-color-over-background-down: hsla(
0,
0%,
100%,
0.2
);
--spectrum-alias-background-color-quickactions-overlay: rgba(0, 0, 0, 0.2);
--spectrum-alias-placeholder-text-color: var(
--spectrum-global-color-gray-800
);
--spectrum-alias-placeholder-text-color-hover: var(
--spectrum-global-color-gray-900
);
--spectrum-alias-placeholder-text-color-down: var(
--spectrum-global-color-gray-900
);
--spectrum-alias-placeholder-text-color-selected: var(
--spectrum-global-color-gray-800
);
--spectrum-alias-label-text-color: var(--spectrum-global-color-gray-700);
--spectrum-alias-text-color: var(--spectrum-global-color-gray-800);
--spectrum-alias-text-color-hover: var(--spectrum-global-color-gray-900);
--spectrum-alias-text-color-down: var(--spectrum-global-color-gray-900);
--spectrum-alias-text-color-key-focus: var(
--spectrum-global-color-blue-600
);
--spectrum-alias-text-color-mouse-focus: var(
--spectrum-global-color-blue-600
);
--spectrum-alias-text-color-disabled: var(--spectrum-global-color-gray-500);
--spectrum-alias-text-color-invalid: var(--spectrum-global-color-red-500);
--spectrum-alias-text-color-selected: var(--spectrum-global-color-blue-600);
--spectrum-alias-text-color-selected-neutral: var(
--spectrum-global-color-gray-900
);
--spectrum-alias-text-color-over-background: var(
--spectrum-global-color-static-white
);
--spectrum-alias-text-color-over-background-disabled: hsla(
0,
0%,
100%,
0.2
);
--spectrum-alias-heading-text-color: var(--spectrum-global-color-gray-900);
--spectrum-alias-border-color: var(--spectrum-global-color-gray-400);
--spectrum-alias-border-color-hover: var(--spectrum-global-color-gray-500);
--spectrum-alias-border-color-down: var(--spectrum-global-color-gray-500);
--spectrum-alias-border-color-focus: var(--spectrum-global-color-blue-400);
--spectrum-alias-border-color-mouse-focus: var(
--spectrum-global-color-blue-500
);
--spectrum-alias-border-color-disabled: var(
--spectrum-global-color-gray-200
);
--spectrum-alias-border-color-extralight: var(
--spectrum-global-color-gray-100
);
--spectrum-alias-border-color-light: var(--spectrum-global-color-gray-200);
--spectrum-alias-border-color-mid: var(--spectrum-global-color-gray-300);
--spectrum-alias-border-color-dark: var(--spectrum-global-color-gray-400);
--spectrum-alias-border-color-darker-default: var(
--spectrum-global-color-gray-600
);
--spectrum-alias-border-color-darker-hover: var(
--spectrum-global-color-gray-900
);
--spectrum-alias-border-color-darker-down: var(
--spectrum-global-color-gray-900
);
--spectrum-alias-border-color-transparent: transparent;
--spectrum-alias-border-color-translucent-dark: rgba(0, 0, 0, 0.05);
--spectrum-alias-border-color-translucent-darker: rgba(0, 0, 0, 0.1);
--spectrum-alias-focus-color: var(--spectrum-global-color-blue-400);
--spectrum-alias-focus-ring-color: var(--spectrum-alias-focus-color);
--spectrum-alias-track-color-default: var(--spectrum-global-color-gray-300);
--spectrum-alias-track-color-disabled: var(
--spectrum-global-color-gray-300
);
--spectrum-alias-track-color-over-background: hsla(0, 0%, 100%, 0.2);
--spectrum-alias-icon-color: var(--spectrum-global-color-gray-700);
--spectrum-alias-icon-color-over-background: var(
--spectrum-global-color-static-white
);
--spectrum-alias-icon-color-hover: var(--spectrum-global-color-gray-900);
--spectrum-alias-icon-color-down: var(--spectrum-global-color-gray-900);
--spectrum-alias-icon-color-focus: var(--spectrum-global-color-gray-900);
--spectrum-alias-icon-color-disabled: var(--spectrum-global-color-gray-400);
--spectrum-alias-icon-color-over-background-disabled: hsla(
0,
0%,
100%,
0.2
);
--spectrum-alias-icon-color-selected-neutral: var(
--spectrum-global-color-gray-900
);
--spectrum-alias-icon-color-selected: var(--spectrum-global-color-blue-500);
--spectrum-alias-icon-color-selected-hover: var(
--spectrum-global-color-blue-600
);
--spectrum-alias-icon-color-selected-down: var(
--spectrum-global-color-blue-700
);
--spectrum-alias-icon-color-selected-focus: var(
--spectrum-global-color-blue-600
);
--spectrum-alias-image-opacity-disabled: var(
--spectrum-global-color-opacity-30
);
--spectrum-alias-toolbar-background-color: var(
--spectrum-global-color-gray-100
);
--spectrum-alias-colorhandle-outer-border-color: rgba(0, 0, 0, 0.42);
--spectrum-alias-code-highlight-color-default: var(
--spectrum-global-color-gray-800
);
--spectrum-alias-code-highlight-color-background: var(
--spectrum-global-color-gray-75
);
--spectrum-alias-code-highlight-color-keyword: var(
--spectrum-global-color-fuchsia-600
);
--spectrum-alias-code-highlight-color-section: var(
--spectrum-global-color-red-600
);
--spectrum-alias-code-highlight-color-literal: var(
--spectrum-global-color-blue-600
);
--spectrum-alias-code-highlight-color-attribute: var(
--spectrum-global-color-seafoam-600
);
--spectrum-alias-code-highlight-color-class: var(
--spectrum-global-color-magenta-600
);
--spectrum-alias-code-highlight-color-variable: var(
--spectrum-global-color-purple-600
);
--spectrum-alias-code-highlight-color-title: var(
--spectrum-global-color-indigo-600
);
--spectrum-alias-code-highlight-color-string: var(
--spectrum-global-color-fuchsia-600
);
--spectrum-alias-code-highlight-color-function: var(
--spectrum-global-color-blue-600
);
--spectrum-alias-code-highlight-color-comment: var(
--spectrum-global-color-gray-700
);
--spectrum-alias-categorical-color-1: var(
--spectrum-global-color-static-seafoam-200
);
--spectrum-alias-categorical-color-2: var(
--spectrum-global-color-static-indigo-700
);
--spectrum-alias-categorical-color-3: var(
--spectrum-global-color-static-orange-500
);
--spectrum-alias-categorical-color-4: var(
--spectrum-global-color-static-magenta-500
);
--spectrum-alias-categorical-color-5: var(
--spectrum-global-color-static-indigo-200
);
--spectrum-alias-categorical-color-6: var(
--spectrum-global-color-static-celery-200
);
--spectrum-alias-categorical-color-7: var(
--spectrum-global-color-static-blue-500
);
--spectrum-alias-categorical-color-8: var(
--spectrum-global-color-static-purple-800
);
--spectrum-alias-categorical-color-9: var(
--spectrum-global-color-static-yellow-500
);
--spectrum-alias-categorical-color-10: var(
--spectrum-global-color-static-orange-700
);
--spectrum-alias-categorical-color-11: var(
--spectrum-global-color-static-green-600
);
--spectrum-alias-categorical-color-12: var(
--spectrum-global-color-static-chartreuse-300
);
--spectrum-alias-categorical-color-13: var(
--spectrum-global-color-static-blue-200
);
--spectrum-alias-categorical-color-14: var(
--spectrum-global-color-static-fuchsia-500
);
--spectrum-alias-categorical-color-15: var(
--spectrum-global-color-static-magenta-200
);
--spectrum-alias-categorical-color-16: var(
--spectrum-global-color-static-yellow-200
);
}
/* stylelint-enable */