Skip to content

Commit

Permalink
feat(tokens)!: use spectrum-tokens 13.0.0-beta.16
Browse files Browse the repository at this point in the history
  • Loading branch information
@pfulton
pfulton committed Feb 22, 2024
1 parent 9c88721 commit 98335ab
Show file tree
Hide file tree
Showing 8 changed files with 191 additions and 213 deletions.
3 changes: 0 additions & 3 deletions tokens/dist/css/dark-vars.css
View file
Original file line number Diff line number Diff line change
Expand Up @@ -3,8 +3,6 @@
--spectrum-drop-shadow-color-rgb:0, 0, 0;
--spectrum-drop-shadow-color-opacity:0.8;
--spectrum-drop-shadow-color:rgba(var(--spectrum-drop-shadow-color-rgb), var(--spectrum-drop-shadow-color-opacity));
--spectrum-background-base-color:var(--spectrum-gray-25);
--spectrum-background-layer-1-color:var(--spectrum-gray-50);
--spectrum-background-layer-2-color:var(--spectrum-gray-75);
--spectrum-neutral-subdued-background-color-default:var(--spectrum-gray-400);
--spectrum-neutral-subdued-background-color-hover:var(--spectrum-gray-300);
Expand All @@ -27,7 +25,6 @@
--spectrum-positive-background-color-down:var(--spectrum-positive-color-500);
--spectrum-positive-background-color-key-focus:var(--spectrum-positive-color-500);
--spectrum-notice-background-color-default:var(--spectrum-notice-color-800);
--spectrum-gray-background-color-default:var(--spectrum-gray-700);
--spectrum-red-background-color-default:var(--spectrum-red-700);
--spectrum-orange-background-color-default:var(--spectrum-orange-800);
--spectrum-yellow-background-color-default:var(--spectrum-yellow-1000);
Expand Down
51 changes: 51 additions & 0 deletions tokens/dist/css/global-vars.css
View file
Original file line number Diff line number Diff line change
Expand Up @@ -4,6 +4,8 @@
--spectrum-static-black-focus-indicator-color:var(--spectrum-black);
--spectrum-overlay-color:var(--spectrum-black);
--spectrum-opacity-disabled:0.3;
--spectrum-background-base-color:var(--spectrum-gray-25);
--spectrum-background-layer-1-color:var(--spectrum-gray-50);
--spectrum-neutral-background-color-default:var(--spectrum-gray-800);
--spectrum-neutral-background-color-hover:var(--spectrum-gray-900);
--spectrum-neutral-background-color-down:var(--spectrum-gray-900);
Expand All @@ -17,6 +19,7 @@
--spectrum-disabled-background-color:var(--spectrum-gray-100);
--spectrum-disabled-static-white-background-color:var(--spectrum-transparent-white-100);
--spectrum-disabled-static-black-background-color:var(--spectrum-transparent-black-100);
--spectrum-gray-background-color-default:var(--spectrum-gray-700);
--spectrum-background-opacity-default:0;
--spectrum-background-opacity-hover:0.1;
--spectrum-background-opacity-down:0.1;
Expand Down Expand Up @@ -174,8 +177,15 @@
--spectrum-icon-color-inverse:var(--spectrum-gray-50);
--spectrum-icon-color-primary-default:var(--spectrum-neutral-content-color-default);
--spectrum-radio-button-selection-indicator:4px;
--spectrum-field-label-top-margin-small:0px;
--spectrum-field-label-top-margin-medium:0px;
--spectrum-field-label-top-margin-large:0px;
--spectrum-field-label-top-margin-extra-large:0px;
--spectrum-field-label-to-component:0px;
--spectrum-help-text-to-component:0px;
--spectrum-status-light-dot-size-small:8px;
--spectrum-action-button-edge-to-hold-icon-extra-small:3px;
--spectrum-action-button-edge-to-hold-icon-small:3px;
--spectrum-button-minimum-width-multiplier:2.25;
--spectrum-divider-thickness-small:1px;
--spectrum-divider-thickness-medium:2px;
Expand Down Expand Up @@ -241,6 +251,12 @@
--spectrum-drop-zone-title-size:var(--spectrum-illustrated-message-title-size);
--spectrum-drop-zone-cjk-title-size:var(--spectrum-illustrated-message-cjk-title-size);
--spectrum-drop-zone-body-size:var(--spectrum-illustrated-message-body-size);
--spectrum-accordion-top-to-text-compact-small:2px;
--spectrum-accordion-top-to-text-compact-medium:4px;
--spectrum-accordion-disclosure-indicator-to-text:0px;
--spectrum-accordion-edge-to-disclosure-indicator:0px;
--spectrum-accordion-edge-to-text:0px;
--spectrum-accordion-focus-indicator-gap:0px;
--spectrum-color-handle-border-width:var(--spectrum-border-width-200);
--spectrum-color-handle-inner-border-width:1px;
--spectrum-color-handle-outer-border-width:1px;
Expand All @@ -259,6 +275,7 @@
--spectrum-table-row-bottom-to-text-medium-compact:var(--spectrum-component-bottom-to-text-100);
--spectrum-table-row-bottom-to-text-large-compact:var(--spectrum-component-bottom-to-text-200);
--spectrum-table-row-bottom-to-text-extra-large-compact:var(--spectrum-component-bottom-to-text-300);
--spectrum-table-edge-to-content:16px;
--spectrum-table-border-divider-width:1px;
--spectrum-tab-item-height-small:var(--spectrum-component-height-200);
--spectrum-tab-item-height-medium:var(--spectrum-component-height-300);
Expand Down Expand Up @@ -288,9 +305,24 @@
--spectrum-in-field-button-inner-edge-to-disclosure-icon-stacked-medium:var(--spectrum-in-field-button-outer-edge-to-disclosure-icon-stacked-medium);
--spectrum-in-field-button-inner-edge-to-disclosure-icon-stacked-large:var(--spectrum-in-field-button-outer-edge-to-disclosure-icon-stacked-large);
--spectrum-in-field-button-inner-edge-to-disclosure-icon-stacked-extra-large:var(--spectrum-in-field-button-outer-edge-to-disclosure-icon-stacked-extra-large);
--spectrum-asterisk-icon-size-75:8px;
--spectrum-divider-vertical-minimum-height:200px;
--spectrum-divider-horizontal-minimum-width:200px;
--spectrum-tooltip-tip-corner-radius:1px;
--spectrum-tag-minimum-width-multiplier:1;
--spectrum-tag-maximum-width-multiplier:7;
--spectrum-corner-radius-0:0px;
--spectrum-corner-radius-75:3px;
--spectrum-corner-radius-100:4px;
--spectrum-corner-radius-200:5px;
--spectrum-corner-radius-300:6px;
--spectrum-corner-radius-400:7px;
--spectrum-corner-radius-500:8px;
--spectrum-corner-radius-600:9px;
--spectrum-corner-radius-700:10px;
--spectrum-corner-radius-800:16px;
--spectrum-corner-radius-1000:0.5;
--spectrum-drop-shadow-x:0px;
--spectrum-android-elevation:2dp;
--spectrum-spacing-50:2px;
--spectrum-spacing-75:4px;
Expand Down Expand Up @@ -319,6 +351,21 @@
--spectrum-component-size-width-ratio-down:0.3333;
--spectrum-component-size-minimum-perspective-down:24px;
--spectrum-component-size-difference-down:-2px;
--spectrum-corner-radius-none:var(--spectrum-corner-radius-0);
--spectrum-corner-radius-small-default:var(--spectrum-corner-radius-100);
--spectrum-corner-radius-medium-default:var(--spectrum-corner-radius-500);
--spectrum-corner-radius-large-default:var(--spectrum-corner-radius-700);
--spectrum-corner-radius-extra-large-default:var(--spectrum-corner-radius-800);
--spectrum-corner-radius-full:var(--spectrum-corner-radius-1000);
--spectrum-corner-radius-small-size-small:var(--spectrum-corner-radius-75);
--spectrum-corner-radius-small-size-medium:var(--spectrum-corner-radius-100);
--spectrum-corner-radius-small-size-large:var(--spectrum-corner-radius-200);
--spectrum-corner-radius-small-size-extra-large:var(--spectrum-corner-radius-300);
--spectrum-corner-radius-medium-size-extra-small:var(--spectrum-corner-radius-300);
--spectrum-corner-radius-medium-size-small:var(--spectrum-corner-radius-400);
--spectrum-corner-radius-medium-size-medium:var(--spectrum-corner-radius-500);
--spectrum-corner-radius-medium-size-large:var(--spectrum-corner-radius-600);
--spectrum-corner-radius-medium-size-extra-large:var(--spectrum-corner-radius-700);
--spectrum-accent-color-100:var(--spectrum-blue-100);
--spectrum-accent-color-200:var(--spectrum-blue-200);
--spectrum-accent-color-300:var(--spectrum-blue-300);
Expand Down Expand Up @@ -399,6 +446,10 @@
--spectrum-positive-color-1400:var(--spectrum-green-1400);
--spectrum-positive-color-1500:var(--spectrum-green-1500);
--spectrum-positive-color-1600:var(--spectrum-green-1600);
--spectrum-negative-subdued-background-color-default:var(--spectrum-negative-color-200);
--spectrum-negative-subdued-background-color-hover:var(--spectrum-negative-color-300);
--spectrum-negative-subdued-background-color-down:var(--spectrum-negative-color-300);
--spectrum-negative-subdued-background-color-key-focus:var(--spectrum-negative-color-300);
--spectrum-default-font-family:var(--spectrum-sans-serif-font-family);
--spectrum-sans-serif-font-family:Adobe Clean;
--spectrum-serif-font-family:Adobe Clean Serif;
Expand Down
70 changes: 21 additions & 49 deletions tokens/dist/css/large-vars.css
View file
Original file line number Diff line number Diff line change
Expand Up @@ -7,14 +7,14 @@
--spectrum-checkbox-top-to-control-medium:11px;
--spectrum-checkbox-top-to-control-large:15px;
--spectrum-checkbox-top-to-control-extra-large:19px;
--spectrum-switch-control-width-small:32px;
--spectrum-switch-control-width-medium:36px;
--spectrum-switch-control-width-large:41px;
--spectrum-switch-control-width-small:30px;
--spectrum-switch-control-width-medium:34px;
--spectrum-switch-control-width-large:38px;
--spectrum-switch-control-width-extra-large:46px;
--spectrum-switch-control-height-small:16px;
--spectrum-switch-control-height-medium:18px;
--spectrum-switch-control-height-large:20px;
--spectrum-switch-control-height-extra-large:22px;
--spectrum-switch-control-height-small:18px;
--spectrum-switch-control-height-medium:20px;
--spectrum-switch-control-height-large:22px;
--spectrum-switch-control-height-extra-large:26px;
--spectrum-switch-top-to-control-small:7px;
--spectrum-switch-top-to-control-medium:11px;
--spectrum-switch-top-to-control-large:15px;
Expand All @@ -35,10 +35,6 @@
--spectrum-field-label-top-to-asterisk-medium:15px;
--spectrum-field-label-top-to-asterisk-large:19px;
--spectrum-field-label-top-to-asterisk-extra-large:24px;
--spectrum-field-label-top-margin-small:0px;
--spectrum-field-label-top-margin-medium:0px;
--spectrum-field-label-top-margin-large:0px;
--spectrum-field-label-top-margin-extra-large:0px;
--spectrum-field-label-to-component-quiet-small:-10px;
--spectrum-field-label-to-component-quiet-medium:-10px;
--spectrum-field-label-to-component-quiet-large:-15px;
Expand All @@ -47,16 +43,13 @@
--spectrum-help-text-top-to-workflow-icon-medium:var(--spectrum-component-top-to-workflow-icon-100);
--spectrum-help-text-top-to-workflow-icon-large:var(--spectrum-component-top-to-workflow-icon-200);
--spectrum-help-text-top-to-workflow-icon-extra-large:var(--spectrum-component-top-to-workflow-icon-300);
--spectrum-status-light-dot-size-small:8px;
--spectrum-status-light-dot-size-medium:10px;
--spectrum-status-light-dot-size-large:12px;
--spectrum-status-light-dot-size-extra-large:12px;
--spectrum-status-light-top-to-dot-small:11px;
--spectrum-status-light-top-to-dot-medium:15px;
--spectrum-status-light-top-to-dot-large:19px;
--spectrum-status-light-top-to-dot-extra-large:24px;
--spectrum-action-button-edge-to-hold-icon-extra-small:3px;
--spectrum-action-button-edge-to-hold-icon-small:3px;
--spectrum-action-button-edge-to-hold-icon-medium:5px;
--spectrum-action-button-edge-to-hold-icon-large:6px;
--spectrum-action-button-edge-to-hold-icon-extra-large:7px;
Expand Down Expand Up @@ -205,10 +198,8 @@
--spectrum-coach-mark-title-size:var(--spectrum-heading-size-xxs);
--spectrum-coach-mark-body-size:var(--spectrum-body-size-xs);
--spectrum-coach-mark-pagination-body-size:var(--spectrum-body-size-xs);
--spectrum-accordion-top-to-text-compact-small:2px;
--spectrum-accordion-top-to-text-regular-small:7px;
--spectrum-accordion-small-top-to-text-spacious:12px;
--spectrum-accordion-top-to-text-compact-medium:4px;
--spectrum-accordion-top-to-text-regular-medium:9px;
--spectrum-accordion-top-to-text-spacious-medium:14px;
--spectrum-accordion-top-to-text-compact-large:7px;
Expand All @@ -230,10 +221,6 @@
--spectrum-accordion-bottom-to-text-regular-extra-large:15px;
--spectrum-accordion-bottom-to-text-spacious-extra-large:21px;
--spectrum-accordion-minimum-width:250px;
--spectrum-accordion-disclosure-indicator-to-text:0px;
--spectrum-accordion-edge-to-disclosure-indicator:0px;
--spectrum-accordion-edge-to-text:0px;
--spectrum-accordion-focus-indicator-gap:0px;
--spectrum-accordion-content-area-top-to-content:10px;
--spectrum-accordion-content-area-bottom-to-content:20px;
--spectrum-color-handle-size:20px;
Expand Down Expand Up @@ -270,7 +257,6 @@
--spectrum-table-row-bottom-to-text-medium-spacious:18px;
--spectrum-table-row-bottom-to-text-large-spacious:23px;
--spectrum-table-row-bottom-to-text-extra-large-spacious:27px;
--spectrum-table-edge-to-content:16px;
--spectrum-table-checkbox-to-text:30px;
--spectrum-table-header-row-checkbox-to-top-small:14px;
--spectrum-table-header-row-checkbox-to-top-medium:13px;
Expand Down Expand Up @@ -362,7 +348,6 @@
--spectrum-arrow-icon-size-400:18px;
--spectrum-arrow-icon-size-500:22px;
--spectrum-arrow-icon-size-600:24px;
--spectrum-asterisk-icon-size-75:8px;
--spectrum-asterisk-icon-size-100:10px;
--spectrum-asterisk-icon-size-200:12px;
--spectrum-asterisk-icon-size-300:12px;
Expand Down Expand Up @@ -398,18 +383,20 @@
--spectrum-dash-icon-size-500:20px;
--spectrum-dash-icon-size-600:22px;
--spectrum-side-navigation-header-to-item:10px;
--spectrum-corner-radius-0:0px;
--spectrum-corner-radius-75:3px;
--spectrum-corner-radius-100:4px;
--spectrum-corner-radius-200:5px;
--spectrum-corner-radius-300:6px;
--spectrum-corner-radius-400:7px;
--spectrum-corner-radius-500:8px;
--spectrum-corner-radius-600:9px;
--spectrum-corner-radius-700:10px;
--spectrum-corner-radius-800:16px;
--spectrum-corner-radius-1000:0.5;
--spectrum-drop-shadow-x:0px;
--spectrum-switch-handle-size-small:10px;
--spectrum-switch-handle-selected-size-small:12px;
--spectrum-switch-handle-selected-size-medium:14px;
--spectrum-switch-handle-selected-size-large:16px;
--spectrum-switch-handle-selected-size-extra-large:20px;
--spectrum-switch-handle-size-medium:12px;
--spectrum-switch-handle-size-large:14px;
--spectrum-switch-handle-size-extra-large:18px;
--spectrum-tag-label-to-clear-icon-small:10px;
--spectrum-tag-label-to-clear-icon-medium:15px;
--spectrum-tag-label-to-clear-icon-large:19px;
--spectrum-tag-edge-to-clear-icon-small:10px;
--spectrum-tag-edge-to-clear-icon-medium:15px;
--spectrum-tag-edge-to-clear-icon-large:19px;
--spectrum-drop-shadow-y:2px;
--spectrum-drop-shadow-blur:6px;
--spectrum-workflow-icon-size-50:16px;
Expand Down Expand Up @@ -542,21 +529,6 @@
--spectrum-corner-triangle-icon-size-100:7px;
--spectrum-corner-triangle-icon-size-200:8px;
--spectrum-corner-triangle-icon-size-300:8px;
--spectrum-corner-radius-none:var(--spectrum-corner-radius-0);
--spectrum-corner-radius-small-default:var(--spectrum-corner-radius-100);
--spectrum-corner-radius-medium-default:var(--spectrum-corner-radius-500);
--spectrum-corner-radius-large-default:var(--spectrum-corner-radius-700);
--spectrum-corner-radius-extra-large-default:var(--spectrum-corner-radius-800);
--spectrum-corner-radius-full:var(--spectrum-corner-radius-1000);
--spectrum-corner-radius-small-size-small:var(--spectrum-corner-radius-75);
--spectrum-corner-radius-small-size-medium:var(--spectrum-corner-radius-100);
--spectrum-corner-radius-small-size-large:var(--spectrum-corner-radius-200);
--spectrum-corner-radius-small-size-extra-large:var(--spectrum-corner-radius-300);
--spectrum-corner-radius-medium-size-extra-small:var(--spectrum-corner-radius-300);
--spectrum-corner-radius-medium-size-small:var(--spectrum-corner-radius-400);
--spectrum-corner-radius-medium-size-medium:var(--spectrum-corner-radius-500);
--spectrum-corner-radius-medium-size-large:var(--spectrum-corner-radius-600);
--spectrum-corner-radius-medium-size-extra-large:var(--spectrum-corner-radius-700);
--spectrum-font-size-50:13px;
--spectrum-font-size-75:15px;
--spectrum-font-size-100:17px;
Expand Down
3 changes: 0 additions & 3 deletions tokens/dist/css/light-vars.css
View file
Original file line number Diff line number Diff line change
Expand Up @@ -3,8 +3,6 @@
--spectrum-drop-shadow-color-rgb:0, 0, 0;
--spectrum-drop-shadow-color-opacity:0.15;
--spectrum-drop-shadow-color:rgba(var(--spectrum-drop-shadow-color-rgb), var(--spectrum-drop-shadow-color-opacity));
--spectrum-background-base-color:var(--spectrum-gray-25);
--spectrum-background-layer-1-color:var(--spectrum-gray-50);
--spectrum-background-layer-2-color:var(--spectrum-gray-25);
--spectrum-neutral-subdued-background-color-default:var(--spectrum-gray-700);
--spectrum-neutral-subdued-background-color-hover:var(--spectrum-gray-800);
Expand All @@ -27,7 +25,6 @@
--spectrum-positive-background-color-down:var(--spectrum-positive-color-1000);
--spectrum-positive-background-color-key-focus:var(--spectrum-positive-color-1000);
--spectrum-notice-background-color-default:var(--spectrum-notice-color-600);
--spectrum-gray-background-color-default:var(--spectrum-gray-700);
--spectrum-red-background-color-default:var(--spectrum-red-900);
--spectrum-orange-background-color-default:var(--spectrum-orange-600);
--spectrum-yellow-background-color-default:var(--spectrum-yellow-400);
Expand Down
Loading

0 comments on commit 98335ab

Please sign in to comment.