@sage/design-tokens 14.5.0 → 14.6.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/css/frozenproduct/all.css +42 -20
- package/css/frozenproduct/large/components/button.css +32 -13
- package/css/frozenproduct/large/components/form.css +6 -3
- package/css/frozenproduct/large/global.css +2 -2
- package/css/frozenproduct/small/components/button.css +32 -13
- package/css/frozenproduct/small/components/form.css +6 -3
- package/css/frozenproduct/small/global.css +2 -2
- package/css/marketing/all.css +42 -20
- package/css/marketing/large/components/button.css +32 -13
- package/css/marketing/large/components/form.css +6 -3
- package/css/marketing/large/global.css +2 -2
- package/css/marketing/small/components/button.css +32 -13
- package/css/marketing/small/components/form.css +6 -3
- package/css/marketing/small/global.css +2 -2
- package/css/product/all.css +42 -20
- package/css/product/large/components/button.css +32 -13
- package/css/product/large/components/form.css +6 -3
- package/css/product/large/global.css +2 -2
- package/css/product/small/components/button.css +32 -13
- package/css/product/small/components/form.css +6 -3
- package/css/product/small/global.css +2 -2
- package/ios/frozenproduct/large/dark/components/button.h +32 -13
- package/ios/frozenproduct/large/dark/components/form.h +6 -3
- package/ios/frozenproduct/large/global.h +2 -2
- package/ios/frozenproduct/large/light/components/button.h +32 -13
- package/ios/frozenproduct/large/light/components/form.h +6 -3
- package/ios/frozenproduct/small/dark/components/button.h +32 -13
- package/ios/frozenproduct/small/dark/components/form.h +6 -3
- package/ios/frozenproduct/small/global.h +2 -2
- package/ios/frozenproduct/small/light/components/button.h +32 -13
- package/ios/frozenproduct/small/light/components/form.h +6 -3
- package/ios/marketing/large/dark/components/button.h +32 -13
- package/ios/marketing/large/dark/components/form.h +6 -3
- package/ios/marketing/large/global.h +2 -2
- package/ios/marketing/large/light/components/button.h +32 -13
- package/ios/marketing/large/light/components/form.h +6 -3
- package/ios/marketing/small/dark/components/button.h +32 -13
- package/ios/marketing/small/dark/components/form.h +6 -3
- package/ios/marketing/small/global.h +2 -2
- package/ios/marketing/small/light/components/button.h +32 -13
- package/ios/marketing/small/light/components/form.h +6 -3
- package/ios/product/large/dark/components/button.h +32 -13
- package/ios/product/large/dark/components/form.h +6 -3
- package/ios/product/large/global.h +2 -2
- package/ios/product/large/light/components/button.h +32 -13
- package/ios/product/large/light/components/form.h +6 -3
- package/ios/product/small/dark/components/button.h +32 -13
- package/ios/product/small/dark/components/form.h +6 -3
- package/ios/product/small/global.h +2 -2
- package/ios/product/small/light/components/button.h +32 -13
- package/ios/product/small/light/components/form.h +6 -3
- package/js/common/frozenproduct/large/dark/components/button.d.ts +28 -1
- package/js/common/frozenproduct/large/dark/components/button.js +366 -39
- package/js/common/frozenproduct/large/dark/components/form.d.ts +7 -0
- package/js/common/frozenproduct/large/dark/components/form.js +61 -6
- package/js/common/frozenproduct/large/global.d.ts +2 -2
- package/js/common/frozenproduct/large/global.js +18 -14
- package/js/common/frozenproduct/large/light/components/button.d.ts +28 -1
- package/js/common/frozenproduct/large/light/components/button.js +366 -39
- package/js/common/frozenproduct/large/light/components/form.d.ts +7 -0
- package/js/common/frozenproduct/large/light/components/form.js +61 -6
- package/js/common/frozenproduct/small/dark/components/button.d.ts +28 -1
- package/js/common/frozenproduct/small/dark/components/button.js +366 -39
- package/js/common/frozenproduct/small/dark/components/form.d.ts +7 -0
- package/js/common/frozenproduct/small/dark/components/form.js +61 -6
- package/js/common/frozenproduct/small/global.d.ts +2 -2
- package/js/common/frozenproduct/small/global.js +18 -14
- package/js/common/frozenproduct/small/light/components/button.d.ts +28 -1
- package/js/common/frozenproduct/small/light/components/button.js +366 -39
- package/js/common/frozenproduct/small/light/components/form.d.ts +7 -0
- package/js/common/frozenproduct/small/light/components/form.js +61 -6
- package/js/common/marketing/large/dark/components/button.d.ts +28 -1
- package/js/common/marketing/large/dark/components/button.js +366 -39
- package/js/common/marketing/large/dark/components/form.d.ts +7 -0
- package/js/common/marketing/large/dark/components/form.js +61 -6
- package/js/common/marketing/large/global.d.ts +2 -2
- package/js/common/marketing/large/global.js +18 -14
- package/js/common/marketing/large/light/components/button.d.ts +28 -1
- package/js/common/marketing/large/light/components/button.js +366 -39
- package/js/common/marketing/large/light/components/form.d.ts +7 -0
- package/js/common/marketing/large/light/components/form.js +61 -6
- package/js/common/marketing/small/dark/components/button.d.ts +28 -1
- package/js/common/marketing/small/dark/components/button.js +366 -39
- package/js/common/marketing/small/dark/components/form.d.ts +7 -0
- package/js/common/marketing/small/dark/components/form.js +61 -6
- package/js/common/marketing/small/global.d.ts +2 -2
- package/js/common/marketing/small/global.js +18 -14
- package/js/common/marketing/small/light/components/button.d.ts +28 -1
- package/js/common/marketing/small/light/components/button.js +366 -39
- package/js/common/marketing/small/light/components/form.d.ts +7 -0
- package/js/common/marketing/small/light/components/form.js +61 -6
- package/js/common/product/large/dark/components/button.d.ts +28 -1
- package/js/common/product/large/dark/components/button.js +366 -39
- package/js/common/product/large/dark/components/form.d.ts +7 -0
- package/js/common/product/large/dark/components/form.js +61 -6
- package/js/common/product/large/global.d.ts +2 -2
- package/js/common/product/large/global.js +18 -14
- package/js/common/product/large/light/components/button.d.ts +28 -1
- package/js/common/product/large/light/components/button.js +366 -39
- package/js/common/product/large/light/components/form.d.ts +7 -0
- package/js/common/product/large/light/components/form.js +61 -6
- package/js/common/product/small/dark/components/button.d.ts +28 -1
- package/js/common/product/small/dark/components/button.js +366 -39
- package/js/common/product/small/dark/components/form.d.ts +7 -0
- package/js/common/product/small/dark/components/form.js +61 -6
- package/js/common/product/small/global.d.ts +2 -2
- package/js/common/product/small/global.js +18 -14
- package/js/common/product/small/light/components/button.d.ts +28 -1
- package/js/common/product/small/light/components/button.js +366 -39
- package/js/common/product/small/light/components/form.d.ts +7 -0
- package/js/common/product/small/light/components/form.js +61 -6
- package/js/es6/frozenproduct/large/dark/components/button.d.ts +20 -1
- package/js/es6/frozenproduct/large/dark/components/button.js +32 -13
- package/js/es6/frozenproduct/large/dark/components/form.d.ts +6 -3
- package/js/es6/frozenproduct/large/dark/components/form.js +6 -3
- package/js/es6/frozenproduct/large/global.d.ts +2 -2
- package/js/es6/frozenproduct/large/global.js +2 -2
- package/js/es6/frozenproduct/large/light/components/button.d.ts +20 -1
- package/js/es6/frozenproduct/large/light/components/button.js +32 -13
- package/js/es6/frozenproduct/large/light/components/form.d.ts +6 -3
- package/js/es6/frozenproduct/large/light/components/form.js +6 -3
- package/js/es6/frozenproduct/small/dark/components/button.d.ts +20 -1
- package/js/es6/frozenproduct/small/dark/components/button.js +32 -13
- package/js/es6/frozenproduct/small/dark/components/form.d.ts +6 -3
- package/js/es6/frozenproduct/small/dark/components/form.js +6 -3
- package/js/es6/frozenproduct/small/global.d.ts +2 -2
- package/js/es6/frozenproduct/small/global.js +2 -2
- package/js/es6/frozenproduct/small/light/components/button.d.ts +20 -1
- package/js/es6/frozenproduct/small/light/components/button.js +32 -13
- package/js/es6/frozenproduct/small/light/components/form.d.ts +6 -3
- package/js/es6/frozenproduct/small/light/components/form.js +6 -3
- package/js/es6/marketing/large/dark/components/button.d.ts +20 -1
- package/js/es6/marketing/large/dark/components/button.js +32 -13
- package/js/es6/marketing/large/dark/components/form.d.ts +6 -3
- package/js/es6/marketing/large/dark/components/form.js +6 -3
- package/js/es6/marketing/large/global.d.ts +2 -2
- package/js/es6/marketing/large/global.js +2 -2
- package/js/es6/marketing/large/light/components/button.d.ts +20 -1
- package/js/es6/marketing/large/light/components/button.js +32 -13
- package/js/es6/marketing/large/light/components/form.d.ts +6 -3
- package/js/es6/marketing/large/light/components/form.js +6 -3
- package/js/es6/marketing/small/dark/components/button.d.ts +20 -1
- package/js/es6/marketing/small/dark/components/button.js +32 -13
- package/js/es6/marketing/small/dark/components/form.d.ts +6 -3
- package/js/es6/marketing/small/dark/components/form.js +6 -3
- package/js/es6/marketing/small/global.d.ts +2 -2
- package/js/es6/marketing/small/global.js +2 -2
- package/js/es6/marketing/small/light/components/button.d.ts +20 -1
- package/js/es6/marketing/small/light/components/button.js +32 -13
- package/js/es6/marketing/small/light/components/form.d.ts +6 -3
- package/js/es6/marketing/small/light/components/form.js +6 -3
- package/js/es6/product/large/dark/components/button.d.ts +20 -1
- package/js/es6/product/large/dark/components/button.js +32 -13
- package/js/es6/product/large/dark/components/form.d.ts +6 -3
- package/js/es6/product/large/dark/components/form.js +6 -3
- package/js/es6/product/large/global.d.ts +2 -2
- package/js/es6/product/large/global.js +2 -2
- package/js/es6/product/large/light/components/button.d.ts +20 -1
- package/js/es6/product/large/light/components/button.js +32 -13
- package/js/es6/product/large/light/components/form.d.ts +6 -3
- package/js/es6/product/large/light/components/form.js +6 -3
- package/js/es6/product/small/dark/components/button.d.ts +20 -1
- package/js/es6/product/small/dark/components/button.js +32 -13
- package/js/es6/product/small/dark/components/form.d.ts +6 -3
- package/js/es6/product/small/dark/components/form.js +6 -3
- package/js/es6/product/small/global.d.ts +2 -2
- package/js/es6/product/small/global.js +2 -2
- package/js/es6/product/small/light/components/button.d.ts +20 -1
- package/js/es6/product/small/light/components/button.js +32 -13
- package/js/es6/product/small/light/components/form.d.ts +6 -3
- package/js/es6/product/small/light/components/form.js +6 -3
- package/js/umd/frozenproduct/large/dark/components/button.js +366 -39
- package/js/umd/frozenproduct/large/dark/components/form.js +61 -6
- package/js/umd/frozenproduct/large/global.js +18 -14
- package/js/umd/frozenproduct/large/light/components/button.js +366 -39
- package/js/umd/frozenproduct/large/light/components/form.js +61 -6
- package/js/umd/frozenproduct/small/dark/components/button.js +366 -39
- package/js/umd/frozenproduct/small/dark/components/form.js +61 -6
- package/js/umd/frozenproduct/small/global.js +18 -14
- package/js/umd/frozenproduct/small/light/components/button.js +366 -39
- package/js/umd/frozenproduct/small/light/components/form.js +61 -6
- package/js/umd/marketing/large/dark/components/button.js +366 -39
- package/js/umd/marketing/large/dark/components/form.js +61 -6
- package/js/umd/marketing/large/global.js +18 -14
- package/js/umd/marketing/large/light/components/button.js +366 -39
- package/js/umd/marketing/large/light/components/form.js +61 -6
- package/js/umd/marketing/small/dark/components/button.js +366 -39
- package/js/umd/marketing/small/dark/components/form.js +61 -6
- package/js/umd/marketing/small/global.js +18 -14
- package/js/umd/marketing/small/light/components/button.js +366 -39
- package/js/umd/marketing/small/light/components/form.js +61 -6
- package/js/umd/product/large/dark/components/button.js +366 -39
- package/js/umd/product/large/dark/components/form.js +61 -6
- package/js/umd/product/large/global.js +18 -14
- package/js/umd/product/large/light/components/button.js +366 -39
- package/js/umd/product/large/light/components/form.js +61 -6
- package/js/umd/product/small/dark/components/button.js +366 -39
- package/js/umd/product/small/dark/components/form.js +61 -6
- package/js/umd/product/small/global.js +18 -14
- package/js/umd/product/small/light/components/button.js +366 -39
- package/js/umd/product/small/light/components/form.js +61 -6
- package/json/flat/frozenproduct/large/dark/components/button.json +32 -13
- package/json/flat/frozenproduct/large/dark/components/form.json +6 -3
- package/json/flat/frozenproduct/large/global.json +2 -2
- package/json/flat/frozenproduct/large/light/components/button.json +32 -13
- package/json/flat/frozenproduct/large/light/components/form.json +6 -3
- package/json/flat/frozenproduct/small/dark/components/button.json +32 -13
- package/json/flat/frozenproduct/small/dark/components/form.json +6 -3
- package/json/flat/frozenproduct/small/global.json +2 -2
- package/json/flat/frozenproduct/small/light/components/button.json +32 -13
- package/json/flat/frozenproduct/small/light/components/form.json +6 -3
- package/json/flat/marketing/large/dark/components/button.json +32 -13
- package/json/flat/marketing/large/dark/components/form.json +6 -3
- package/json/flat/marketing/large/global.json +2 -2
- package/json/flat/marketing/large/light/components/button.json +32 -13
- package/json/flat/marketing/large/light/components/form.json +6 -3
- package/json/flat/marketing/small/dark/components/button.json +32 -13
- package/json/flat/marketing/small/dark/components/form.json +6 -3
- package/json/flat/marketing/small/global.json +2 -2
- package/json/flat/marketing/small/light/components/button.json +32 -13
- package/json/flat/marketing/small/light/components/form.json +6 -3
- package/json/flat/product/large/dark/components/button.json +32 -13
- package/json/flat/product/large/dark/components/form.json +6 -3
- package/json/flat/product/large/global.json +2 -2
- package/json/flat/product/large/light/components/button.json +32 -13
- package/json/flat/product/large/light/components/form.json +6 -3
- package/json/flat/product/small/dark/components/button.json +32 -13
- package/json/flat/product/small/dark/components/form.json +6 -3
- package/json/flat/product/small/global.json +2 -2
- package/json/flat/product/small/light/components/button.json +32 -13
- package/json/flat/product/small/light/components/form.json +6 -3
- package/json/nested/frozenproduct/large/dark/components/button.json +41 -14
- package/json/nested/frozenproduct/large/dark/components/form.json +10 -3
- package/json/nested/frozenproduct/large/global.json +2 -2
- package/json/nested/frozenproduct/large/light/components/button.json +41 -14
- package/json/nested/frozenproduct/large/light/components/form.json +10 -3
- package/json/nested/frozenproduct/small/dark/components/button.json +41 -14
- package/json/nested/frozenproduct/small/dark/components/form.json +10 -3
- package/json/nested/frozenproduct/small/global.json +2 -2
- package/json/nested/frozenproduct/small/light/components/button.json +41 -14
- package/json/nested/frozenproduct/small/light/components/form.json +10 -3
- package/json/nested/marketing/large/dark/components/button.json +41 -14
- package/json/nested/marketing/large/dark/components/form.json +10 -3
- package/json/nested/marketing/large/global.json +2 -2
- package/json/nested/marketing/large/light/components/button.json +41 -14
- package/json/nested/marketing/large/light/components/form.json +10 -3
- package/json/nested/marketing/small/dark/components/button.json +41 -14
- package/json/nested/marketing/small/dark/components/form.json +10 -3
- package/json/nested/marketing/small/global.json +2 -2
- package/json/nested/marketing/small/light/components/button.json +41 -14
- package/json/nested/marketing/small/light/components/form.json +10 -3
- package/json/nested/product/large/dark/components/button.json +41 -14
- package/json/nested/product/large/dark/components/form.json +10 -3
- package/json/nested/product/large/global.json +2 -2
- package/json/nested/product/large/light/components/button.json +41 -14
- package/json/nested/product/large/light/components/form.json +10 -3
- package/json/nested/product/small/dark/components/button.json +41 -14
- package/json/nested/product/small/dark/components/form.json +10 -3
- package/json/nested/product/small/global.json +2 -2
- package/json/nested/product/small/light/components/button.json +41 -14
- package/json/nested/product/small/light/components/form.json +10 -3
- package/package.json +1 -1
- package/sage-design-tokens-14.6.0.tgz +0 -0
- package/scss/frozenproduct/large/components/button.scss +45 -26
- package/scss/frozenproduct/large/components/container.scss +10 -10
- package/scss/frozenproduct/large/components/form.scss +13 -10
- package/scss/frozenproduct/large/components/link.scss +2 -2
- package/scss/frozenproduct/large/components/nav.scss +5 -5
- package/scss/frozenproduct/large/components/page.scss +1 -1
- package/scss/frozenproduct/large/components/popover.scss +2 -2
- package/scss/frozenproduct/large/components/progress.scss +6 -6
- package/scss/frozenproduct/large/components/status.scss +3 -3
- package/scss/frozenproduct/large/components/tab.scss +7 -7
- package/scss/frozenproduct/large/components/table.scss +10 -10
- package/scss/frozenproduct/large/global.scss +2 -2
- package/scss/frozenproduct/small/components/button.scss +45 -26
- package/scss/frozenproduct/small/components/container.scss +10 -10
- package/scss/frozenproduct/small/components/form.scss +13 -10
- package/scss/frozenproduct/small/components/link.scss +2 -2
- package/scss/frozenproduct/small/components/nav.scss +5 -5
- package/scss/frozenproduct/small/components/page.scss +1 -1
- package/scss/frozenproduct/small/components/popover.scss +2 -2
- package/scss/frozenproduct/small/components/progress.scss +6 -6
- package/scss/frozenproduct/small/components/status.scss +3 -3
- package/scss/frozenproduct/small/components/tab.scss +7 -7
- package/scss/frozenproduct/small/components/table.scss +10 -10
- package/scss/frozenproduct/small/global.scss +2 -2
- package/scss/marketing/large/components/button.scss +45 -26
- package/scss/marketing/large/components/container.scss +10 -10
- package/scss/marketing/large/components/form.scss +13 -10
- package/scss/marketing/large/components/link.scss +2 -2
- package/scss/marketing/large/components/nav.scss +5 -5
- package/scss/marketing/large/components/page.scss +1 -1
- package/scss/marketing/large/components/progress.scss +6 -6
- package/scss/marketing/large/components/status.scss +3 -3
- package/scss/marketing/large/components/tab.scss +7 -7
- package/scss/marketing/large/components/table.scss +10 -10
- package/scss/marketing/large/global.scss +2 -2
- package/scss/marketing/small/components/button.scss +45 -26
- package/scss/marketing/small/components/container.scss +10 -10
- package/scss/marketing/small/components/form.scss +13 -10
- package/scss/marketing/small/components/link.scss +2 -2
- package/scss/marketing/small/components/nav.scss +5 -5
- package/scss/marketing/small/components/page.scss +1 -1
- package/scss/marketing/small/components/popover.scss +2 -2
- package/scss/marketing/small/components/progress.scss +6 -6
- package/scss/marketing/small/components/status.scss +3 -3
- package/scss/marketing/small/components/tab.scss +7 -7
- package/scss/marketing/small/components/table.scss +10 -10
- package/scss/marketing/small/global.scss +2 -2
- package/scss/product/large/components/button.scss +45 -26
- package/scss/product/large/components/form.scss +6 -3
- package/scss/product/large/global.scss +2 -2
- package/scss/product/small/components/button.scss +32 -13
- package/scss/product/small/components/form.scss +6 -3
- package/scss/product/small/global.scss +2 -2
- package/sage-design-tokens-14.5.0.tgz +0 -0
@@ -133,8 +133,8 @@
|
|
133
133
|
--global-typography-component-placeholdertext-xl: 500 30px/1.5 Sage UI;
|
134
134
|
--global-typography-component-placeholdertext-xxl: 500 36px/1.5 Sage UI;
|
135
135
|
--global-typography-component-notification-m: 500 13px/1 Sage UI; /* used for badge text - notifications on buttons and in global nav */
|
136
|
-
--global-font-size-adaptive-step-
|
137
|
-
--global-font-size-adaptive-step-
|
136
|
+
--global-font-size-adaptive-step-minus2: 12px;
|
137
|
+
--global-font-size-adaptive-step-minus1: 13px;
|
138
138
|
--global-font-size-adaptive-step0: 14px;
|
139
139
|
--global-font-size-adaptive-step1: 16px;
|
140
140
|
--global-font-size-adaptive-step2: 17px;
|
@@ -882,6 +882,7 @@
|
|
882
882
|
--button-size-toggle-s: var(--global-size-macro-s); /* min-height on S single toggle, and on button within M toggle group */
|
883
883
|
--button-size-toggle-m: var(--global-size-macro-m); /* min-height on M single toggle, and on button within L toggle group */
|
884
884
|
--button-size-toggle-l: var(--global-size-macro-l); /* min-height on L single toggle */
|
885
|
+
--button-size-icon-s: var(--global-size-icon-s);
|
885
886
|
--button-size-icon-m: var(--global-size-icon-m);
|
886
887
|
--button-size-video-s: var(--global-size-macro-m);
|
887
888
|
--button-size-video-m: var(--global-size-macro-xxl);
|
@@ -916,9 +917,12 @@
|
|
916
917
|
--button-space-primary-y-s: var(--global-space-micro-s); /* Bottom and top padding on small buttons. */
|
917
918
|
--button-space-primary-y-m: var(--global-space-micro-l); /* Top and bottom padding on medium buttons */
|
918
919
|
--button-space-primary-y-l: calc(var(--global-space-micro-xl) - 0.5); /* Top and bottom padding on Large buttons */
|
919
|
-
--button-space-primary-icononly-x-s: var(--global-space-micro-
|
920
|
-
--button-space-primary-icononly-x-m: var(--global-space-micro-
|
921
|
-
--button-space-primary-icononly-x-l: var(--global-space-micro-
|
920
|
+
--button-space-primary-icononly-x-s: var(--global-space-micro-m); /* Left and right padding on icon-only S size primary buttons */
|
921
|
+
--button-space-primary-icononly-x-m: var(--global-space-micro-xl); /* Left and right padding on icon-only M size primary buttons */
|
922
|
+
--button-space-primary-icononly-x-l: calc(var(--global-space-micro-xxl) + var(--global-space-micro-xs)); /* Left and right padding on icon-only L size primary buttons */
|
923
|
+
--button-space-primary-icononly-y-s: var(--global-space-micro-m); /* Top and bottom padding on icon-only S size primary buttons */
|
924
|
+
--button-space-primary-icononly-y-m: var(--global-space-micro-xl); /* Top and bottom padding on icon-only M size primary buttons */
|
925
|
+
--button-space-primary-icononly-y-l: calc(var(--global-space-micro-xxl) + var(--global-space-micro-xs)); /* Top and bottom padding on icon-only L size primary buttons */
|
922
926
|
--button-space-secondary-x-xs: var(--global-space-macro-xxxs); /* Left and right padding on XS table buttons */
|
923
927
|
--button-space-secondary-x-s: var(--global-space-micro-xxl); /* Left and right padding on small buttons */
|
924
928
|
--button-space-secondary-x-m: var(--global-space-macro-xs); /* Left and right padding on medium buttons */
|
@@ -927,13 +931,18 @@
|
|
927
931
|
--button-space-secondary-y-s: var(--global-space-micro-s); /* Bottom and top padding on small buttons. */
|
928
932
|
--button-space-secondary-y-m: var(--global-space-micro-l); /* Top and bottom padding on medium buttons */
|
929
933
|
--button-space-secondary-y-l: calc(var(--global-space-micro-xl) - 0.5); /* Top and bottom padding on Large buttons */
|
934
|
+
--button-space-secondary-xg-xs: var(--global-space-micro-s); /* Item spacing inside XS buttons */
|
930
935
|
--button-space-secondary-xg-s: var(--global-space-macro-xxxs); /* Item spacing inside buttons */
|
931
936
|
--button-space-secondary-xg-m: var(--global-space-macro-xxxs); /* Item spacing inside buttons */
|
932
937
|
--button-space-secondary-xg-l: var(--global-space-macro-xxxs); /* Item spacing inside buttons */
|
933
|
-
--button-space-secondary-
|
934
|
-
--button-space-secondary-icononly-x-s: var(--global-space-micro-
|
935
|
-
--button-space-secondary-icononly-x-m: var(--global-space-micro-
|
936
|
-
--button-space-secondary-icononly-x-l: var(--global-space-micro-
|
938
|
+
--button-space-secondary-icononly-x-xs: var(--global-space-micro-s); /* Left and right padding on icon-only XS size secondary buttons */
|
939
|
+
--button-space-secondary-icononly-x-s: var(--global-space-micro-m); /* Left and right padding on icon-only S size secondary buttons */
|
940
|
+
--button-space-secondary-icononly-x-m: var(--global-space-micro-xl); /* Left and right padding on icon-only M size secondary buttons */
|
941
|
+
--button-space-secondary-icononly-x-l: calc(var(--global-space-micro-xxl) + var(--global-space-micro-xs)); /* Left and right padding on icon-only L size secondary buttons */
|
942
|
+
--button-space-secondary-icononly-y-xs: var(--global-space-micro-s); /* Top and bottom padding on icon-only XS size secondary buttons */
|
943
|
+
--button-space-secondary-icononly-y-s: var(--global-space-micro-m); /* Top and bottom padding on icon-only S size secondary buttons */
|
944
|
+
--button-space-secondary-icononly-y-m: var(--global-space-micro-xl); /* Top and bottom padding on icon-only M size secondary buttons */
|
945
|
+
--button-space-secondary-icononly-y-l: calc(var(--global-space-micro-xxl) + var(--global-space-micro-xs)); /* Top and bottom padding on icon-only L size secondary buttons */
|
937
946
|
--button-space-tertiary-y-xs: calc((var(--global-space-macro-xxxs) / 4) - 0.5); /* top and bottom padding on XS table buttons */
|
938
947
|
--button-space-tertiary-y-s: var(--global-space-micro-s); /* Bottom and top padding on small buttons. */
|
939
948
|
--button-space-tertiary-y-m: var(--global-space-micro-l); /* Top and bottom padding on medium buttons */
|
@@ -946,9 +955,14 @@
|
|
946
955
|
--button-space-tertiary-xg-s: var(--global-space-macro-xxxs); /* Item spacing inside buttons */
|
947
956
|
--button-space-tertiary-xg-m: var(--global-space-macro-xxxs); /* Item spacing inside buttons */
|
948
957
|
--button-space-tertiary-xg-l: var(--global-space-macro-xxxs); /* Item spacing inside buttons */
|
949
|
-
--button-space-tertiary-icononly-x-
|
950
|
-
--button-space-tertiary-icononly-x-
|
951
|
-
--button-space-tertiary-icononly-x-
|
958
|
+
--button-space-tertiary-icononly-x-xs: var(--global-space-micro-s); /* Left and right padding on icon-only XS size tertiary buttons */
|
959
|
+
--button-space-tertiary-icononly-x-s: var(--global-space-micro-m); /* Left and right padding on icon-only S size tertiary buttons */
|
960
|
+
--button-space-tertiary-icononly-x-m: var(--global-space-micro-xl); /* Left and right padding on icon-only M size tertiary buttons */
|
961
|
+
--button-space-tertiary-icononly-x-l: calc(var(--global-space-micro-xxl) + var(--global-space-micro-xs)); /* Left and right padding on icon-only L size tertiary buttons */
|
962
|
+
--button-space-tertiary-icononly-y-xs: var(--global-space-micro-s); /* Top and bottom padding on icon-only XS size tertiary buttons */
|
963
|
+
--button-space-tertiary-icononly-y-s: var(--global-space-micro-m); /* Top and bottom padding on icon-only S size tertiary buttons */
|
964
|
+
--button-space-tertiary-icononly-y-m: var(--global-space-micro-xl); /* Top and bottom padding on icon-only M size tertiary buttons */
|
965
|
+
--button-space-tertiary-icononly-y-l: calc(var(--global-space-micro-xxl) + var(--global-space-micro-xs)); /* Top and bottom padding on icon-only L size tertiary buttons */
|
952
966
|
--button-space-subtle-y-xs: calc((var(--global-space-macro-xxxs) / 4) - 0.5); /* top and bottom padding on XS table buttons */
|
953
967
|
--button-space-subtle-y-s: var(--global-space-micro-s); /* Bottom and top padding on small buttons. */
|
954
968
|
--button-space-subtle-y-m: var(--global-space-micro-l); /* Top and bottom padding on medium buttons */
|
@@ -961,9 +975,14 @@
|
|
961
975
|
--button-space-subtle-xg-s: var(--global-space-micro-s); /* Item spacing inside buttons */
|
962
976
|
--button-space-subtle-xg-m: var(--global-space-micro-s); /* Item spacing inside buttons */
|
963
977
|
--button-space-subtle-xg-l: var(--global-space-micro-s); /* Item spacing inside buttons */
|
964
|
-
--button-space-subtle-icononly-x-
|
965
|
-
--button-space-subtle-icononly-x-
|
966
|
-
--button-space-subtle-icononly-x-
|
978
|
+
--button-space-subtle-icononly-x-xs: var(--global-space-micro-s); /* Left and right padding on icon-only XS size subtle buttons */
|
979
|
+
--button-space-subtle-icononly-x-s: var(--global-space-micro-m); /* Left and right padding on icon-only S size subtle buttons */
|
980
|
+
--button-space-subtle-icononly-x-m: var(--global-space-micro-xl); /* Left and right padding on icon-only M size subtle buttons */
|
981
|
+
--button-space-subtle-icononly-x-l: calc(var(--global-space-micro-xxl) + var(--global-space-micro-xs)); /* Left and right padding on icon-only L size subtle buttons */
|
982
|
+
--button-space-subtle-icononly-y-xs: var(--global-space-micro-s); /* Top and bottom padding on icon-only XS size subtle buttons */
|
983
|
+
--button-space-subtle-icononly-y-s: var(--global-space-micro-m); /* Top and bottom padding on icon-only S size subtle buttons */
|
984
|
+
--button-space-subtle-icononly-y-m: var(--global-space-micro-xl); /* Top and bottom padding on icon-only M size subtle buttons */
|
985
|
+
--button-space-subtle-icononly-y-l: calc(var(--global-space-micro-xxl) + var(--global-space-micro-xs)); /* Top and bottom padding on icon-only L size subtle buttons */
|
967
986
|
--button-space-toggle-button-x-xs: var(--global-space-macro-xxxs); /* Left and right padding on XS asset used within S toggle group */
|
968
987
|
--button-space-toggle-button-x-s: var(--global-space-macro-xxs); /* Left and right padding on S toggle buttons */
|
969
988
|
--button-space-toggle-button-x-m: var(--global-space-macro-xs); /* Left and right padding on medium toggle buttons */
|
@@ -1429,6 +1448,9 @@
|
|
1429
1448
|
--focus-borderwidth-outer: var(--global-borderwidth-l); /* Focus border (outer) */
|
1430
1449
|
|
1431
1450
|
/* form component tokens */
|
1451
|
+
--form-space-datepicker-pr-s: 0; /* right padding on small date picker input */
|
1452
|
+
--form-space-datepicker-pr-m: 0; /* right padding on medium date picker input */
|
1453
|
+
--form-space-datepicker-pr-l: 0; /* right padding on large date picker input */
|
1432
1454
|
--form-color-switch-border-active: transparent;
|
1433
1455
|
--form-color-switch-border-activedisabled: transparent;
|
1434
1456
|
--form-radius-none: var(--global-radius-none); /* Text editor (internal corners) */
|
@@ -1475,9 +1497,6 @@
|
|
1475
1497
|
--form-space-checkradio-y-s: calc(var(--global-space-micro-m) / 2); /* Space above single checkbox/radio OR label to vertically centre checkbox and label. */
|
1476
1498
|
--form-space-checkradio-y-m: var(--global-space-micro-xs); /* Space above single checkbox/radio OR label to vertically centre checkbox and label. */
|
1477
1499
|
--form-space-checkradio-y-l: calc(var(--global-space-micro-xs) * 2); /* Space above single checkbox/radio OR label to vertically centre checkbox and label. */
|
1478
|
-
--form-space-datepicker-pr-s: var(--global-space-micro-xs); /* right padding on small date picker input */
|
1479
|
-
--form-space-datepicker-pr-m: var(--global-space-micro-m); /* right padding on medium date picker input */
|
1480
|
-
--form-space-datepicker-pr-l: var(--global-space-micro-xl); /* right padding on large date picker input */
|
1481
1500
|
--form-space-dropdown-button-x-s: var(--global-space-macro-s); /* DD only, left right padding on footer button. */
|
1482
1501
|
--form-space-dropdown-button-x-m: var(--global-space-macro-s); /* DD only, left right padding on footer button. */
|
1483
1502
|
--form-space-dropdown-button-x-l: var(--global-space-macro-s); /* DD only, left right padding on footer button. */
|
@@ -1508,6 +1527,9 @@
|
|
1508
1527
|
--form-space-dropdown-pill-xg-s: var(--global-space-micro-s); /* space between pills inside pill wrapper */
|
1509
1528
|
--form-space-dropdown-pill-xg-m: var(--global-space-micro-s); /* space between pills inside pill wrapper */
|
1510
1529
|
--form-space-dropdown-pill-xg-l: var(--global-space-micro-s); /* space between pills inside pill wrapper */
|
1530
|
+
--form-space-dropdown-trigger-subtle-s: var(--global-space-micro-s); /* Left and right padding on subtle dropdown triggers. */
|
1531
|
+
--form-space-dropdown-trigger-subtle-m: var(--global-space-micro-s); /* Left and right padding on subtle dropdown triggers. */
|
1532
|
+
--form-space-dropdown-trigger-subtle-l: var(--global-space-micro-s); /* Left and right padding on subtle dropdown triggers. */
|
1511
1533
|
--form-space-fileinput-status-xl-m: var(--global-space-macro-ml); /* Left padding in File input (no-thumbnail variant), status text. */
|
1512
1534
|
--form-space-fileinput-status-y-m: var(--global-space-micro-s); /* Vertical padding in status text. */
|
1513
1535
|
--form-space-fileinput-thumbnail-m: var(--global-space-micro-s); /* All padding in File input (thumbnail container). */
|
@@ -2556,8 +2578,8 @@
|
|
2556
2578
|
--global-typography-component-placeholdertext-xl: 500 40px/1.5 Sage UI;
|
2557
2579
|
--global-typography-component-placeholdertext-xxl: 500 52px/1.5 Sage UI;
|
2558
2580
|
--global-typography-component-notification-m: 500 12px/1 Sage UI; /* used for badge text - notifications on buttons and in global nav */
|
2559
|
-
--global-font-size-adaptive-step-
|
2560
|
-
--global-font-size-adaptive-step-
|
2581
|
+
--global-font-size-adaptive-step-minus2: 11px;
|
2582
|
+
--global-font-size-adaptive-step-minus1: 12px;
|
2561
2583
|
--global-font-size-adaptive-step2: 18px;
|
2562
2584
|
--global-font-size-adaptive-step3: 21px;
|
2563
2585
|
--global-font-size-adaptive-step4: 24px;
|
@@ -98,6 +98,7 @@
|
|
98
98
|
--button-size-toggle-s: var(--global-size-macro-s); /* min-height on S single toggle, and on button within M toggle group */
|
99
99
|
--button-size-toggle-m: var(--global-size-macro-m); /* min-height on M single toggle, and on button within L toggle group */
|
100
100
|
--button-size-toggle-l: var(--global-size-macro-l); /* min-height on L single toggle */
|
101
|
+
--button-size-icon-s: var(--global-size-icon-s);
|
101
102
|
--button-size-icon-m: var(--global-size-icon-m);
|
102
103
|
--button-size-video-s: var(--global-size-macro-m);
|
103
104
|
--button-size-video-m: var(--global-size-macro-xxl);
|
@@ -132,9 +133,12 @@
|
|
132
133
|
--button-space-primary-y-s: var(--global-space-micro-s); /* Bottom and top padding on small buttons. */
|
133
134
|
--button-space-primary-y-m: var(--global-space-micro-l); /* Top and bottom padding on medium buttons */
|
134
135
|
--button-space-primary-y-l: calc(var(--global-space-micro-xl) - 0.5); /* Top and bottom padding on Large buttons */
|
135
|
-
--button-space-primary-icononly-x-s: var(--global-space-micro-
|
136
|
-
--button-space-primary-icononly-x-m: var(--global-space-micro-
|
137
|
-
--button-space-primary-icononly-x-l: var(--global-space-micro-
|
136
|
+
--button-space-primary-icononly-x-s: var(--global-space-micro-m); /* Left and right padding on icon-only S size primary buttons */
|
137
|
+
--button-space-primary-icononly-x-m: var(--global-space-micro-xl); /* Left and right padding on icon-only M size primary buttons */
|
138
|
+
--button-space-primary-icononly-x-l: calc(var(--global-space-micro-xxl) + var(--global-space-micro-xs)); /* Left and right padding on icon-only L size primary buttons */
|
139
|
+
--button-space-primary-icononly-y-s: var(--global-space-micro-m); /* Top and bottom padding on icon-only S size primary buttons */
|
140
|
+
--button-space-primary-icononly-y-m: var(--global-space-micro-xl); /* Top and bottom padding on icon-only M size primary buttons */
|
141
|
+
--button-space-primary-icononly-y-l: calc(var(--global-space-micro-xxl) + var(--global-space-micro-xs)); /* Top and bottom padding on icon-only L size primary buttons */
|
138
142
|
--button-space-secondary-x-xs: var(--global-space-macro-xxxs); /* Left and right padding on XS table buttons */
|
139
143
|
--button-space-secondary-x-s: var(--global-space-micro-xxl); /* Left and right padding on small buttons */
|
140
144
|
--button-space-secondary-x-m: var(--global-space-macro-xs); /* Left and right padding on medium buttons */
|
@@ -143,13 +147,18 @@
|
|
143
147
|
--button-space-secondary-y-s: var(--global-space-micro-s); /* Bottom and top padding on small buttons. */
|
144
148
|
--button-space-secondary-y-m: var(--global-space-micro-l); /* Top and bottom padding on medium buttons */
|
145
149
|
--button-space-secondary-y-l: calc(var(--global-space-micro-xl) - 0.5); /* Top and bottom padding on Large buttons */
|
150
|
+
--button-space-secondary-xg-xs: var(--global-space-micro-s); /* Item spacing inside XS buttons */
|
146
151
|
--button-space-secondary-xg-s: var(--global-space-macro-xxxs); /* Item spacing inside buttons */
|
147
152
|
--button-space-secondary-xg-m: var(--global-space-macro-xxxs); /* Item spacing inside buttons */
|
148
153
|
--button-space-secondary-xg-l: var(--global-space-macro-xxxs); /* Item spacing inside buttons */
|
149
|
-
--button-space-secondary-
|
150
|
-
--button-space-secondary-icononly-x-s: var(--global-space-micro-
|
151
|
-
--button-space-secondary-icononly-x-m: var(--global-space-micro-
|
152
|
-
--button-space-secondary-icononly-x-l: var(--global-space-micro-
|
154
|
+
--button-space-secondary-icononly-x-xs: var(--global-space-micro-s); /* Left and right padding on icon-only XS size secondary buttons */
|
155
|
+
--button-space-secondary-icononly-x-s: var(--global-space-micro-m); /* Left and right padding on icon-only S size secondary buttons */
|
156
|
+
--button-space-secondary-icononly-x-m: var(--global-space-micro-xl); /* Left and right padding on icon-only M size secondary buttons */
|
157
|
+
--button-space-secondary-icononly-x-l: calc(var(--global-space-micro-xxl) + var(--global-space-micro-xs)); /* Left and right padding on icon-only L size secondary buttons */
|
158
|
+
--button-space-secondary-icononly-y-xs: var(--global-space-micro-s); /* Top and bottom padding on icon-only XS size secondary buttons */
|
159
|
+
--button-space-secondary-icononly-y-s: var(--global-space-micro-m); /* Top and bottom padding on icon-only S size secondary buttons */
|
160
|
+
--button-space-secondary-icononly-y-m: var(--global-space-micro-xl); /* Top and bottom padding on icon-only M size secondary buttons */
|
161
|
+
--button-space-secondary-icononly-y-l: calc(var(--global-space-micro-xxl) + var(--global-space-micro-xs)); /* Top and bottom padding on icon-only L size secondary buttons */
|
153
162
|
--button-space-tertiary-y-xs: calc((var(--global-space-macro-xxxs) / 4) - 0.5); /* top and bottom padding on XS table buttons */
|
154
163
|
--button-space-tertiary-y-s: var(--global-space-micro-s); /* Bottom and top padding on small buttons. */
|
155
164
|
--button-space-tertiary-y-m: var(--global-space-micro-l); /* Top and bottom padding on medium buttons */
|
@@ -162,9 +171,14 @@
|
|
162
171
|
--button-space-tertiary-xg-s: var(--global-space-macro-xxxs); /* Item spacing inside buttons */
|
163
172
|
--button-space-tertiary-xg-m: var(--global-space-macro-xxxs); /* Item spacing inside buttons */
|
164
173
|
--button-space-tertiary-xg-l: var(--global-space-macro-xxxs); /* Item spacing inside buttons */
|
165
|
-
--button-space-tertiary-icononly-x-
|
166
|
-
--button-space-tertiary-icononly-x-
|
167
|
-
--button-space-tertiary-icononly-x-
|
174
|
+
--button-space-tertiary-icononly-x-xs: var(--global-space-micro-s); /* Left and right padding on icon-only XS size tertiary buttons */
|
175
|
+
--button-space-tertiary-icononly-x-s: var(--global-space-micro-m); /* Left and right padding on icon-only S size tertiary buttons */
|
176
|
+
--button-space-tertiary-icononly-x-m: var(--global-space-micro-xl); /* Left and right padding on icon-only M size tertiary buttons */
|
177
|
+
--button-space-tertiary-icononly-x-l: calc(var(--global-space-micro-xxl) + var(--global-space-micro-xs)); /* Left and right padding on icon-only L size tertiary buttons */
|
178
|
+
--button-space-tertiary-icononly-y-xs: var(--global-space-micro-s); /* Top and bottom padding on icon-only XS size tertiary buttons */
|
179
|
+
--button-space-tertiary-icononly-y-s: var(--global-space-micro-m); /* Top and bottom padding on icon-only S size tertiary buttons */
|
180
|
+
--button-space-tertiary-icononly-y-m: var(--global-space-micro-xl); /* Top and bottom padding on icon-only M size tertiary buttons */
|
181
|
+
--button-space-tertiary-icononly-y-l: calc(var(--global-space-micro-xxl) + var(--global-space-micro-xs)); /* Top and bottom padding on icon-only L size tertiary buttons */
|
168
182
|
--button-space-subtle-y-xs: calc((var(--global-space-macro-xxxs) / 4) - 0.5); /* top and bottom padding on XS table buttons */
|
169
183
|
--button-space-subtle-y-s: var(--global-space-micro-s); /* Bottom and top padding on small buttons. */
|
170
184
|
--button-space-subtle-y-m: var(--global-space-micro-l); /* Top and bottom padding on medium buttons */
|
@@ -177,9 +191,14 @@
|
|
177
191
|
--button-space-subtle-xg-s: var(--global-space-micro-s); /* Item spacing inside buttons */
|
178
192
|
--button-space-subtle-xg-m: var(--global-space-micro-s); /* Item spacing inside buttons */
|
179
193
|
--button-space-subtle-xg-l: var(--global-space-micro-s); /* Item spacing inside buttons */
|
180
|
-
--button-space-subtle-icononly-x-
|
181
|
-
--button-space-subtle-icononly-x-
|
182
|
-
--button-space-subtle-icononly-x-
|
194
|
+
--button-space-subtle-icononly-x-xs: var(--global-space-micro-s); /* Left and right padding on icon-only XS size subtle buttons */
|
195
|
+
--button-space-subtle-icononly-x-s: var(--global-space-micro-m); /* Left and right padding on icon-only S size subtle buttons */
|
196
|
+
--button-space-subtle-icononly-x-m: var(--global-space-micro-xl); /* Left and right padding on icon-only M size subtle buttons */
|
197
|
+
--button-space-subtle-icononly-x-l: calc(var(--global-space-micro-xxl) + var(--global-space-micro-xs)); /* Left and right padding on icon-only L size subtle buttons */
|
198
|
+
--button-space-subtle-icononly-y-xs: var(--global-space-micro-s); /* Top and bottom padding on icon-only XS size subtle buttons */
|
199
|
+
--button-space-subtle-icononly-y-s: var(--global-space-micro-m); /* Top and bottom padding on icon-only S size subtle buttons */
|
200
|
+
--button-space-subtle-icononly-y-m: var(--global-space-micro-xl); /* Top and bottom padding on icon-only M size subtle buttons */
|
201
|
+
--button-space-subtle-icononly-y-l: calc(var(--global-space-micro-xxl) + var(--global-space-micro-xs)); /* Top and bottom padding on icon-only L size subtle buttons */
|
183
202
|
--button-space-toggle-button-x-xs: var(--global-space-macro-xxxs); /* Left and right padding on XS asset used within S toggle group */
|
184
203
|
--button-space-toggle-button-x-s: var(--global-space-macro-xxs); /* Left and right padding on S toggle buttons */
|
185
204
|
--button-space-toggle-button-x-m: var(--global-space-macro-xs); /* Left and right padding on medium toggle buttons */
|
@@ -3,6 +3,9 @@
|
|
3
3
|
*/
|
4
4
|
|
5
5
|
:root {
|
6
|
+
--form-space-datepicker-pr-s: 0; /* right padding on small date picker input */
|
7
|
+
--form-space-datepicker-pr-m: 0; /* right padding on medium date picker input */
|
8
|
+
--form-space-datepicker-pr-l: 0; /* right padding on large date picker input */
|
6
9
|
--form-color-switch-border-active: transparent;
|
7
10
|
--form-color-switch-border-activedisabled: transparent;
|
8
11
|
--form-radius-none: var(--global-radius-none); /* Text editor (internal corners) */
|
@@ -55,9 +58,6 @@
|
|
55
58
|
--form-space-checkradio-y-s: calc(var(--global-space-micro-m) / 2); /* Space above single checkbox/radio OR label to vertically centre checkbox and label. */
|
56
59
|
--form-space-checkradio-y-m: var(--global-space-micro-xs); /* Space above single checkbox/radio OR label to vertically centre checkbox and label. */
|
57
60
|
--form-space-checkradio-y-l: calc(var(--global-space-micro-xs) * 2); /* Space above single checkbox/radio OR label to vertically centre checkbox and label. */
|
58
|
-
--form-space-datepicker-pr-s: var(--global-space-micro-xs); /* right padding on small date picker input */
|
59
|
-
--form-space-datepicker-pr-m: var(--global-space-micro-m); /* right padding on medium date picker input */
|
60
|
-
--form-space-datepicker-pr-l: var(--global-space-micro-xl); /* right padding on large date picker input */
|
61
61
|
--form-space-dropdown-button-x-s: var(--global-space-macro-s); /* DD only, left right padding on footer button. */
|
62
62
|
--form-space-dropdown-button-x-m: var(--global-space-macro-s); /* DD only, left right padding on footer button. */
|
63
63
|
--form-space-dropdown-button-x-l: var(--global-space-macro-s); /* DD only, left right padding on footer button. */
|
@@ -88,6 +88,9 @@
|
|
88
88
|
--form-space-dropdown-pill-xg-s: var(--global-space-micro-s); /* space between pills inside pill wrapper */
|
89
89
|
--form-space-dropdown-pill-xg-m: var(--global-space-micro-s); /* space between pills inside pill wrapper */
|
90
90
|
--form-space-dropdown-pill-xg-l: var(--global-space-micro-s); /* space between pills inside pill wrapper */
|
91
|
+
--form-space-dropdown-trigger-subtle-s: var(--global-space-micro-s); /* Left and right padding on subtle dropdown triggers. */
|
92
|
+
--form-space-dropdown-trigger-subtle-m: var(--global-space-micro-s); /* Left and right padding on subtle dropdown triggers. */
|
93
|
+
--form-space-dropdown-trigger-subtle-l: var(--global-space-micro-s); /* Left and right padding on subtle dropdown triggers. */
|
91
94
|
--form-space-fileinput-status-xl-m: var(--global-space-macro-ml); /* Left padding in File input (no-thumbnail variant), status text. */
|
92
95
|
--form-space-fileinput-status-y-m: var(--global-space-micro-s); /* Vertical padding in status text. */
|
93
96
|
--form-space-fileinput-thumbnail-m: var(--global-space-micro-s); /* All padding in File input (thumbnail container). */
|
@@ -169,8 +169,8 @@
|
|
169
169
|
--global-typography-adaptive-component-placeholdertext-xl: 500 40px/1.5 Sage UI;
|
170
170
|
--global-typography-adaptive-component-placeholdertext-xxl: 500 52px/1.5 Sage UI;
|
171
171
|
--global-typography-adaptive-component-notification-m: 500 12px/1 Sage UI; /* used for badge text - notifications on buttons and in global nav */
|
172
|
-
--global-font-size-adaptive-step-
|
173
|
-
--global-font-size-adaptive-step-
|
172
|
+
--global-font-size-adaptive-step-minus2: 11px;
|
173
|
+
--global-font-size-adaptive-step-minus1: 12px;
|
174
174
|
--global-font-size-adaptive-step0: 14px;
|
175
175
|
--global-font-size-adaptive-step1: 16px;
|
176
176
|
--global-font-size-adaptive-step2: 18px;
|
@@ -98,6 +98,7 @@
|
|
98
98
|
--button-size-toggle-s: var(--global-size-macro-s); /* min-height on S single toggle, and on button within M toggle group */
|
99
99
|
--button-size-toggle-m: var(--global-size-macro-m); /* min-height on M single toggle, and on button within L toggle group */
|
100
100
|
--button-size-toggle-l: var(--global-size-macro-l); /* min-height on L single toggle */
|
101
|
+
--button-size-icon-s: var(--global-size-icon-s);
|
101
102
|
--button-size-icon-m: var(--global-size-icon-m);
|
102
103
|
--button-size-video-s: var(--global-size-macro-m);
|
103
104
|
--button-size-video-m: var(--global-size-macro-xxl);
|
@@ -132,9 +133,12 @@
|
|
132
133
|
--button-space-primary-y-s: var(--global-space-micro-s); /* Bottom and top padding on small buttons. */
|
133
134
|
--button-space-primary-y-m: var(--global-space-micro-l); /* Top and bottom padding on medium buttons */
|
134
135
|
--button-space-primary-y-l: calc(var(--global-space-micro-xl) - 0.5); /* Top and bottom padding on Large buttons */
|
135
|
-
--button-space-primary-icononly-x-s: var(--global-space-micro-
|
136
|
-
--button-space-primary-icononly-x-m: var(--global-space-micro-
|
137
|
-
--button-space-primary-icononly-x-l: var(--global-space-micro-
|
136
|
+
--button-space-primary-icononly-x-s: var(--global-space-micro-m); /* Left and right padding on icon-only S size primary buttons */
|
137
|
+
--button-space-primary-icononly-x-m: var(--global-space-micro-xl); /* Left and right padding on icon-only M size primary buttons */
|
138
|
+
--button-space-primary-icononly-x-l: calc(var(--global-space-micro-xxl) + var(--global-space-micro-xs)); /* Left and right padding on icon-only L size primary buttons */
|
139
|
+
--button-space-primary-icononly-y-s: var(--global-space-micro-m); /* Top and bottom padding on icon-only S size primary buttons */
|
140
|
+
--button-space-primary-icononly-y-m: var(--global-space-micro-xl); /* Top and bottom padding on icon-only M size primary buttons */
|
141
|
+
--button-space-primary-icononly-y-l: calc(var(--global-space-micro-xxl) + var(--global-space-micro-xs)); /* Top and bottom padding on icon-only L size primary buttons */
|
138
142
|
--button-space-secondary-x-xs: var(--global-space-macro-xxxs); /* Left and right padding on XS table buttons */
|
139
143
|
--button-space-secondary-x-s: var(--global-space-micro-xxl); /* Left and right padding on small buttons */
|
140
144
|
--button-space-secondary-x-m: var(--global-space-macro-xs); /* Left and right padding on medium buttons */
|
@@ -143,13 +147,18 @@
|
|
143
147
|
--button-space-secondary-y-s: var(--global-space-micro-s); /* Bottom and top padding on small buttons. */
|
144
148
|
--button-space-secondary-y-m: var(--global-space-micro-l); /* Top and bottom padding on medium buttons */
|
145
149
|
--button-space-secondary-y-l: calc(var(--global-space-micro-xl) - 0.5); /* Top and bottom padding on Large buttons */
|
150
|
+
--button-space-secondary-xg-xs: var(--global-space-micro-s); /* Item spacing inside XS buttons */
|
146
151
|
--button-space-secondary-xg-s: var(--global-space-macro-xxxs); /* Item spacing inside buttons */
|
147
152
|
--button-space-secondary-xg-m: var(--global-space-macro-xxxs); /* Item spacing inside buttons */
|
148
153
|
--button-space-secondary-xg-l: var(--global-space-macro-xxxs); /* Item spacing inside buttons */
|
149
|
-
--button-space-secondary-
|
150
|
-
--button-space-secondary-icononly-x-s: var(--global-space-micro-
|
151
|
-
--button-space-secondary-icononly-x-m: var(--global-space-micro-
|
152
|
-
--button-space-secondary-icononly-x-l: var(--global-space-micro-
|
154
|
+
--button-space-secondary-icononly-x-xs: var(--global-space-micro-s); /* Left and right padding on icon-only XS size secondary buttons */
|
155
|
+
--button-space-secondary-icononly-x-s: var(--global-space-micro-m); /* Left and right padding on icon-only S size secondary buttons */
|
156
|
+
--button-space-secondary-icononly-x-m: var(--global-space-micro-xl); /* Left and right padding on icon-only M size secondary buttons */
|
157
|
+
--button-space-secondary-icononly-x-l: calc(var(--global-space-micro-xxl) + var(--global-space-micro-xs)); /* Left and right padding on icon-only L size secondary buttons */
|
158
|
+
--button-space-secondary-icononly-y-xs: var(--global-space-micro-s); /* Top and bottom padding on icon-only XS size secondary buttons */
|
159
|
+
--button-space-secondary-icononly-y-s: var(--global-space-micro-m); /* Top and bottom padding on icon-only S size secondary buttons */
|
160
|
+
--button-space-secondary-icononly-y-m: var(--global-space-micro-xl); /* Top and bottom padding on icon-only M size secondary buttons */
|
161
|
+
--button-space-secondary-icononly-y-l: calc(var(--global-space-micro-xxl) + var(--global-space-micro-xs)); /* Top and bottom padding on icon-only L size secondary buttons */
|
153
162
|
--button-space-tertiary-y-xs: calc((var(--global-space-macro-xxxs) / 4) - 0.5); /* top and bottom padding on XS table buttons */
|
154
163
|
--button-space-tertiary-y-s: var(--global-space-micro-s); /* Bottom and top padding on small buttons. */
|
155
164
|
--button-space-tertiary-y-m: var(--global-space-micro-l); /* Top and bottom padding on medium buttons */
|
@@ -162,9 +171,14 @@
|
|
162
171
|
--button-space-tertiary-xg-s: var(--global-space-macro-xxxs); /* Item spacing inside buttons */
|
163
172
|
--button-space-tertiary-xg-m: var(--global-space-macro-xxxs); /* Item spacing inside buttons */
|
164
173
|
--button-space-tertiary-xg-l: var(--global-space-macro-xxxs); /* Item spacing inside buttons */
|
165
|
-
--button-space-tertiary-icononly-x-
|
166
|
-
--button-space-tertiary-icononly-x-
|
167
|
-
--button-space-tertiary-icononly-x-
|
174
|
+
--button-space-tertiary-icononly-x-xs: var(--global-space-micro-s); /* Left and right padding on icon-only XS size tertiary buttons */
|
175
|
+
--button-space-tertiary-icononly-x-s: var(--global-space-micro-m); /* Left and right padding on icon-only S size tertiary buttons */
|
176
|
+
--button-space-tertiary-icononly-x-m: var(--global-space-micro-xl); /* Left and right padding on icon-only M size tertiary buttons */
|
177
|
+
--button-space-tertiary-icononly-x-l: calc(var(--global-space-micro-xxl) + var(--global-space-micro-xs)); /* Left and right padding on icon-only L size tertiary buttons */
|
178
|
+
--button-space-tertiary-icononly-y-xs: var(--global-space-micro-s); /* Top and bottom padding on icon-only XS size tertiary buttons */
|
179
|
+
--button-space-tertiary-icononly-y-s: var(--global-space-micro-m); /* Top and bottom padding on icon-only S size tertiary buttons */
|
180
|
+
--button-space-tertiary-icononly-y-m: var(--global-space-micro-xl); /* Top and bottom padding on icon-only M size tertiary buttons */
|
181
|
+
--button-space-tertiary-icononly-y-l: calc(var(--global-space-micro-xxl) + var(--global-space-micro-xs)); /* Top and bottom padding on icon-only L size tertiary buttons */
|
168
182
|
--button-space-subtle-y-xs: calc((var(--global-space-macro-xxxs) / 4) - 0.5); /* top and bottom padding on XS table buttons */
|
169
183
|
--button-space-subtle-y-s: var(--global-space-micro-s); /* Bottom and top padding on small buttons. */
|
170
184
|
--button-space-subtle-y-m: var(--global-space-micro-l); /* Top and bottom padding on medium buttons */
|
@@ -177,9 +191,14 @@
|
|
177
191
|
--button-space-subtle-xg-s: var(--global-space-micro-s); /* Item spacing inside buttons */
|
178
192
|
--button-space-subtle-xg-m: var(--global-space-micro-s); /* Item spacing inside buttons */
|
179
193
|
--button-space-subtle-xg-l: var(--global-space-micro-s); /* Item spacing inside buttons */
|
180
|
-
--button-space-subtle-icononly-x-
|
181
|
-
--button-space-subtle-icononly-x-
|
182
|
-
--button-space-subtle-icononly-x-
|
194
|
+
--button-space-subtle-icononly-x-xs: var(--global-space-micro-s); /* Left and right padding on icon-only XS size subtle buttons */
|
195
|
+
--button-space-subtle-icononly-x-s: var(--global-space-micro-m); /* Left and right padding on icon-only S size subtle buttons */
|
196
|
+
--button-space-subtle-icononly-x-m: var(--global-space-micro-xl); /* Left and right padding on icon-only M size subtle buttons */
|
197
|
+
--button-space-subtle-icononly-x-l: calc(var(--global-space-micro-xxl) + var(--global-space-micro-xs)); /* Left and right padding on icon-only L size subtle buttons */
|
198
|
+
--button-space-subtle-icononly-y-xs: var(--global-space-micro-s); /* Top and bottom padding on icon-only XS size subtle buttons */
|
199
|
+
--button-space-subtle-icononly-y-s: var(--global-space-micro-m); /* Top and bottom padding on icon-only S size subtle buttons */
|
200
|
+
--button-space-subtle-icononly-y-m: var(--global-space-micro-xl); /* Top and bottom padding on icon-only M size subtle buttons */
|
201
|
+
--button-space-subtle-icononly-y-l: calc(var(--global-space-micro-xxl) + var(--global-space-micro-xs)); /* Top and bottom padding on icon-only L size subtle buttons */
|
183
202
|
--button-space-toggle-button-x-xs: var(--global-space-macro-xxxs); /* Left and right padding on XS asset used within S toggle group */
|
184
203
|
--button-space-toggle-button-x-s: var(--global-space-macro-xxs); /* Left and right padding on S toggle buttons */
|
185
204
|
--button-space-toggle-button-x-m: var(--global-space-macro-xs); /* Left and right padding on medium toggle buttons */
|
@@ -3,6 +3,9 @@
|
|
3
3
|
*/
|
4
4
|
|
5
5
|
:root {
|
6
|
+
--form-space-datepicker-pr-s: 0; /* right padding on small date picker input */
|
7
|
+
--form-space-datepicker-pr-m: 0; /* right padding on medium date picker input */
|
8
|
+
--form-space-datepicker-pr-l: 0; /* right padding on large date picker input */
|
6
9
|
--form-color-switch-border-active: transparent;
|
7
10
|
--form-color-switch-border-activedisabled: transparent;
|
8
11
|
--form-radius-none: var(--global-radius-none); /* Text editor (internal corners) */
|
@@ -55,9 +58,6 @@
|
|
55
58
|
--form-space-checkradio-y-s: calc(var(--global-space-micro-m) / 2); /* Space above single checkbox/radio OR label to vertically centre checkbox and label. */
|
56
59
|
--form-space-checkradio-y-m: var(--global-space-micro-xs); /* Space above single checkbox/radio OR label to vertically centre checkbox and label. */
|
57
60
|
--form-space-checkradio-y-l: calc(var(--global-space-micro-xs) * 2); /* Space above single checkbox/radio OR label to vertically centre checkbox and label. */
|
58
|
-
--form-space-datepicker-pr-s: var(--global-space-micro-xs); /* right padding on small date picker input */
|
59
|
-
--form-space-datepicker-pr-m: var(--global-space-micro-m); /* right padding on medium date picker input */
|
60
|
-
--form-space-datepicker-pr-l: var(--global-space-micro-xl); /* right padding on large date picker input */
|
61
61
|
--form-space-dropdown-button-x-s: var(--global-space-macro-s); /* DD only, left right padding on footer button. */
|
62
62
|
--form-space-dropdown-button-x-m: var(--global-space-macro-s); /* DD only, left right padding on footer button. */
|
63
63
|
--form-space-dropdown-button-x-l: var(--global-space-macro-s); /* DD only, left right padding on footer button. */
|
@@ -88,6 +88,9 @@
|
|
88
88
|
--form-space-dropdown-pill-xg-s: var(--global-space-micro-s); /* space between pills inside pill wrapper */
|
89
89
|
--form-space-dropdown-pill-xg-m: var(--global-space-micro-s); /* space between pills inside pill wrapper */
|
90
90
|
--form-space-dropdown-pill-xg-l: var(--global-space-micro-s); /* space between pills inside pill wrapper */
|
91
|
+
--form-space-dropdown-trigger-subtle-s: var(--global-space-micro-s); /* Left and right padding on subtle dropdown triggers. */
|
92
|
+
--form-space-dropdown-trigger-subtle-m: var(--global-space-micro-s); /* Left and right padding on subtle dropdown triggers. */
|
93
|
+
--form-space-dropdown-trigger-subtle-l: var(--global-space-micro-s); /* Left and right padding on subtle dropdown triggers. */
|
91
94
|
--form-space-fileinput-status-xl-m: var(--global-space-macro-ml); /* Left padding in File input (no-thumbnail variant), status text. */
|
92
95
|
--form-space-fileinput-status-y-m: var(--global-space-micro-s); /* Vertical padding in status text. */
|
93
96
|
--form-space-fileinput-thumbnail-m: var(--global-space-micro-s); /* All padding in File input (thumbnail container). */
|
@@ -169,8 +169,8 @@
|
|
169
169
|
--global-typography-adaptive-component-placeholdertext-xl: 500 30px/1.5 Sage UI;
|
170
170
|
--global-typography-adaptive-component-placeholdertext-xxl: 500 36px/1.5 Sage UI;
|
171
171
|
--global-typography-adaptive-component-notification-m: 500 13px/1 Sage UI; /* used for badge text - notifications on buttons and in global nav */
|
172
|
-
--global-font-size-adaptive-step-
|
173
|
-
--global-font-size-adaptive-step-
|
172
|
+
--global-font-size-adaptive-step-minus2: 12px;
|
173
|
+
--global-font-size-adaptive-step-minus1: 13px;
|
174
174
|
--global-font-size-adaptive-step0: 14px;
|
175
175
|
--global-font-size-adaptive-step1: 16px;
|
176
176
|
--global-font-size-adaptive-step2: 17px;
|
package/css/marketing/all.css
CHANGED
@@ -133,8 +133,8 @@
|
|
133
133
|
--global-typography-component-placeholdertext-xl: 500 clamp(1.8756rem, 1.6688rem + 1.034vw, 2.496rem)/1.5 Sage UI;
|
134
134
|
--global-typography-component-placeholdertext-xxl: 500 clamp(2.2695rem, 1.9448rem + 1.6238vw, 3.2438rem)/1.5 Sage UI;
|
135
135
|
--global-typography-component-notification-m: 500 clamp(0.7675rem, 0.8048rem + -0.0465vw, 0.7955rem)/1 Sage UI; /* used for badge text - notifications on buttons and in global nav */
|
136
|
-
--global-font-size-adaptive-step-
|
137
|
-
--global-font-size-adaptive-step-
|
136
|
+
--global-font-size-adaptive-step-minus2: 12px;
|
137
|
+
--global-font-size-adaptive-step-minus1: 13px;
|
138
138
|
--global-font-size-adaptive-step0: 14px;
|
139
139
|
--global-font-size-adaptive-step1: 16px;
|
140
140
|
--global-font-size-adaptive-step2: 17px;
|
@@ -882,6 +882,7 @@
|
|
882
882
|
--button-size-toggle-s: var(--global-size-macro-s); /* min-height on S single toggle, and on button within M toggle group */
|
883
883
|
--button-size-toggle-m: var(--global-size-macro-m); /* min-height on M single toggle, and on button within L toggle group */
|
884
884
|
--button-size-toggle-l: var(--global-size-macro-l); /* min-height on L single toggle */
|
885
|
+
--button-size-icon-s: var(--global-size-icon-s);
|
885
886
|
--button-size-icon-m: var(--global-size-icon-m);
|
886
887
|
--button-size-video-s: var(--global-size-macro-m);
|
887
888
|
--button-size-video-m: var(--global-size-macro-xxl);
|
@@ -916,9 +917,12 @@
|
|
916
917
|
--button-space-primary-y-s: var(--global-space-micro-s); /* Bottom and top padding on small buttons. */
|
917
918
|
--button-space-primary-y-m: var(--global-space-micro-l); /* Top and bottom padding on medium buttons */
|
918
919
|
--button-space-primary-y-l: calc(var(--global-space-micro-xl) - 0.5); /* Top and bottom padding on Large buttons */
|
919
|
-
--button-space-primary-icononly-x-s: var(--global-space-micro-
|
920
|
-
--button-space-primary-icononly-x-m: var(--global-space-micro-
|
921
|
-
--button-space-primary-icononly-x-l: var(--global-space-micro-
|
920
|
+
--button-space-primary-icononly-x-s: var(--global-space-micro-m); /* Left and right padding on icon-only S size primary buttons */
|
921
|
+
--button-space-primary-icononly-x-m: var(--global-space-micro-xl); /* Left and right padding on icon-only M size primary buttons */
|
922
|
+
--button-space-primary-icononly-x-l: calc(var(--global-space-micro-xxl) + var(--global-space-micro-xs)); /* Left and right padding on icon-only L size primary buttons */
|
923
|
+
--button-space-primary-icononly-y-s: var(--global-space-micro-m); /* Top and bottom padding on icon-only S size primary buttons */
|
924
|
+
--button-space-primary-icononly-y-m: var(--global-space-micro-xl); /* Top and bottom padding on icon-only M size primary buttons */
|
925
|
+
--button-space-primary-icononly-y-l: calc(var(--global-space-micro-xxl) + var(--global-space-micro-xs)); /* Top and bottom padding on icon-only L size primary buttons */
|
922
926
|
--button-space-secondary-x-xs: var(--global-space-macro-xxxs); /* Left and right padding on XS table buttons */
|
923
927
|
--button-space-secondary-x-s: var(--global-space-micro-xxl); /* Left and right padding on small buttons */
|
924
928
|
--button-space-secondary-x-m: var(--global-space-macro-xs); /* Left and right padding on medium buttons */
|
@@ -927,13 +931,18 @@
|
|
927
931
|
--button-space-secondary-y-s: var(--global-space-micro-s); /* Bottom and top padding on small buttons. */
|
928
932
|
--button-space-secondary-y-m: var(--global-space-micro-l); /* Top and bottom padding on medium buttons */
|
929
933
|
--button-space-secondary-y-l: calc(var(--global-space-micro-xl) - 0.5); /* Top and bottom padding on Large buttons */
|
934
|
+
--button-space-secondary-xg-xs: var(--global-space-micro-s); /* Item spacing inside XS buttons */
|
930
935
|
--button-space-secondary-xg-s: var(--global-space-macro-xxxs); /* Item spacing inside buttons */
|
931
936
|
--button-space-secondary-xg-m: var(--global-space-macro-xxxs); /* Item spacing inside buttons */
|
932
937
|
--button-space-secondary-xg-l: var(--global-space-macro-xxxs); /* Item spacing inside buttons */
|
933
|
-
--button-space-secondary-
|
934
|
-
--button-space-secondary-icononly-x-s: var(--global-space-micro-
|
935
|
-
--button-space-secondary-icononly-x-m: var(--global-space-micro-
|
936
|
-
--button-space-secondary-icononly-x-l: var(--global-space-micro-
|
938
|
+
--button-space-secondary-icononly-x-xs: var(--global-space-micro-s); /* Left and right padding on icon-only XS size secondary buttons */
|
939
|
+
--button-space-secondary-icononly-x-s: var(--global-space-micro-m); /* Left and right padding on icon-only S size secondary buttons */
|
940
|
+
--button-space-secondary-icononly-x-m: var(--global-space-micro-xl); /* Left and right padding on icon-only M size secondary buttons */
|
941
|
+
--button-space-secondary-icononly-x-l: calc(var(--global-space-micro-xxl) + var(--global-space-micro-xs)); /* Left and right padding on icon-only L size secondary buttons */
|
942
|
+
--button-space-secondary-icononly-y-xs: var(--global-space-micro-s); /* Top and bottom padding on icon-only XS size secondary buttons */
|
943
|
+
--button-space-secondary-icononly-y-s: var(--global-space-micro-m); /* Top and bottom padding on icon-only S size secondary buttons */
|
944
|
+
--button-space-secondary-icononly-y-m: var(--global-space-micro-xl); /* Top and bottom padding on icon-only M size secondary buttons */
|
945
|
+
--button-space-secondary-icononly-y-l: calc(var(--global-space-micro-xxl) + var(--global-space-micro-xs)); /* Top and bottom padding on icon-only L size secondary buttons */
|
937
946
|
--button-space-tertiary-y-xs: calc((var(--global-space-macro-xxxs) / 4) - 0.5); /* top and bottom padding on XS table buttons */
|
938
947
|
--button-space-tertiary-y-s: var(--global-space-micro-s); /* Bottom and top padding on small buttons. */
|
939
948
|
--button-space-tertiary-y-m: var(--global-space-micro-l); /* Top and bottom padding on medium buttons */
|
@@ -946,9 +955,14 @@
|
|
946
955
|
--button-space-tertiary-xg-s: var(--global-space-macro-xxxs); /* Item spacing inside buttons */
|
947
956
|
--button-space-tertiary-xg-m: var(--global-space-macro-xxxs); /* Item spacing inside buttons */
|
948
957
|
--button-space-tertiary-xg-l: var(--global-space-macro-xxxs); /* Item spacing inside buttons */
|
949
|
-
--button-space-tertiary-icononly-x-
|
950
|
-
--button-space-tertiary-icononly-x-
|
951
|
-
--button-space-tertiary-icononly-x-
|
958
|
+
--button-space-tertiary-icononly-x-xs: var(--global-space-micro-s); /* Left and right padding on icon-only XS size tertiary buttons */
|
959
|
+
--button-space-tertiary-icononly-x-s: var(--global-space-micro-m); /* Left and right padding on icon-only S size tertiary buttons */
|
960
|
+
--button-space-tertiary-icononly-x-m: var(--global-space-micro-xl); /* Left and right padding on icon-only M size tertiary buttons */
|
961
|
+
--button-space-tertiary-icononly-x-l: calc(var(--global-space-micro-xxl) + var(--global-space-micro-xs)); /* Left and right padding on icon-only L size tertiary buttons */
|
962
|
+
--button-space-tertiary-icononly-y-xs: var(--global-space-micro-s); /* Top and bottom padding on icon-only XS size tertiary buttons */
|
963
|
+
--button-space-tertiary-icononly-y-s: var(--global-space-micro-m); /* Top and bottom padding on icon-only S size tertiary buttons */
|
964
|
+
--button-space-tertiary-icononly-y-m: var(--global-space-micro-xl); /* Top and bottom padding on icon-only M size tertiary buttons */
|
965
|
+
--button-space-tertiary-icononly-y-l: calc(var(--global-space-micro-xxl) + var(--global-space-micro-xs)); /* Top and bottom padding on icon-only L size tertiary buttons */
|
952
966
|
--button-space-subtle-y-xs: calc((var(--global-space-macro-xxxs) / 4) - 0.5); /* top and bottom padding on XS table buttons */
|
953
967
|
--button-space-subtle-y-s: var(--global-space-micro-s); /* Bottom and top padding on small buttons. */
|
954
968
|
--button-space-subtle-y-m: var(--global-space-micro-l); /* Top and bottom padding on medium buttons */
|
@@ -961,9 +975,14 @@
|
|
961
975
|
--button-space-subtle-xg-s: var(--global-space-micro-s); /* Item spacing inside buttons */
|
962
976
|
--button-space-subtle-xg-m: var(--global-space-micro-s); /* Item spacing inside buttons */
|
963
977
|
--button-space-subtle-xg-l: var(--global-space-micro-s); /* Item spacing inside buttons */
|
964
|
-
--button-space-subtle-icononly-x-
|
965
|
-
--button-space-subtle-icononly-x-
|
966
|
-
--button-space-subtle-icononly-x-
|
978
|
+
--button-space-subtle-icononly-x-xs: var(--global-space-micro-s); /* Left and right padding on icon-only XS size subtle buttons */
|
979
|
+
--button-space-subtle-icononly-x-s: var(--global-space-micro-m); /* Left and right padding on icon-only S size subtle buttons */
|
980
|
+
--button-space-subtle-icononly-x-m: var(--global-space-micro-xl); /* Left and right padding on icon-only M size subtle buttons */
|
981
|
+
--button-space-subtle-icononly-x-l: calc(var(--global-space-micro-xxl) + var(--global-space-micro-xs)); /* Left and right padding on icon-only L size subtle buttons */
|
982
|
+
--button-space-subtle-icononly-y-xs: var(--global-space-micro-s); /* Top and bottom padding on icon-only XS size subtle buttons */
|
983
|
+
--button-space-subtle-icononly-y-s: var(--global-space-micro-m); /* Top and bottom padding on icon-only S size subtle buttons */
|
984
|
+
--button-space-subtle-icononly-y-m: var(--global-space-micro-xl); /* Top and bottom padding on icon-only M size subtle buttons */
|
985
|
+
--button-space-subtle-icononly-y-l: calc(var(--global-space-micro-xxl) + var(--global-space-micro-xs)); /* Top and bottom padding on icon-only L size subtle buttons */
|
967
986
|
--button-space-toggle-button-x-xs: var(--global-space-macro-xxxs); /* Left and right padding on XS asset used within S toggle group */
|
968
987
|
--button-space-toggle-button-x-s: var(--global-space-macro-xxs); /* Left and right padding on S toggle buttons */
|
969
988
|
--button-space-toggle-button-x-m: var(--global-space-macro-xs); /* Left and right padding on medium toggle buttons */
|
@@ -1429,6 +1448,9 @@
|
|
1429
1448
|
--focus-borderwidth-outer: var(--global-borderwidth-l); /* Focus border (outer) */
|
1430
1449
|
|
1431
1450
|
/* form component tokens */
|
1451
|
+
--form-space-datepicker-pr-s: 0; /* right padding on small date picker input */
|
1452
|
+
--form-space-datepicker-pr-m: 0; /* right padding on medium date picker input */
|
1453
|
+
--form-space-datepicker-pr-l: 0; /* right padding on large date picker input */
|
1432
1454
|
--form-color-switch-border-active: transparent;
|
1433
1455
|
--form-color-switch-border-activedisabled: transparent;
|
1434
1456
|
--form-radius-none: var(--global-radius-none); /* Text editor (internal corners) */
|
@@ -1475,9 +1497,6 @@
|
|
1475
1497
|
--form-space-checkradio-y-s: calc(var(--global-space-micro-m) / 2); /* Space above single checkbox/radio OR label to vertically centre checkbox and label. */
|
1476
1498
|
--form-space-checkradio-y-m: var(--global-space-micro-xs); /* Space above single checkbox/radio OR label to vertically centre checkbox and label. */
|
1477
1499
|
--form-space-checkradio-y-l: calc(var(--global-space-micro-xs) * 2); /* Space above single checkbox/radio OR label to vertically centre checkbox and label. */
|
1478
|
-
--form-space-datepicker-pr-s: var(--global-space-micro-xs); /* right padding on small date picker input */
|
1479
|
-
--form-space-datepicker-pr-m: var(--global-space-micro-m); /* right padding on medium date picker input */
|
1480
|
-
--form-space-datepicker-pr-l: var(--global-space-micro-xl); /* right padding on large date picker input */
|
1481
1500
|
--form-space-dropdown-button-x-s: var(--global-space-macro-s); /* DD only, left right padding on footer button. */
|
1482
1501
|
--form-space-dropdown-button-x-m: var(--global-space-macro-s); /* DD only, left right padding on footer button. */
|
1483
1502
|
--form-space-dropdown-button-x-l: var(--global-space-macro-s); /* DD only, left right padding on footer button. */
|
@@ -1508,6 +1527,9 @@
|
|
1508
1527
|
--form-space-dropdown-pill-xg-s: var(--global-space-micro-s); /* space between pills inside pill wrapper */
|
1509
1528
|
--form-space-dropdown-pill-xg-m: var(--global-space-micro-s); /* space between pills inside pill wrapper */
|
1510
1529
|
--form-space-dropdown-pill-xg-l: var(--global-space-micro-s); /* space between pills inside pill wrapper */
|
1530
|
+
--form-space-dropdown-trigger-subtle-s: var(--global-space-micro-s); /* Left and right padding on subtle dropdown triggers. */
|
1531
|
+
--form-space-dropdown-trigger-subtle-m: var(--global-space-micro-s); /* Left and right padding on subtle dropdown triggers. */
|
1532
|
+
--form-space-dropdown-trigger-subtle-l: var(--global-space-micro-s); /* Left and right padding on subtle dropdown triggers. */
|
1511
1533
|
--form-space-fileinput-status-xl-m: var(--global-space-macro-ml); /* Left padding in File input (no-thumbnail variant), status text. */
|
1512
1534
|
--form-space-fileinput-status-y-m: var(--global-space-micro-s); /* Vertical padding in status text. */
|
1513
1535
|
--form-space-fileinput-thumbnail-m: var(--global-space-micro-s); /* All padding in File input (thumbnail container). */
|
@@ -2543,8 +2565,8 @@
|
|
2543
2565
|
--global-space-macro-l: 32px;
|
2544
2566
|
--global-space-macro-xl: 40px;
|
2545
2567
|
--global-space-macro-xxl: 48px;
|
2546
|
-
--global-font-size-adaptive-step-
|
2547
|
-
--global-font-size-adaptive-step-
|
2568
|
+
--global-font-size-adaptive-step-minus2: 11px;
|
2569
|
+
--global-font-size-adaptive-step-minus1: 12px;
|
2548
2570
|
--global-font-size-adaptive-step2: 18px;
|
2549
2571
|
--global-font-size-adaptive-step3: 21px;
|
2550
2572
|
--global-font-size-adaptive-step4: 24px;
|