Skip to content

Commit

Permalink
fix(styles): update style-dictionary styles
Browse files Browse the repository at this point in the history
  • Loading branch information
@masoudmanson
masoudmanson committed Feb 8, 2024
1 parent e9dbe6a commit 7f907fc
Show file tree
Hide file tree
Showing 4 changed files with 72 additions and 68 deletions.
66 changes: 34 additions & 32 deletions packages/components/src/common/styles-dictionary/css/variables.css
View file
Original file line number Diff line number Diff line change
Expand Up @@ -2,33 +2,34 @@
--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-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;
Expand Down Expand Up @@ -66,9 +67,10 @@
--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-drop-shadows-shadow-l: 0px 2px 12px 0px rgba(0, 0, 0, 0.3);
--sds-drop-shadows-shadow-m: 0px 2px 10px 0px rgba(0, 0, 0, 0.15),
0px 2px 4px 0px rgba(0, 0, 0, 0.15);
--sds-drop-shadows-shadow-s: 0px 2px 4px 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;
Expand All @@ -94,8 +96,8 @@
--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-input-height: 16px;
--sds-icon-sizes-input-width: 16px;
--sds-icon-sizes-xs-height: 10px;
--sds-icon-sizes-xs-width: 10px;
--sds-icon-sizes-s-height: 14px;
Expand Down
4 changes: 2 additions & 2 deletions packages/components/src/common/styles-dictionary/scss/_variables.scss
View file
Original file line number Diff line number Diff line change
Expand Up @@ -93,8 +93,8 @@ $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-input-height: 16px;
$sds-icon-sizes-input-width: 16px;
$sds-icon-sizes-xs-height: 10px;
$sds-icon-sizes-xs-width: 10px;
$sds-icon-sizes-s-height: 14px;
Expand Down
66 changes: 34 additions & 32 deletions packages/data-viz/src/common/styles-dictionary/css/variables.css
View file
Original file line number Diff line number Diff line change
Expand Up @@ -2,33 +2,34 @@
--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-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;
Expand Down Expand Up @@ -66,9 +67,10 @@
--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-drop-shadows-shadow-l: 0px 2px 12px 0px rgba(0, 0, 0, 0.3);
--sds-drop-shadows-shadow-m: 0px 2px 10px 0px rgba(0, 0, 0, 0.15),
0px 2px 4px 0px rgba(0, 0, 0, 0.15);
--sds-drop-shadows-shadow-s: 0px 2px 4px 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;
Expand All @@ -94,8 +96,8 @@
--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-input-height: 16px;
--sds-icon-sizes-input-width: 16px;
--sds-icon-sizes-xs-height: 10px;
--sds-icon-sizes-xs-width: 10px;
--sds-icon-sizes-s-height: 14px;
Expand Down
4 changes: 2 additions & 2 deletions packages/data-viz/src/common/styles-dictionary/scss/_variables.scss
View file
Original file line number Diff line number Diff line change
Expand Up @@ -93,8 +93,8 @@ $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-input-height: 16px;
$sds-icon-sizes-input-width: 16px;
$sds-icon-sizes-xs-height: 10px;
$sds-icon-sizes-xs-width: 10px;
$sds-icon-sizes-s-height: 14px;
Expand Down

0 comments on commit 7f907fc

Please sign in to comment.