@sage/design-tokens 5.2.0 → 6.0.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 +87 -77
- package/css/frozenproduct/large/components/logo.css +1 -6
- package/css/frozenproduct/large/components/status.css +67 -48
- package/css/frozenproduct/large/dark.css +12 -14
- package/css/frozenproduct/large/light.css +7 -9
- package/css/frozenproduct/small/components/logo.css +1 -6
- package/css/frozenproduct/small/components/status.css +67 -48
- package/css/frozenproduct/small/dark.css +12 -14
- package/css/frozenproduct/small/light.css +7 -9
- package/css/marketing/all.css +118 -108
- package/css/marketing/large/components/logo.css +1 -6
- package/css/marketing/large/components/status.css +67 -48
- package/css/marketing/large/dark.css +12 -14
- package/css/marketing/large/light.css +7 -9
- package/css/marketing/small/components/button.css +22 -22
- package/css/marketing/small/components/container.css +9 -9
- package/css/marketing/small/components/logo.css +1 -6
- package/css/marketing/small/components/status.css +67 -48
- package/css/marketing/small/dark.css +12 -14
- package/css/marketing/small/light.css +7 -9
- package/css/product/all.css +87 -77
- package/css/product/large/components/logo.css +1 -6
- package/css/product/large/components/status.css +67 -48
- package/css/product/large/dark.css +12 -14
- package/css/product/large/light.css +7 -9
- package/css/product/small/components/logo.css +1 -6
- package/css/product/small/components/status.css +67 -48
- package/css/product/small/dark.css +12 -14
- package/css/product/small/light.css +7 -9
- package/ios/frozenproduct/large/dark/components/logo.h +0 -5
- package/ios/frozenproduct/large/dark/components/status.h +67 -48
- package/ios/frozenproduct/large/dark/mode.h +12 -14
- package/ios/frozenproduct/large/light/components/logo.h +0 -5
- package/ios/frozenproduct/large/light/components/status.h +67 -48
- package/ios/frozenproduct/large/light/mode.h +7 -9
- package/ios/frozenproduct/small/dark/components/logo.h +0 -5
- package/ios/frozenproduct/small/dark/components/status.h +67 -48
- package/ios/frozenproduct/small/dark/mode.h +12 -14
- package/ios/frozenproduct/small/light/components/logo.h +0 -5
- package/ios/frozenproduct/small/light/components/status.h +67 -48
- package/ios/frozenproduct/small/light/mode.h +7 -9
- package/ios/marketing/large/dark/components/logo.h +0 -5
- package/ios/marketing/large/dark/components/status.h +67 -48
- package/ios/marketing/large/dark/mode.h +12 -14
- package/ios/marketing/large/light/components/logo.h +0 -5
- package/ios/marketing/large/light/components/status.h +67 -48
- package/ios/marketing/large/light/mode.h +7 -9
- package/ios/marketing/small/dark/components/logo.h +0 -5
- package/ios/marketing/small/dark/components/status.h +67 -48
- package/ios/marketing/small/dark/mode.h +12 -14
- package/ios/marketing/small/light/components/logo.h +0 -5
- package/ios/marketing/small/light/components/status.h +67 -48
- package/ios/marketing/small/light/mode.h +7 -9
- package/ios/product/large/dark/components/logo.h +0 -5
- package/ios/product/large/dark/components/status.h +67 -48
- package/ios/product/large/dark/mode.h +12 -14
- package/ios/product/large/light/components/logo.h +0 -5
- package/ios/product/large/light/components/status.h +67 -48
- package/ios/product/large/light/mode.h +7 -9
- package/ios/product/small/dark/components/logo.h +0 -5
- package/ios/product/small/dark/components/status.h +67 -48
- package/ios/product/small/dark/mode.h +12 -14
- package/ios/product/small/light/components/logo.h +0 -5
- package/ios/product/small/light/components/status.h +67 -48
- package/ios/product/small/light/mode.h +7 -9
- package/js/common/frozenproduct/large/dark/components/logo.d.ts +0 -7
- package/js/common/frozenproduct/large/dark/components/logo.js +1 -70
- package/js/common/frozenproduct/large/dark/components/status.d.ts +103 -60
- package/js/common/frozenproduct/large/dark/components/status.js +1534 -892
- package/js/common/frozenproduct/large/dark/mode.d.ts +16 -20
- package/js/common/frozenproduct/large/dark/mode.js +410 -193
- package/js/common/frozenproduct/large/light/components/logo.d.ts +0 -7
- package/js/common/frozenproduct/large/light/components/logo.js +1 -70
- package/js/common/frozenproduct/large/light/components/status.d.ts +103 -60
- package/js/common/frozenproduct/large/light/components/status.js +1534 -892
- package/js/common/frozenproduct/large/light/mode.d.ts +7 -11
- package/js/common/frozenproduct/large/light/mode.js +416 -99
- package/js/common/frozenproduct/small/dark/components/logo.d.ts +0 -7
- package/js/common/frozenproduct/small/dark/components/logo.js +1 -70
- package/js/common/frozenproduct/small/dark/components/status.d.ts +103 -60
- package/js/common/frozenproduct/small/dark/components/status.js +1534 -892
- package/js/common/frozenproduct/small/dark/mode.d.ts +16 -20
- package/js/common/frozenproduct/small/dark/mode.js +410 -193
- package/js/common/frozenproduct/small/light/components/logo.d.ts +0 -7
- package/js/common/frozenproduct/small/light/components/logo.js +1 -70
- package/js/common/frozenproduct/small/light/components/status.d.ts +103 -60
- package/js/common/frozenproduct/small/light/components/status.js +1534 -892
- package/js/common/frozenproduct/small/light/mode.d.ts +7 -11
- package/js/common/frozenproduct/small/light/mode.js +416 -99
- package/js/common/marketing/large/dark/components/logo.d.ts +0 -7
- package/js/common/marketing/large/dark/components/logo.js +1 -70
- package/js/common/marketing/large/dark/components/status.d.ts +103 -60
- package/js/common/marketing/large/dark/components/status.js +1534 -892
- package/js/common/marketing/large/dark/mode.d.ts +16 -20
- package/js/common/marketing/large/dark/mode.js +410 -193
- package/js/common/marketing/large/light/components/logo.d.ts +0 -7
- package/js/common/marketing/large/light/components/logo.js +1 -70
- package/js/common/marketing/large/light/components/status.d.ts +103 -60
- package/js/common/marketing/large/light/components/status.js +1534 -892
- package/js/common/marketing/large/light/mode.d.ts +7 -11
- package/js/common/marketing/large/light/mode.js +416 -99
- package/js/common/marketing/small/dark/components/logo.d.ts +0 -7
- package/js/common/marketing/small/dark/components/logo.js +1 -70
- package/js/common/marketing/small/dark/components/status.d.ts +103 -60
- package/js/common/marketing/small/dark/components/status.js +1534 -892
- package/js/common/marketing/small/dark/mode.d.ts +16 -20
- package/js/common/marketing/small/dark/mode.js +410 -193
- package/js/common/marketing/small/light/components/logo.d.ts +0 -7
- package/js/common/marketing/small/light/components/logo.js +1 -70
- package/js/common/marketing/small/light/components/status.d.ts +103 -60
- package/js/common/marketing/small/light/components/status.js +1534 -892
- package/js/common/marketing/small/light/mode.d.ts +7 -11
- package/js/common/marketing/small/light/mode.js +416 -99
- package/js/common/product/large/dark/components/logo.d.ts +0 -7
- package/js/common/product/large/dark/components/logo.js +1 -70
- package/js/common/product/large/dark/components/status.d.ts +103 -60
- package/js/common/product/large/dark/components/status.js +1534 -892
- package/js/common/product/large/dark/mode.d.ts +16 -20
- package/js/common/product/large/dark/mode.js +410 -193
- package/js/common/product/large/light/components/logo.d.ts +0 -7
- package/js/common/product/large/light/components/logo.js +1 -70
- package/js/common/product/large/light/components/status.d.ts +103 -60
- package/js/common/product/large/light/components/status.js +1534 -892
- package/js/common/product/large/light/mode.d.ts +7 -11
- package/js/common/product/large/light/mode.js +416 -99
- package/js/common/product/small/dark/components/logo.d.ts +0 -7
- package/js/common/product/small/dark/components/logo.js +1 -70
- package/js/common/product/small/dark/components/status.d.ts +103 -60
- package/js/common/product/small/dark/components/status.js +1534 -892
- package/js/common/product/small/dark/mode.d.ts +16 -20
- package/js/common/product/small/dark/mode.js +410 -193
- package/js/common/product/small/light/components/logo.d.ts +0 -7
- package/js/common/product/small/light/components/logo.js +1 -70
- package/js/common/product/small/light/components/status.d.ts +103 -60
- package/js/common/product/small/light/components/status.js +1534 -892
- package/js/common/product/small/light/mode.d.ts +7 -11
- package/js/common/product/small/light/mode.js +416 -99
- package/js/es6/frozenproduct/large/dark/components/logo.d.ts +0 -5
- package/js/es6/frozenproduct/large/dark/components/logo.js +0 -7
- package/js/es6/frozenproduct/large/dark/components/status.d.ts +84 -60
- package/js/es6/frozenproduct/large/dark/components/status.js +67 -48
- package/js/es6/frozenproduct/large/dark/mode.d.ts +17 -15
- package/js/es6/frozenproduct/large/dark/mode.js +12 -16
- package/js/es6/frozenproduct/large/light/components/logo.d.ts +0 -5
- package/js/es6/frozenproduct/large/light/components/logo.js +0 -7
- package/js/es6/frozenproduct/large/light/components/status.d.ts +84 -60
- package/js/es6/frozenproduct/large/light/components/status.js +67 -48
- package/js/es6/frozenproduct/large/light/mode.d.ts +11 -9
- package/js/es6/frozenproduct/large/light/mode.js +7 -11
- package/js/es6/frozenproduct/small/dark/components/logo.d.ts +0 -5
- package/js/es6/frozenproduct/small/dark/components/logo.js +0 -7
- package/js/es6/frozenproduct/small/dark/components/status.d.ts +84 -60
- package/js/es6/frozenproduct/small/dark/components/status.js +67 -48
- package/js/es6/frozenproduct/small/dark/mode.d.ts +17 -15
- package/js/es6/frozenproduct/small/dark/mode.js +12 -16
- package/js/es6/frozenproduct/small/light/components/logo.d.ts +0 -5
- package/js/es6/frozenproduct/small/light/components/logo.js +0 -7
- package/js/es6/frozenproduct/small/light/components/status.d.ts +84 -60
- package/js/es6/frozenproduct/small/light/components/status.js +67 -48
- package/js/es6/frozenproduct/small/light/mode.d.ts +11 -9
- package/js/es6/frozenproduct/small/light/mode.js +7 -11
- package/js/es6/marketing/large/dark/components/logo.d.ts +0 -5
- package/js/es6/marketing/large/dark/components/logo.js +0 -7
- package/js/es6/marketing/large/dark/components/status.d.ts +84 -60
- package/js/es6/marketing/large/dark/components/status.js +67 -48
- package/js/es6/marketing/large/dark/mode.d.ts +17 -15
- package/js/es6/marketing/large/dark/mode.js +12 -16
- package/js/es6/marketing/large/light/components/logo.d.ts +0 -5
- package/js/es6/marketing/large/light/components/logo.js +0 -7
- package/js/es6/marketing/large/light/components/status.d.ts +84 -60
- package/js/es6/marketing/large/light/components/status.js +67 -48
- package/js/es6/marketing/large/light/mode.d.ts +11 -9
- package/js/es6/marketing/large/light/mode.js +7 -11
- package/js/es6/marketing/small/dark/components/logo.d.ts +0 -5
- package/js/es6/marketing/small/dark/components/logo.js +0 -7
- package/js/es6/marketing/small/dark/components/status.d.ts +84 -60
- package/js/es6/marketing/small/dark/components/status.js +67 -48
- package/js/es6/marketing/small/dark/mode.d.ts +17 -15
- package/js/es6/marketing/small/dark/mode.js +12 -16
- package/js/es6/marketing/small/light/components/logo.d.ts +0 -5
- package/js/es6/marketing/small/light/components/logo.js +0 -7
- package/js/es6/marketing/small/light/components/status.d.ts +84 -60
- package/js/es6/marketing/small/light/components/status.js +67 -48
- package/js/es6/marketing/small/light/mode.d.ts +11 -9
- package/js/es6/marketing/small/light/mode.js +7 -11
- package/js/es6/product/large/dark/components/logo.d.ts +0 -5
- package/js/es6/product/large/dark/components/logo.js +0 -7
- package/js/es6/product/large/dark/components/status.d.ts +84 -60
- package/js/es6/product/large/dark/components/status.js +67 -48
- package/js/es6/product/large/dark/mode.d.ts +17 -15
- package/js/es6/product/large/dark/mode.js +12 -16
- package/js/es6/product/large/light/components/logo.d.ts +0 -5
- package/js/es6/product/large/light/components/logo.js +0 -7
- package/js/es6/product/large/light/components/status.d.ts +84 -60
- package/js/es6/product/large/light/components/status.js +67 -48
- package/js/es6/product/large/light/mode.d.ts +11 -9
- package/js/es6/product/large/light/mode.js +7 -11
- package/js/es6/product/small/dark/components/logo.d.ts +0 -5
- package/js/es6/product/small/dark/components/logo.js +0 -7
- package/js/es6/product/small/dark/components/status.d.ts +84 -60
- package/js/es6/product/small/dark/components/status.js +67 -48
- package/js/es6/product/small/dark/mode.d.ts +17 -15
- package/js/es6/product/small/dark/mode.js +12 -16
- package/js/es6/product/small/light/components/logo.d.ts +0 -5
- package/js/es6/product/small/light/components/logo.js +0 -7
- package/js/es6/product/small/light/components/status.d.ts +84 -60
- package/js/es6/product/small/light/components/status.js +67 -48
- package/js/es6/product/small/light/mode.d.ts +11 -9
- package/js/es6/product/small/light/mode.js +7 -11
- package/js/umd/frozenproduct/large/dark/components/logo.js +1 -70
- package/js/umd/frozenproduct/large/dark/components/status.js +1554 -883
- package/js/umd/frozenproduct/large/dark/mode.js +403 -193
- package/js/umd/frozenproduct/large/light/components/logo.js +1 -70
- package/js/umd/frozenproduct/large/light/components/status.js +1554 -883
- package/js/umd/frozenproduct/large/light/mode.js +409 -99
- package/js/umd/frozenproduct/small/dark/components/logo.js +1 -70
- package/js/umd/frozenproduct/small/dark/components/status.js +1554 -883
- package/js/umd/frozenproduct/small/dark/mode.js +403 -193
- package/js/umd/frozenproduct/small/light/components/logo.js +1 -70
- package/js/umd/frozenproduct/small/light/components/status.js +1554 -883
- package/js/umd/frozenproduct/small/light/mode.js +409 -99
- package/js/umd/marketing/large/dark/components/logo.js +1 -70
- package/js/umd/marketing/large/dark/components/status.js +1554 -883
- package/js/umd/marketing/large/dark/mode.js +403 -193
- package/js/umd/marketing/large/light/components/logo.js +1 -70
- package/js/umd/marketing/large/light/components/status.js +1554 -883
- package/js/umd/marketing/large/light/mode.js +409 -99
- package/js/umd/marketing/small/dark/components/logo.js +1 -70
- package/js/umd/marketing/small/dark/components/status.js +1554 -883
- package/js/umd/marketing/small/dark/mode.js +403 -193
- package/js/umd/marketing/small/light/components/logo.js +1 -70
- package/js/umd/marketing/small/light/components/status.js +1554 -883
- package/js/umd/marketing/small/light/mode.js +409 -99
- package/js/umd/product/large/dark/components/logo.js +1 -70
- package/js/umd/product/large/dark/components/status.js +1554 -883
- package/js/umd/product/large/dark/mode.js +403 -193
- package/js/umd/product/large/light/components/logo.js +1 -70
- package/js/umd/product/large/light/components/status.js +1554 -883
- package/js/umd/product/large/light/mode.js +409 -99
- package/js/umd/product/small/dark/components/logo.js +1 -70
- package/js/umd/product/small/dark/components/status.js +1554 -883
- package/js/umd/product/small/dark/mode.js +403 -193
- package/js/umd/product/small/light/components/logo.js +1 -70
- package/js/umd/product/small/light/components/status.js +1554 -883
- package/js/umd/product/small/light/mode.js +409 -99
- package/json/flat/frozenproduct/large/dark/components/logo.json +0 -5
- package/json/flat/frozenproduct/large/dark/components/status.json +67 -48
- package/json/flat/frozenproduct/large/dark/mode.json +12 -14
- package/json/flat/frozenproduct/large/light/components/logo.json +0 -5
- package/json/flat/frozenproduct/large/light/components/status.json +67 -48
- package/json/flat/frozenproduct/large/light/mode.json +7 -9
- package/json/flat/frozenproduct/small/dark/components/logo.json +0 -5
- package/json/flat/frozenproduct/small/dark/components/status.json +67 -48
- package/json/flat/frozenproduct/small/dark/mode.json +12 -14
- package/json/flat/frozenproduct/small/light/components/logo.json +0 -5
- package/json/flat/frozenproduct/small/light/components/status.json +67 -48
- package/json/flat/frozenproduct/small/light/mode.json +7 -9
- package/json/flat/marketing/large/dark/components/logo.json +0 -5
- package/json/flat/marketing/large/dark/components/status.json +67 -48
- package/json/flat/marketing/large/dark/mode.json +12 -14
- package/json/flat/marketing/large/light/components/logo.json +0 -5
- package/json/flat/marketing/large/light/components/status.json +67 -48
- package/json/flat/marketing/large/light/mode.json +7 -9
- package/json/flat/marketing/small/dark/components/logo.json +0 -5
- package/json/flat/marketing/small/dark/components/status.json +67 -48
- package/json/flat/marketing/small/dark/mode.json +12 -14
- package/json/flat/marketing/small/light/components/logo.json +0 -5
- package/json/flat/marketing/small/light/components/status.json +67 -48
- package/json/flat/marketing/small/light/mode.json +7 -9
- package/json/flat/product/large/dark/components/logo.json +0 -5
- package/json/flat/product/large/dark/components/status.json +67 -48
- package/json/flat/product/large/dark/mode.json +12 -14
- package/json/flat/product/large/light/components/logo.json +0 -5
- package/json/flat/product/large/light/components/status.json +67 -48
- package/json/flat/product/large/light/mode.json +7 -9
- package/json/flat/product/small/dark/components/logo.json +0 -5
- package/json/flat/product/small/dark/components/status.json +67 -48
- package/json/flat/product/small/dark/mode.json +12 -14
- package/json/flat/product/small/light/components/logo.json +0 -5
- package/json/flat/product/small/light/components/status.json +67 -48
- package/json/flat/product/small/light/mode.json +7 -9
- package/json/nested/frozenproduct/large/dark/components/logo.json +0 -7
- package/json/nested/frozenproduct/large/dark/components/status.json +103 -60
- package/json/nested/frozenproduct/large/dark/mode.json +18 -22
- package/json/nested/frozenproduct/large/light/components/logo.json +0 -7
- package/json/nested/frozenproduct/large/light/components/status.json +103 -60
- package/json/nested/frozenproduct/large/light/mode.json +10 -14
- package/json/nested/frozenproduct/small/dark/components/logo.json +0 -7
- package/json/nested/frozenproduct/small/dark/components/status.json +103 -60
- package/json/nested/frozenproduct/small/dark/mode.json +18 -22
- package/json/nested/frozenproduct/small/light/components/logo.json +0 -7
- package/json/nested/frozenproduct/small/light/components/status.json +103 -60
- package/json/nested/frozenproduct/small/light/mode.json +10 -14
- package/json/nested/marketing/large/dark/components/logo.json +0 -7
- package/json/nested/marketing/large/dark/components/status.json +103 -60
- package/json/nested/marketing/large/dark/mode.json +18 -22
- package/json/nested/marketing/large/light/components/logo.json +0 -7
- package/json/nested/marketing/large/light/components/status.json +103 -60
- package/json/nested/marketing/large/light/mode.json +10 -14
- package/json/nested/marketing/small/dark/components/logo.json +0 -7
- package/json/nested/marketing/small/dark/components/status.json +103 -60
- package/json/nested/marketing/small/dark/mode.json +18 -22
- package/json/nested/marketing/small/light/components/logo.json +0 -7
- package/json/nested/marketing/small/light/components/status.json +103 -60
- package/json/nested/marketing/small/light/mode.json +10 -14
- package/json/nested/product/large/dark/components/logo.json +0 -7
- package/json/nested/product/large/dark/components/status.json +103 -60
- package/json/nested/product/large/dark/mode.json +18 -22
- package/json/nested/product/large/light/components/logo.json +0 -7
- package/json/nested/product/large/light/components/status.json +103 -60
- package/json/nested/product/large/light/mode.json +10 -14
- package/json/nested/product/small/dark/components/logo.json +0 -7
- package/json/nested/product/small/dark/components/status.json +103 -60
- package/json/nested/product/small/dark/mode.json +18 -22
- package/json/nested/product/small/light/components/logo.json +0 -7
- package/json/nested/product/small/light/components/status.json +103 -60
- package/json/nested/product/small/light/mode.json +10 -14
- package/package.json +1 -1
- package/sage-design-tokens-6.0.0.tgz +0 -0
- package/scss/frozenproduct/large/components/button.scss +22 -22
- package/scss/frozenproduct/large/components/container.scss +9 -9
- package/scss/frozenproduct/large/components/form.scss +7 -7
- package/scss/frozenproduct/large/components/link.scss +2 -2
- package/scss/frozenproduct/large/components/logo.scss +1 -6
- package/scss/frozenproduct/large/components/nav.scss +3 -3
- 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 +67 -48
- package/scss/frozenproduct/large/components/tab.scss +7 -7
- package/scss/frozenproduct/large/components/table.scss +11 -11
- package/scss/frozenproduct/large/dark.scss +12 -14
- package/scss/frozenproduct/large/light.scss +7 -9
- package/scss/frozenproduct/small/components/logo.scss +1 -6
- package/scss/frozenproduct/small/components/status.scss +67 -48
- package/scss/frozenproduct/small/dark.scss +12 -14
- package/scss/frozenproduct/small/light.scss +7 -9
- package/scss/marketing/large/components/button.scss +22 -22
- package/scss/marketing/large/components/container.scss +9 -9
- package/scss/marketing/large/components/form.scss +7 -7
- package/scss/marketing/large/components/link.scss +2 -2
- package/scss/marketing/large/components/logo.scss +1 -6
- package/scss/marketing/large/components/nav.scss +3 -3
- package/scss/marketing/large/components/page.scss +1 -1
- package/scss/marketing/large/components/popover.scss +2 -2
- package/scss/marketing/large/components/progress.scss +6 -6
- package/scss/marketing/large/components/status.scss +67 -48
- package/scss/marketing/large/components/tab.scss +7 -7
- package/scss/marketing/large/components/table.scss +11 -11
- package/scss/marketing/large/dark.scss +12 -14
- package/scss/marketing/large/light.scss +7 -9
- package/scss/marketing/small/components/logo.scss +1 -6
- package/scss/marketing/small/components/status.scss +67 -48
- package/scss/marketing/small/dark.scss +12 -14
- package/scss/marketing/small/light.scss +7 -9
- package/scss/product/large/components/button.scss +22 -22
- package/scss/product/large/components/container.scss +9 -9
- package/scss/product/large/components/form.scss +7 -7
- package/scss/product/large/components/link.scss +2 -2
- package/scss/product/large/components/logo.scss +1 -6
- package/scss/product/large/components/nav.scss +3 -3
- package/scss/product/large/components/page.scss +1 -1
- package/scss/product/large/components/popover.scss +2 -2
- package/scss/product/large/components/progress.scss +6 -6
- package/scss/product/large/components/status.scss +67 -48
- package/scss/product/large/components/tab.scss +7 -7
- package/scss/product/large/components/table.scss +11 -11
- package/scss/product/large/dark.scss +12 -14
- package/scss/product/large/light.scss +7 -9
- package/scss/product/small/components/logo.scss +1 -6
- package/scss/product/small/components/status.scss +67 -48
- package/scss/product/small/dark.scss +12 -14
- package/scss/product/small/light.scss +7 -9
- package/sage-design-tokens-5.2.0.tgz +0 -0
|
@@ -11,12 +11,7 @@ $modes-color-brand-default-alt: #000000;
|
|
|
11
11
|
$modes-color-brand-with-default-alt: #FFFFFF;
|
|
12
12
|
$modes-color-brand-copilot-ai-identifier-default: #000000;
|
|
13
13
|
$modes-color-brand-copilot-ai-identifier-with-default: #00D639;
|
|
14
|
-
$modes-color-brand-copilot-no-bg-
|
|
15
|
-
$modes-color-brand-copilot-no-bg-star: #000000;
|
|
16
|
-
$modes-color-brand-copilot-no-bg-mono: #000000;
|
|
17
|
-
$modes-color-brand-copilot-with-bg-s: linear-gradient(191deg, #9D60FF 28.12%, #7C78F8 33.5%, #29B7E6 46.96%, #00D6DE 52.34%, #00D6DA 55.03%, #00D6D0 56.83%, #00D6C0 57.73%, #00D6A8 59.52%, #00D68A 60.42%, #00D665 62.21%, #00D639 63.11%);
|
|
18
|
-
$modes-color-brand-copilot-with-bg-star: radial-gradient(99.94% 104.1% at 8.01% 0.98%, #9D60FF 34%, #5A99F1 52%, #32B3E8 59%, #0DCCE0 68%, #00D6DE 72%, #00D6D7 74%, #00D6C6 77%, #00D6AA 81%, #00D682 84%, #00D650 88%, #00D639 90%);
|
|
19
|
-
$modes-color-brand-copilot-with-bg-bg: #000000;
|
|
14
|
+
$modes-color-brand-copilot-no-bg-monochrome: #000000;
|
|
20
15
|
$modes-color-custom-default: #00811F; // This is the color to replace in white label products. Ensure luminousity of custom color = 46.8 (see hsluv.org). AAA against FFFFFF bg.
|
|
21
16
|
$modes-color-custom-frozen: #008046; // This is a derivative of Jade, and is the color to replace in white label products that use the FROZEN theme. Ensure luminousity of custom color = 46.8 (see hsluv.org). AAA against FFFFFF bg.
|
|
22
17
|
$modes-color-generic-bg-nought: #FFFFFF;
|
|
@@ -129,7 +124,8 @@ $modes-color-status-caution-default-alt: #ffede5; // Subtle message bg
|
|
|
129
124
|
$modes-color-status-caution-hover: #b13a0d; // used on pill hover states
|
|
130
125
|
$modes-color-status-caution-hover-alt: #f1e0d8; // used on pill hover states and message bg
|
|
131
126
|
$modes-color-status-caution-text: #bf3e0c;
|
|
132
|
-
$modes-color-status-caution-
|
|
127
|
+
$modes-color-status-caution-frozenglobal-default: #ff8629; // used on global message bg
|
|
128
|
+
$modes-color-status-caution-frozenglobal-hover: #ff9a4e; // used on global message bg
|
|
133
129
|
$modes-color-status-content-with-default: #FFFFFF;
|
|
134
130
|
$modes-color-status-content-with-default-alt: #000000f2;
|
|
135
131
|
$modes-color-status-content-with-hover: #FFFFFF; // for pill hover X
|
|
@@ -141,19 +137,21 @@ $modes-color-status-info-default: #0060A7; // For pills and messages. Not access
|
|
|
141
137
|
$modes-color-status-info-default-alt: #eaeef6; // Subtle message bg
|
|
142
138
|
$modes-color-status-info-hover: #10508a; // used on pill hover states
|
|
143
139
|
$modes-color-status-info-hover-alt: #dde1e8; // used on pill hover states and message bg
|
|
144
|
-
$modes-color-status-info-
|
|
140
|
+
$modes-color-status-info-frozenglobal-default: #65a9ff; // used on global message bg
|
|
141
|
+
$modes-color-status-info-frozenglobal-hover: #84b6ff; // used on global message bg
|
|
145
142
|
$modes-color-status-negative-default: #CD384B; // For pills and messages. Not accessible with white TEXT.
|
|
146
143
|
$modes-color-status-negative-default-alt: #fdeceb; // Subtle message bg
|
|
147
144
|
$modes-color-status-negative-hover: #aa323f; // used on pill hover states
|
|
148
145
|
$modes-color-status-negative-hover-alt: #efdfde; // used on pill hover states and message bg
|
|
149
146
|
$modes-color-status-negative-text: #CD384B;
|
|
150
|
-
$modes-color-status-neutral-alt: #656565;
|
|
151
147
|
$modes-color-status-neutral-default: #656565;
|
|
152
148
|
$modes-color-status-neutral-default-alt: #efefef; // Subtle message bg
|
|
153
149
|
$modes-color-status-neutral-hover: #555; // used on pill hover states
|
|
154
150
|
$modes-color-status-neutral-hover-alt: #e2e2e2; // used on pill hover states and message bg
|
|
155
151
|
$modes-color-status-neutral-frozen-default: #335B70;
|
|
152
|
+
$modes-color-status-neutral-frozen-default-alt: #eaedf0; // Subtle message bg
|
|
156
153
|
$modes-color-status-neutral-frozen-hover: #20313b;
|
|
154
|
+
$modes-color-status-neutral-frozen-hover-alt: #dde0e2; // used on pill hover states and message bg
|
|
157
155
|
$modes-color-status-positive-default: #008A21; // For pills and messages. Not accessible with white TEXT.
|
|
158
156
|
$modes-color-status-positive-default-alt: #eaf3e8; // Subtle message bg
|
|
159
157
|
$modes-color-status-positive-hover: #0f731e; // used on pill hover states
|
|
@@ -6,16 +6,11 @@
|
|
|
6
6
|
// Do not edit directly, this file was auto-generated.
|
|
7
7
|
|
|
8
8
|
$logo-size-ai-m: 14px; // AI star
|
|
9
|
-
$logo-color-copilot-no-bg-bg-s: $modes-color-brand-copilot-no-bg-s;
|
|
10
|
-
$logo-color-copilot-no-bg-bg-star: $modes-color-brand-copilot-no-bg-star;
|
|
11
9
|
$logo-color-sage-bg-default: $modes-color-brand-default; // sage logo
|
|
12
10
|
$logo-color-sage-bg-alt: $modes-color-brand-default-alt;
|
|
13
11
|
$logo-color-trust-bg-default: $modes-color-status-positive-default; // filled
|
|
14
12
|
$logo-color-trust-outline: $modes-color-generic-content-extreme;
|
|
15
|
-
$logo-color-copilot-no-bg-fg-default: $modes-color-brand-copilot-no-bg-
|
|
16
|
-
$logo-color-copilot-with-bg-bg-s: $modes-color-brand-copilot-with-bg-s;
|
|
17
|
-
$logo-color-copilot-with-bg-bg-star: $modes-color-brand-copilot-with-bg-star;
|
|
18
|
-
$logo-color-copilot-with-bg-bg-default: $modes-color-brand-copilot-with-bg-bg;
|
|
13
|
+
$logo-color-copilot-no-bg-fg-default: $modes-color-brand-copilot-no-bg-monochrome;
|
|
19
14
|
$logo-color-ai-identifier-bg-star: $modes-color-brand-copilot-ai-identifier-default; // star bg color
|
|
20
15
|
$logo-color-ai-identifier-bg-dot: $modes-color-brand-copilot-ai-identifier-with-default;
|
|
21
16
|
$logo-color-ai-identifier-outline: $modes-color-brand-copilot-ai-identifier-default; // star outline variant
|
|
@@ -7,29 +7,44 @@
|
|
|
7
7
|
|
|
8
8
|
$status-radius-none: $global-radius-none; // Pill (embedded element inner corners)
|
|
9
9
|
$status-color-none: $modes-color-none; // transparent override used for hiding colors when needed.
|
|
10
|
-
$status-color-bg-default: $modes-color-
|
|
11
|
-
$status-color-
|
|
12
|
-
$status-color-
|
|
13
|
-
$status-color-
|
|
14
|
-
$status-color-
|
|
15
|
-
$status-color-
|
|
16
|
-
$status-color-
|
|
17
|
-
$status-color-
|
|
18
|
-
$status-color-
|
|
19
|
-
$status-color-
|
|
20
|
-
$status-color-
|
|
21
|
-
$status-color-
|
|
22
|
-
$status-color-
|
|
23
|
-
$status-color-
|
|
24
|
-
$status-color-
|
|
25
|
-
$status-color-success-bg-
|
|
26
|
-
$status-color-success-
|
|
27
|
-
$status-color-success-
|
|
28
|
-
$status-color-
|
|
29
|
-
$status-color-warning-bg-
|
|
30
|
-
$status-color-warning-bg-alt
|
|
31
|
-
$status-color-warning-border-default: $modes-color-status-caution-default;
|
|
32
|
-
$status-color-warning-icon: $modes-color-status-caution-default; // Icon on tinted bgs
|
|
10
|
+
$status-color-message-global-info-bg-default: $modes-color-status-info-default-alt; // Global message bg
|
|
11
|
+
$status-color-message-global-info-icon: $modes-color-status-info-default; // Icon on tinted bgs
|
|
12
|
+
$status-color-message-global-warning-bg-default: $modes-color-status-caution-default-alt; // Global message bg
|
|
13
|
+
$status-color-message-global-warning-icon: $modes-color-status-caution-default; // Icon on tinted bgs
|
|
14
|
+
$status-color-message-contextual-bg: $modes-color-generic-bg-nought;
|
|
15
|
+
$status-color-message-contextual-icon: $modes-color-generic-bg-nought; // decorative icon on standard contextual messages
|
|
16
|
+
$status-color-message-contextual-ai-bg-alt: $modes-color-status-neutral-default-alt;
|
|
17
|
+
$status-color-message-contextual-error-bg-default: $modes-color-status-negative-default;
|
|
18
|
+
$status-color-message-contextual-error-bg-alt: $modes-color-status-negative-default-alt; // Subtle message bg
|
|
19
|
+
$status-color-message-contextual-error-border-default: $modes-color-status-negative-default;
|
|
20
|
+
$status-color-message-contextual-error-icon: $modes-color-status-negative-default; // Icon on tinted bgs
|
|
21
|
+
$status-color-message-contextual-info-bg-default: $modes-color-status-info-default;
|
|
22
|
+
$status-color-message-contextual-info-bg-alt: $modes-color-status-info-default-alt; // Subtle message bg
|
|
23
|
+
$status-color-message-contextual-info-border-default: $modes-color-status-info-default;
|
|
24
|
+
$status-color-message-contextual-info-icon: $modes-color-status-info-default; // Icon on tinted bgs
|
|
25
|
+
$status-color-message-contextual-success-bg-default: $modes-color-status-positive-default;
|
|
26
|
+
$status-color-message-contextual-success-bg-alt: $modes-color-status-positive-default-alt; // Subtle message bg
|
|
27
|
+
$status-color-message-contextual-success-border-default: $modes-color-status-positive-default;
|
|
28
|
+
$status-color-message-contextual-success-icon: $modes-color-status-positive-default; // Icon on tinted bgs
|
|
29
|
+
$status-color-message-contextual-warning-bg-default: $modes-color-status-caution-default;
|
|
30
|
+
$status-color-message-contextual-warning-bg-alt: $modes-color-status-caution-default-alt; // Subtle message bg
|
|
31
|
+
$status-color-message-contextual-warning-border-default: $modes-color-status-caution-default;
|
|
32
|
+
$status-color-message-contextual-warning-icon: $modes-color-status-caution-default; // Icon on tinted bgs
|
|
33
|
+
$status-color-pill-error-bg-default: $modes-color-status-negative-default;
|
|
34
|
+
$status-color-pill-error-bg-alt-default: $modes-color-status-negative-default-alt; // outline pill bg
|
|
35
|
+
$status-color-pill-error-border-default: $modes-color-status-negative-default;
|
|
36
|
+
$status-color-pill-info-bg-default: $modes-color-status-info-default;
|
|
37
|
+
$status-color-pill-info-bg-alt-default: $modes-color-status-info-default-alt; // outline pill bg
|
|
38
|
+
$status-color-pill-info-border-default: $modes-color-status-info-default;
|
|
39
|
+
$status-color-pill-neutral-bg-default: $modes-color-status-neutral-default;
|
|
40
|
+
$status-color-pill-neutral-bg-alt-default: $modes-color-status-neutral-default-alt; // outline pill bg
|
|
41
|
+
$status-color-pill-neutral-border-default: $modes-color-status-neutral-default;
|
|
42
|
+
$status-color-pill-success-bg-default: $modes-color-status-positive-default;
|
|
43
|
+
$status-color-pill-success-bg-alt-default: $modes-color-status-positive-default-alt; // outline pill bg
|
|
44
|
+
$status-color-pill-success-border-default: $modes-color-status-positive-default;
|
|
45
|
+
$status-color-pill-warning-bg-default: $modes-color-status-caution-default;
|
|
46
|
+
$status-color-pill-warning-bg-alt-default: $modes-color-status-caution-default-alt; // Global message bg
|
|
47
|
+
$status-color-pill-warning-border-default: $modes-color-status-caution-default;
|
|
33
48
|
$status-typography-adaptive-label-s: $global-typography-adaptive-component-firm-s;
|
|
34
49
|
$status-typography-adaptive-label-m: $global-typography-adaptive-component-firm-m;
|
|
35
50
|
$status-typography-adaptive-label-l: $global-typography-adaptive-component-firm-l;
|
|
@@ -48,33 +63,37 @@ $status-typography-responsive-default-l: $global-typography-responsive-component
|
|
|
48
63
|
$status-typography-responsive-heading-s: $global-typography-responsive-component-firm-s;
|
|
49
64
|
$status-typography-responsive-heading-m: $global-typography-responsive-component-firm-m;
|
|
50
65
|
$status-typography-responsive-heading-l: $global-typography-responsive-component-firm-l;
|
|
51
|
-
$status-color-
|
|
52
|
-
$status-color-
|
|
53
|
-
$status-color-
|
|
54
|
-
$status-color-
|
|
55
|
-
$status-color-ai-
|
|
56
|
-
$status-color-
|
|
57
|
-
$status-color-callout-bg-alt
|
|
58
|
-
$status-color-error-bg-alt-hover: $modes-color-status-negative-hover-alt;
|
|
59
|
-
$status-color-error-bg-hover: $modes-color-status-negative-hover;
|
|
60
|
-
$status-color-info-bg-alt-hover: $modes-color-status-info-hover-alt;
|
|
61
|
-
$status-color-info-bg-hover: $modes-color-status-info-hover;
|
|
62
|
-
$status-color-neutral-bg-alt-hover: $modes-color-status-neutral-hover-alt;
|
|
63
|
-
$status-color-neutral-bg-hover: $modes-color-status-neutral-hover;
|
|
66
|
+
$status-color-message-global-callout-bg-default: $modes-color-status-callout-default-alt; // Global message bg
|
|
67
|
+
$status-color-message-global-info-bg-hover: $modes-color-status-info-hover-alt;
|
|
68
|
+
$status-color-message-global-warning-bg-hover: $modes-color-status-caution-hover-alt;
|
|
69
|
+
$status-color-message-contextual-text: $modes-color-status-content-with-hover-alt; // Message text.
|
|
70
|
+
$status-color-message-contextual-ai-bg-default: $modes-color-status-ai-default-alt;
|
|
71
|
+
$status-color-message-contextual-ai-border-default: $modes-color-status-ai-default-alt;
|
|
72
|
+
$status-color-message-contextual-callout-bg-alt: $modes-color-status-callout-default-alt; // Subtle message bg
|
|
73
|
+
$status-color-pill-error-bg-alt-hover: $modes-color-status-negative-hover-alt;
|
|
74
|
+
$status-color-pill-error-bg-hover: $modes-color-status-negative-hover;
|
|
75
|
+
$status-color-pill-info-bg-alt-hover: $modes-color-status-info-hover-alt;
|
|
76
|
+
$status-color-pill-info-bg-hover: $modes-color-status-info-hover;
|
|
77
|
+
$status-color-pill-neutral-bg-alt-hover: $modes-color-status-neutral-hover-alt;
|
|
78
|
+
$status-color-pill-neutral-bg-hover: $modes-color-status-neutral-hover;
|
|
79
|
+
$status-color-pill-success-bg-alt-hover: $modes-color-status-positive-hover-alt;
|
|
80
|
+
$status-color-pill-success-bg-hover: $modes-color-status-positive-hover;
|
|
81
|
+
$status-color-pill-warning-bg-alt-hover: $modes-color-status-caution-hover-alt;
|
|
82
|
+
$status-color-pill-warning-bg-hover: $modes-color-status-caution-hover;
|
|
83
|
+
$status-color-pill-readonly-label: $modes-color-generic-content-firm; // Pill (all types, readonly, when nested in disabled parent components)
|
|
64
84
|
$status-color-rating-bg-default: $modes-color-status-reviews-default;
|
|
65
85
|
$status-color-rating-bg-default-alt: $modes-color-status-reviews-default-alt;
|
|
66
86
|
$status-color-rating-bg-hover: $modes-color-status-reviews-hover;
|
|
67
87
|
$status-color-rating-border-default: $modes-color-status-reviews-default;
|
|
68
|
-
$status-color-
|
|
69
|
-
$status-color-
|
|
70
|
-
$status-color-
|
|
71
|
-
$status-color-
|
|
72
|
-
$status-color-icon
|
|
73
|
-
$status-color-label-default: $modes-color-status-content-with-default;
|
|
74
|
-
$status-color-label-
|
|
75
|
-
$status-color-label-
|
|
76
|
-
$status-color-label-alt-
|
|
77
|
-
$status-color-callout-bg-alt-hover: $modes-color-status-callout-hover-alt; // Subtle message bg
|
|
88
|
+
$status-color-message-global-label-default: $modes-color-status-content-with-default-alt;
|
|
89
|
+
$status-color-message-global-label-hover: $modes-color-status-content-with-default-alt;
|
|
90
|
+
$status-color-message-global-callout-bg-hover: $modes-color-status-callout-hover-alt; // global message bg hover
|
|
91
|
+
$status-color-message-global-callout-icon: $modes-color-status-content-with-default-alt; // Icon on tinted bgs
|
|
92
|
+
$status-color-message-contextual-callout-icon: $modes-color-status-content-with-default-alt;
|
|
93
|
+
$status-color-pill-label-default: $modes-color-status-content-with-default;
|
|
94
|
+
$status-color-pill-label-hover: $modes-color-status-content-with-hover;
|
|
95
|
+
$status-color-pill-label-alt-default: $modes-color-status-content-with-default-alt;
|
|
96
|
+
$status-color-pill-label-alt-hover: $modes-color-status-content-with-default-alt;
|
|
78
97
|
$status-size-pill-s: $global-size-macro-xs - $global-size-micro-xs; // Min height
|
|
79
98
|
$status-size-pill-m: $global-size-macro-xs; // Min height and removable button.
|
|
80
99
|
$status-size-pill-l: $global-size-macro-xs + $global-size-micro-xs; // Min height and removable button
|
|
@@ -110,6 +129,6 @@ $status-space-message-global-yg-m: $global-space-micro-s; // Gap between heading
|
|
|
110
129
|
$status-space-message-global-cta-y-m: $global-space-macro-xs; // Top and bottom padding on global message for countdown
|
|
111
130
|
$status-space-message-global-cta-yg-m: $global-space-macro-m; // Gap between countdown spacing for global message
|
|
112
131
|
$status-space-message-global-iconwrapper-y-m: $global-space-micro-xxl; // Top padding on global message icon wrapper.
|
|
113
|
-
$status-color-bg-
|
|
114
|
-
$status-color-border-
|
|
132
|
+
$status-color-pill-readonly-bg-default: $modes-color-status-inactive-default; // Pill (all types, readonly, when nested in disabled parent components)
|
|
133
|
+
$status-color-pill-readonly-border-default: $modes-color-status-inactive-default; // Pill (all types, readonly, when nested in disabled parent components)
|
|
115
134
|
$status-size-message-messagecontent-maxwidth: $container-size-responsive-xxxl; // max width of content inside message to make sure there are roughly 12 works per line
|
|
@@ -11,12 +11,7 @@ $modes-color-brand-default-alt: #FFFFFF;
|
|
|
11
11
|
$modes-color-brand-with-default-alt: #000000;
|
|
12
12
|
$modes-color-brand-copilot-ai-identifier-default: #FFFFFF;
|
|
13
13
|
$modes-color-brand-copilot-ai-identifier-with-default: #00D639;
|
|
14
|
-
$modes-color-brand-copilot-no-bg-
|
|
15
|
-
$modes-color-brand-copilot-no-bg-star: radial-gradient(99.94% 104.1% at 8.01% 0.98%, #9D60FF 34%, #5A99F1 52%, #32B3E8 59%, #0DCCE0 68%, #00D6DE 72%, #00D6D7 74%, #00D6C6 77%, #00D6AA 81%, #00D682 84%, #00D650 88%, #00D639 90%);
|
|
16
|
-
$modes-color-brand-copilot-no-bg-mono: #FFFFFF;
|
|
17
|
-
$modes-color-brand-copilot-with-bg-s: #000000;
|
|
18
|
-
$modes-color-brand-copilot-with-bg-star: #000000;
|
|
19
|
-
$modes-color-brand-copilot-with-bg-bg: #FFFFFF;
|
|
14
|
+
$modes-color-brand-copilot-no-bg-monochrome: #FFFFFF;
|
|
20
15
|
$modes-color-custom-default: #00D639; // This is the color to replace in white label products. Dark mode recommended luminosity for SAGE is 75.1 (tested), but above 51.9 should be ok. See hsluv.org to be AAA text on 000000 bgs.
|
|
21
16
|
$modes-color-custom-frozen: #00D639; // Replace this color in white label products that use the FROZEN theme. Ensure luminousity of custom color = 46.8 (see hsluv.org). AAA against FFFFFF bg.
|
|
22
17
|
$modes-color-generic-bg-nought: #000000;
|
|
@@ -119,17 +114,18 @@ $modes-color-interactive-primary-frozen-table-default: #18232a;
|
|
|
119
114
|
$modes-color-interactive-progress-bg: #ffffff14;
|
|
120
115
|
$modes-color-interactive-progress-bg-alt: #00000014;
|
|
121
116
|
$modes-color-interactive-progress-frozen-bg: #ffffff14;
|
|
122
|
-
$modes-color-status-ai-default: #000000;
|
|
123
|
-
$modes-color-status-ai-default-alt: #FFFFFF; // bg for contextual message comp
|
|
124
|
-
$modes-color-status-ai-default-horizontal: linear-gradient(90deg, #00D639 0%, #00D6DE 40%, #9D60FF 90%);
|
|
125
|
-
$modes-color-status-ai-default-vertical: linear-gradient(180deg, #00D639 0%, #00D6DE 40%, #9D60FF 90%);
|
|
126
|
-
$modes-color-status-generic-default: #008a89;
|
|
127
117
|
$modes-color-status-caution-default: #E04500;
|
|
128
118
|
$modes-color-status-caution-default-alt: #251206; // Subtle message bg
|
|
129
119
|
$modes-color-status-caution-hover: #eb6732; // used on pill hover states
|
|
130
120
|
$modes-color-status-caution-hover-alt: #34211a; // used on pill hover states and message bg
|
|
131
121
|
$modes-color-status-caution-text: #e75b23;
|
|
132
|
-
$modes-color-status-caution-
|
|
122
|
+
$modes-color-status-caution-frozenglobal-default: #E04500; // Global message bg
|
|
123
|
+
$modes-color-status-caution-frozenglobal-hover: #eb6732; // used on global message bg
|
|
124
|
+
$modes-color-status-ai-default: #000000;
|
|
125
|
+
$modes-color-status-ai-default-alt: #FFFFFF; // bg for contextual message comp
|
|
126
|
+
$modes-color-status-ai-default-horizontal: linear-gradient(90deg, #00D639 0%, #00D6DE 40%, #9D60FF 90%);
|
|
127
|
+
$modes-color-status-ai-default-vertical: linear-gradient(180deg, #00D639 0%, #00D6DE 40%, #9D60FF 90%);
|
|
128
|
+
$modes-color-status-generic-default: #008a89;
|
|
133
129
|
$modes-color-status-content-with-default: #000000;
|
|
134
130
|
$modes-color-status-content-with-default-alt: #fffffff2;
|
|
135
131
|
$modes-color-status-content-with-hover: #000000;
|
|
@@ -141,19 +137,21 @@ $modes-color-status-info-default: #007ED9;
|
|
|
141
137
|
$modes-color-status-info-default-alt: #111722; // Subtle message bg
|
|
142
138
|
$modes-color-status-info-hover: #5291e0; // used on pill hover states
|
|
143
139
|
$modes-color-status-info-hover-alt: #212631; // used on pill hover states and message bg
|
|
144
|
-
$modes-color-status-info-
|
|
140
|
+
$modes-color-status-info-frozenglobal-default: #007ED9; // Global message bg
|
|
141
|
+
$modes-color-status-info-frozenglobal-hover: #5291e0; // used on global message bg
|
|
145
142
|
$modes-color-status-negative-default: #E13E53;
|
|
146
143
|
$modes-color-status-negative-default-alt: #241212; // Subtle message bg
|
|
147
144
|
$modes-color-status-negative-hover: #eb646c; // used on pill hover states
|
|
148
145
|
$modes-color-status-negative-hover-alt: #332122; // used on pill hover states and message bg
|
|
149
146
|
$modes-color-status-negative-text: #E13E53;
|
|
150
|
-
$modes-color-status-neutral-alt: #7C7C7C;
|
|
151
147
|
$modes-color-status-neutral-default: #7C7C7C;
|
|
152
148
|
$modes-color-status-neutral-default-alt: #171717; // Subtle message bg
|
|
153
149
|
$modes-color-status-neutral-hover: #909090; // used on pill hover states
|
|
154
150
|
$modes-color-status-neutral-hover-alt: #262626; // used on pill hover states and message bg
|
|
155
151
|
$modes-color-status-neutral-frozen-default: #9e9e9e;
|
|
152
|
+
$modes-color-status-neutral-frozen-default-alt: #171717; // Subtle message bg
|
|
156
153
|
$modes-color-status-neutral-frozen-hover: #909090;
|
|
154
|
+
$modes-color-status-neutral-frozen-hover-alt: #262626; // used on pill hover states and message bg
|
|
157
155
|
$modes-color-status-positive-default: #009023;
|
|
158
156
|
$modes-color-status-positive-default-alt: #0e1a0b; // Subtle message bg
|
|
159
157
|
$modes-color-status-positive-hover: #2e9936; // used on pill hover states
|
|
@@ -11,12 +11,7 @@ $modes-color-brand-default-alt: #000000;
|
|
|
11
11
|
$modes-color-brand-with-default-alt: #FFFFFF;
|
|
12
12
|
$modes-color-brand-copilot-ai-identifier-default: #000000;
|
|
13
13
|
$modes-color-brand-copilot-ai-identifier-with-default: #00D639;
|
|
14
|
-
$modes-color-brand-copilot-no-bg-
|
|
15
|
-
$modes-color-brand-copilot-no-bg-star: #000000;
|
|
16
|
-
$modes-color-brand-copilot-no-bg-mono: #000000;
|
|
17
|
-
$modes-color-brand-copilot-with-bg-s: linear-gradient(191deg, #9D60FF 28.12%, #7C78F8 33.5%, #29B7E6 46.96%, #00D6DE 52.34%, #00D6DA 55.03%, #00D6D0 56.83%, #00D6C0 57.73%, #00D6A8 59.52%, #00D68A 60.42%, #00D665 62.21%, #00D639 63.11%);
|
|
18
|
-
$modes-color-brand-copilot-with-bg-star: radial-gradient(99.94% 104.1% at 8.01% 0.98%, #9D60FF 34%, #5A99F1 52%, #32B3E8 59%, #0DCCE0 68%, #00D6DE 72%, #00D6D7 74%, #00D6C6 77%, #00D6AA 81%, #00D682 84%, #00D650 88%, #00D639 90%);
|
|
19
|
-
$modes-color-brand-copilot-with-bg-bg: #000000;
|
|
14
|
+
$modes-color-brand-copilot-no-bg-monochrome: #000000;
|
|
20
15
|
$modes-color-custom-default: #00811F; // This is the color to replace in white label products. Ensure luminousity of custom color = 46.8 (see hsluv.org). AAA against FFFFFF bg.
|
|
21
16
|
$modes-color-custom-frozen: #008046; // This is a derivative of Jade, and is the color to replace in white label products that use the FROZEN theme. Ensure luminousity of custom color = 46.8 (see hsluv.org). AAA against FFFFFF bg.
|
|
22
17
|
$modes-color-generic-bg-nought: #FFFFFF;
|
|
@@ -129,7 +124,8 @@ $modes-color-status-caution-default-alt: #ffede5; // Subtle message bg
|
|
|
129
124
|
$modes-color-status-caution-hover: #b13a0d; // used on pill hover states
|
|
130
125
|
$modes-color-status-caution-hover-alt: #f1e0d8; // used on pill hover states and message bg
|
|
131
126
|
$modes-color-status-caution-text: #bf3e0c;
|
|
132
|
-
$modes-color-status-caution-
|
|
127
|
+
$modes-color-status-caution-frozenglobal-default: #ff8629; // used on global message bg
|
|
128
|
+
$modes-color-status-caution-frozenglobal-hover: #ff9a4e; // used on global message bg
|
|
133
129
|
$modes-color-status-content-with-default: #FFFFFF;
|
|
134
130
|
$modes-color-status-content-with-default-alt: #000000f2;
|
|
135
131
|
$modes-color-status-content-with-hover: #FFFFFF; // for pill hover X
|
|
@@ -141,19 +137,21 @@ $modes-color-status-info-default: #0060A7; // For pills and messages. Not access
|
|
|
141
137
|
$modes-color-status-info-default-alt: #eaeef6; // Subtle message bg
|
|
142
138
|
$modes-color-status-info-hover: #10508a; // used on pill hover states
|
|
143
139
|
$modes-color-status-info-hover-alt: #dde1e8; // used on pill hover states and message bg
|
|
144
|
-
$modes-color-status-info-
|
|
140
|
+
$modes-color-status-info-frozenglobal-default: #65a9ff; // used on global message bg
|
|
141
|
+
$modes-color-status-info-frozenglobal-hover: #84b6ff; // used on global message bg
|
|
145
142
|
$modes-color-status-negative-default: #CD384B; // For pills and messages. Not accessible with white TEXT.
|
|
146
143
|
$modes-color-status-negative-default-alt: #fdeceb; // Subtle message bg
|
|
147
144
|
$modes-color-status-negative-hover: #aa323f; // used on pill hover states
|
|
148
145
|
$modes-color-status-negative-hover-alt: #efdfde; // used on pill hover states and message bg
|
|
149
146
|
$modes-color-status-negative-text: #CD384B;
|
|
150
|
-
$modes-color-status-neutral-alt: #656565;
|
|
151
147
|
$modes-color-status-neutral-default: #656565;
|
|
152
148
|
$modes-color-status-neutral-default-alt: #efefef; // Subtle message bg
|
|
153
149
|
$modes-color-status-neutral-hover: #555; // used on pill hover states
|
|
154
150
|
$modes-color-status-neutral-hover-alt: #e2e2e2; // used on pill hover states and message bg
|
|
155
151
|
$modes-color-status-neutral-frozen-default: #335B70;
|
|
152
|
+
$modes-color-status-neutral-frozen-default-alt: #eaedf0; // Subtle message bg
|
|
156
153
|
$modes-color-status-neutral-frozen-hover: #20313b;
|
|
154
|
+
$modes-color-status-neutral-frozen-hover-alt: #dde0e2; // used on pill hover states and message bg
|
|
157
155
|
$modes-color-status-positive-default: #008A21; // For pills and messages. Not accessible with white TEXT.
|
|
158
156
|
$modes-color-status-positive-default-alt: #eaf3e8; // Subtle message bg
|
|
159
157
|
$modes-color-status-positive-hover: #0f731e; // used on pill hover states
|
|
@@ -23,9 +23,6 @@ $button-color-ai-border-hover: $modes-color-interactive-ai-default;
|
|
|
23
23
|
$button-color-destructive-primary-bg-enabled: $modes-color-interactive-danger-default;
|
|
24
24
|
$button-color-destructive-secondary-border-enabled: $modes-color-interactive-danger-default;
|
|
25
25
|
$button-color-destructive-secondary-label-enabled: $modes-color-interactive-danger-default;
|
|
26
|
-
$button-color-typical-secondary-border-active: $modes-color-interactive-monochrome-generic-active;
|
|
27
|
-
$button-color-typical-tertiary-border-active: $modes-color-interactive-monochrome-generic-active;
|
|
28
|
-
$button-color-typical-toggle-bg-active: $modes-color-interactive-monochrome-generic-active;
|
|
29
26
|
$button-typography-adaptive-primary-s: $global-typography-adaptive-component-firm-s;
|
|
30
27
|
$button-typography-adaptive-primary-m: $global-typography-adaptive-component-firm-m;
|
|
31
28
|
$button-typography-adaptive-primary-l: $global-typography-adaptive-component-firm-l;
|
|
@@ -50,7 +47,6 @@ $button-typography-responsive-tertiary-l: $global-typography-responsive-componen
|
|
|
50
47
|
$button-typography-responsive-subtle-s: $global-typography-responsive-component-firm-s;
|
|
51
48
|
$button-typography-responsive-subtle-m: $global-typography-responsive-component-firm-m;
|
|
52
49
|
$button-typography-responsive-subtle-l: $global-typography-responsive-component-firm-l;
|
|
53
|
-
$button-color-ai-label-enabled: $modes-color-interactive-monochrome-generic-default;
|
|
54
50
|
$button-color-ai-label-hover: $modes-color-interactive-monochrome-generic-with-hover;
|
|
55
51
|
$button-color-destructive-primary-bg-hover: $modes-color-interactive-danger-hover;
|
|
56
52
|
$button-color-destructive-secondary-bg-hover: $modes-color-interactive-danger-hover-alt;
|
|
@@ -58,25 +54,17 @@ $button-color-destructive-secondary-border-hover: $modes-color-interactive-dange
|
|
|
58
54
|
$button-color-destructive-secondary-label-hover: $modes-color-interactive-danger-hover;
|
|
59
55
|
$button-color-typical-primary-bg-enabled: $modes-color-interactive-primary-default;
|
|
60
56
|
$button-color-typical-secondary-bg-hover: $modes-color-interactive-monochrome-generic-hover-alt;
|
|
61
|
-
$button-color-typical-secondary-border-
|
|
62
|
-
$button-color-typical-secondary-border-hover: $modes-color-interactive-monochrome-generic-default;
|
|
63
|
-
$button-color-typical-secondary-label-enabled: $modes-color-interactive-monochrome-generic-default;
|
|
57
|
+
$button-color-typical-secondary-border-active: $modes-color-interactive-monochrome-generic-active;
|
|
64
58
|
$button-color-typical-secondary-label-hover: $modes-color-interactive-monochrome-generic-with-hover;
|
|
65
59
|
$button-color-typical-subtle-bg-hover: $modes-color-interactive-monochrome-generic-hover-alt;
|
|
66
|
-
$button-color-typical-subtle-label-enabled: $modes-color-interactive-monochrome-generic-default-alt;
|
|
67
60
|
$button-color-typical-subtle-label-hover: $modes-color-interactive-monochrome-generic-with-hover;
|
|
68
|
-
$button-color-typical-tertiary-bg-enabled: $modes-color-interactive-monochrome-subtle-default;
|
|
69
61
|
$button-color-typical-tertiary-bg-hover: $modes-color-interactive-monochrome-generic-hover-alt;
|
|
70
|
-
$button-color-typical-tertiary-
|
|
62
|
+
$button-color-typical-tertiary-border-active: $modes-color-interactive-monochrome-generic-active;
|
|
71
63
|
$button-color-typical-tertiary-label-hover: $modes-color-interactive-monochrome-generic-with-hover;
|
|
64
|
+
$button-color-typical-toggle-bg-active: $modes-color-interactive-monochrome-generic-active;
|
|
72
65
|
$button-color-typical-toggle-bg-hover: $modes-color-interactive-monochrome-generic-hover-alt;
|
|
73
|
-
$button-color-typical-toggle-border-enabled: $modes-color-interactive-monochrome-generic-default;
|
|
74
|
-
$button-color-typical-toggle-label-enabled: $modes-color-interactive-monochrome-generic-default-alt;
|
|
75
66
|
$button-color-typical-toggle-label-hover: $modes-color-interactive-monochrome-generic-with-hover;
|
|
76
67
|
$button-color-video-bg-blur: $modes-color-interactive-monochrome-generic-hover-alt;
|
|
77
|
-
$button-color-video-primary-label-enabled: $modes-color-interactive-monochrome-generic-default;
|
|
78
|
-
$button-color-video-primary-label-hover: $modes-color-interactive-monochrome-generic-default;
|
|
79
|
-
$button-color-video-secondary-label-hover: $modes-color-interactive-monochrome-generic-default;
|
|
80
68
|
$button-size-split: $global-size-micro-xxs; // Split button (divider width)
|
|
81
69
|
$button-size-s: $global-size-macro-s; // min-height on S Buttons
|
|
82
70
|
$button-size-m: $global-size-macro-m; // min-height on M Buttons
|
|
@@ -166,8 +154,8 @@ $button-space-toggle-container-y-l: $global-space-micro-s; // Vertical padding
|
|
|
166
154
|
$button-space-video-x-s: $global-space-micro-xs; // Left padding on play icon in video button
|
|
167
155
|
$button-space-video-x-m: $global-space-micro-xs; // Left padding on play icon in video button
|
|
168
156
|
$button-space-video-x-l: $global-space-micro-xs; // Left padding on play icon in video button
|
|
169
|
-
$button-color-ai-label-active: $modes-color-interactive-monochrome-generic-with-active-alt;
|
|
170
157
|
$button-color-ai-label-disabled: $modes-color-interactive-inactive-content;
|
|
158
|
+
$button-color-ai-label-enabled: $modes-color-interactive-monochrome-generic-default;
|
|
171
159
|
$button-color-destructive-primary-label-disabled: $modes-color-interactive-inactive-content-alt;
|
|
172
160
|
$button-color-destructive-primary-label-enabled: $modes-color-interactive-danger-with-default;
|
|
173
161
|
$button-color-destructive-primary-label-hover: $modes-color-interactive-danger-with-default;
|
|
@@ -179,25 +167,30 @@ $button-color-typical-primary-label-active: $modes-color-interactive-primary-wit
|
|
|
179
167
|
$button-color-typical-primary-label-disabled: $modes-color-interactive-inactive-content-alt;
|
|
180
168
|
$button-color-typical-primary-label-enabled: $modes-color-interactive-primary-with-default;
|
|
181
169
|
$button-color-typical-primary-label-hover: $modes-color-interactive-primary-with-default;
|
|
182
|
-
$button-color-typical-secondary-
|
|
183
|
-
$button-color-typical-secondary-
|
|
170
|
+
$button-color-typical-secondary-border-enabled: $modes-color-interactive-monochrome-generic-default;
|
|
171
|
+
$button-color-typical-secondary-border-hover: $modes-color-interactive-monochrome-generic-default;
|
|
184
172
|
$button-color-typical-secondary-label-disabled: $modes-color-interactive-inactive-content;
|
|
185
|
-
$button-color-typical-
|
|
186
|
-
$button-color-typical-subtle-label-active: $modes-color-interactive-monochrome-generic-with-active-alt;
|
|
173
|
+
$button-color-typical-secondary-label-enabled: $modes-color-interactive-monochrome-generic-default;
|
|
187
174
|
$button-color-typical-subtle-label-disabled: $modes-color-interactive-inactive-content;
|
|
188
|
-
$button-color-typical-
|
|
189
|
-
$button-color-typical-tertiary-
|
|
175
|
+
$button-color-typical-subtle-label-enabled: $modes-color-interactive-monochrome-generic-default-alt;
|
|
176
|
+
$button-color-typical-tertiary-bg-enabled: $modes-color-interactive-monochrome-subtle-default;
|
|
190
177
|
$button-color-typical-tertiary-label-active-copy: $modes-color-interactive-monochrome-frozen-with-active;
|
|
191
178
|
$button-color-typical-tertiary-label-disabled: $modes-color-interactive-inactive-content;
|
|
179
|
+
$button-color-typical-tertiary-label-enabled: $modes-color-interactive-monochrome-generic-default;
|
|
192
180
|
$button-color-typical-toggle-label-active-disabled: $modes-color-interactive-inactive-content-alt;
|
|
181
|
+
$button-color-typical-toggle-border-enabled: $modes-color-interactive-monochrome-generic-default;
|
|
193
182
|
$button-color-typical-toggle-label-active: $modes-color-interactive-monochrome-generic-with-active;
|
|
194
183
|
$button-color-typical-toggle-label-disabled: $modes-color-interactive-inactive-content;
|
|
184
|
+
$button-color-typical-toggle-label-enabled: $modes-color-interactive-monochrome-generic-default-alt;
|
|
195
185
|
$button-color-video-primary-bg-enabled: $modes-color-interactive-monochrome-generic-with-default;
|
|
196
186
|
$button-color-video-primary-bg-hover: $modes-color-interactive-monochrome-generic-with-default;
|
|
187
|
+
$button-color-video-primary-label-enabled: $modes-color-interactive-monochrome-generic-default;
|
|
188
|
+
$button-color-video-primary-label-hover: $modes-color-interactive-monochrome-generic-default;
|
|
197
189
|
$button-color-video-secondary-bg-hover: $modes-color-interactive-monochrome-generic-with-default;
|
|
198
190
|
$button-color-video-secondary-border-enabled: $modes-color-interactive-monochrome-generic-with-default;
|
|
199
191
|
$button-color-video-secondary-border-hover: $modes-color-interactive-monochrome-generic-with-default;
|
|
200
192
|
$button-color-video-secondary-label-enabled: $modes-color-interactive-monochrome-generic-with-default;
|
|
193
|
+
$button-color-video-secondary-label-hover: $modes-color-interactive-monochrome-generic-default;
|
|
201
194
|
$button-radius-s: $global-radius-interactive-l; // Buttons S (typical and destructive, and inc bar, split and multi), Button toggle M (parent container)
|
|
202
195
|
$button-radius-m: $global-radius-interactive-xl; // Buttons M (typical and destructive, and inc bar, split and multi), Button toggle L (parent container), Button toggle M (parent container)
|
|
203
196
|
$button-radius-l: $global-radius-interactive-xxl; // Buttons L (typical and destructive, and inc bar, split and multi), Button toggle L (parent container)
|
|
@@ -218,10 +211,17 @@ $button-borderwidth-chip: $global-borderwidth-xs; // chip button border width
|
|
|
218
211
|
$button-borderwidth-secondary: $global-borderwidth-s; // Secondary button.
|
|
219
212
|
$button-borderwidth-togglecontainer: $global-borderwidth-xs; // Toggle container
|
|
220
213
|
$button-color-ai-border-disabled: $modes-color-interactive-inactive-default;
|
|
214
|
+
$button-color-ai-label-active: $modes-color-interactive-monochrome-generic-with-active-alt;
|
|
221
215
|
$button-color-destructive-primary-bg-disabled: $modes-color-interactive-inactive-default;
|
|
222
216
|
$button-color-destructive-secondary-border-disabled: $modes-color-interactive-inactive-default;
|
|
223
217
|
$button-color-typical-primary-bg-disabled: $modes-color-interactive-inactive-default;
|
|
218
|
+
$button-color-typical-secondary-bg-active: $modes-color-interactive-monochrome-generic-active-alt;
|
|
224
219
|
$button-color-typical-secondary-border-disabled: $modes-color-interactive-inactive-default;
|
|
220
|
+
$button-color-typical-secondary-label-active: $modes-color-interactive-monochrome-generic-with-active-alt;
|
|
221
|
+
$button-color-typical-subtle-bg-active: $modes-color-interactive-monochrome-generic-active-alt;
|
|
222
|
+
$button-color-typical-subtle-label-active: $modes-color-interactive-monochrome-generic-with-active-alt;
|
|
223
|
+
$button-color-typical-tertiary-bg-active: $modes-color-interactive-monochrome-generic-active-alt;
|
|
225
224
|
$button-color-typical-tertiary-bg-active-disabled: $modes-color-interactive-inactive-default;
|
|
226
225
|
$button-color-typical-tertiary-border-disabled: $modes-color-interactive-inactive-default;
|
|
226
|
+
$button-color-typical-tertiary-label-active: $modes-color-interactive-monochrome-generic-with-active-alt;
|
|
227
227
|
$button-color-typical-toggle-bg-active-disabled: $modes-color-interactive-inactive-default;
|
|
@@ -12,20 +12,15 @@ $container-radius-blockquote-bar: $global-radius-circle; // radius for blockquot
|
|
|
12
12
|
$container-radius-scrollbar: $global-radius-circle; // Scrollbar
|
|
13
13
|
$container-opacity-carousel-hidden: $modes-color-modifiers-input-disabled-fg; // opacity applied to next and previous carousel slides
|
|
14
14
|
$container-color-standard-bg-default: $modes-color-generic-bg-nought;
|
|
15
|
-
$container-color-standard-border-active: $modes-color-interactive-monochrome-generic-active;
|
|
16
15
|
$container-color-ai-borderhorizontal: $modes-color-status-ai-default-horizontal; // top and bottom border for AI dialog component
|
|
17
16
|
$container-color-ai-bordervertical: $modes-color-status-ai-default-vertical; // left and right border for dialog and insight bubbles.
|
|
18
17
|
$container-color-ai-nudge-border-ai-horizontal: $modes-color-status-ai-default-horizontal; // top and bottom border for AI nudge message component
|
|
19
18
|
$container-color-ai-nudge-border-ai-vertical: $modes-color-status-ai-default-vertical; // left and right border for AI nudge message component
|
|
20
19
|
$container-color-interactive-detailedicon-bg: $modes-color-custom-default; //
|
|
21
20
|
$container-color-interactive-bg-footer-activated: $modes-color-status-positive-default; //
|
|
22
|
-
$container-color-interactive-bg-footer-active: $modes-color-interactive-monochrome-generic-active;
|
|
23
21
|
$container-color-interactive-border-activated: $modes-color-status-positive-default;
|
|
24
22
|
$container-color-interactive-bg-footer-default: $modes-color-generic-bg-nought; // tile footer bg color
|
|
25
23
|
$container-color-interactive-bg-enabled: $modes-color-generic-bg-nought;
|
|
26
|
-
$container-color-interactive-border-active: $modes-color-interactive-monochrome-generic-active;
|
|
27
|
-
$container-color-interactive-icon-active: $modes-color-interactive-monochrome-generic-active; // Active chevron for any accordion.
|
|
28
|
-
$container-color-interactive-text-active: $modes-color-interactive-monochrome-generic-active; // Active label for any accordion.
|
|
29
24
|
$container-typography-adaptive-heading-m: $global-typography-adaptive-heading-s; // Accordion, Subscription tile, Tile select and generic tile or card headings
|
|
30
25
|
$container-typography-adaptive-heading-l: $global-typography-adaptive-heading-m; // Dialog, drawer and sidebar headings
|
|
31
26
|
$container-typography-adaptive-subheading-m: $global-typography-adaptive-subheading-m; // Accordion subheading, Step flow subheading, tile select subheading, dialog, drawer and sidebar subheading
|
|
@@ -46,17 +41,18 @@ $container-typography-responsive-paragraph-m: $global-typography-responsive-comp
|
|
|
46
41
|
$container-typography-responsive-paragraph-l: $global-typography-responsive-component-moderate-l;
|
|
47
42
|
$container-color-standard-bg-alt: $modes-color-generic-bg-faint;
|
|
48
43
|
$container-color-standard-bg-footer-default: $modes-color-generic-bg-faint; // tile footer bg color
|
|
44
|
+
$container-color-standard-border-active: $modes-color-interactive-monochrome-generic-active;
|
|
49
45
|
$container-color-standard-dimmer: $modes-color-interactive-inactive-mask; // dimmed mask for dialogs
|
|
50
46
|
$container-color-standard-text-alt: $modes-color-generic-content-moderate; // for subheadings etc
|
|
51
47
|
$container-color-standard-text-default: $modes-color-generic-content-harsh; // for headings, paragraph text etc
|
|
52
48
|
$container-color-scrollbar-bg-default: $modes-color-generic-bg-faint;
|
|
49
|
+
$container-color-interactive-bg-footer-active: $modes-color-interactive-monochrome-generic-active;
|
|
53
50
|
$container-color-interactive-bg-hover: $modes-color-interactive-monochrome-generic-hover-alt; // Used for accordion hover backgrounds
|
|
54
|
-
$container-color-interactive-
|
|
55
|
-
$container-color-interactive-icon-
|
|
56
|
-
$container-color-interactive-
|
|
51
|
+
$container-color-interactive-border-active: $modes-color-interactive-monochrome-generic-active;
|
|
52
|
+
$container-color-interactive-icon-active: $modes-color-interactive-monochrome-generic-active; // Active chevron for any accordion.
|
|
53
|
+
$container-color-interactive-text-active: $modes-color-interactive-monochrome-generic-active; // Active label for any accordion.
|
|
57
54
|
$container-color-interactive-text-enabled: $modes-color-generic-content-harsh; // Enabled label for standard accordion.
|
|
58
55
|
$container-color-interactive-text-alt-enabled: $modes-color-generic-content-moderate; // Enabled label for subtle accordion.
|
|
59
|
-
$container-color-interactive-text-hover: $modes-color-interactive-monochrome-generic-default; // Hover label for any accordion.
|
|
60
56
|
$container-color-blockquote-border: $modes-color-interactive-primary-default;
|
|
61
57
|
$container-boxshadow-card-enabled: $global-boxshadow-interactive-enabled; // Card (enabled)
|
|
62
58
|
$container-boxshadow-card-hover: $global-boxshadow-interactive-hover; // Card (hover state)
|
|
@@ -76,9 +72,13 @@ $container-color-interactive-bg-disabled: $modes-color-interactive-inactive-defa
|
|
|
76
72
|
$container-color-interactive-border-alt: $modes-color-generic-fg-delicate; // Link preview.
|
|
77
73
|
$container-color-interactive-border-inactive: $modes-color-generic-fg-soft;
|
|
78
74
|
$container-color-interactive-border-enabled: $modes-color-generic-fg-moderate;
|
|
75
|
+
$container-color-interactive-icon-enabled: $modes-color-interactive-monochrome-generic-default; // Enabled chevron for any accordion.
|
|
76
|
+
$container-color-interactive-icon-alt-enabled: $modes-color-interactive-monochrome-generic-default-alt; // Enabled label for subtle accordion.
|
|
77
|
+
$container-color-interactive-icon-hover: $modes-color-interactive-monochrome-generic-default; // Hover chevron for any accordion.
|
|
79
78
|
$container-color-interactive-label-footer-active: $modes-color-interactive-monochrome-generic-with-active;
|
|
80
79
|
$container-color-interactive-label-footer-activated: $modes-color-interactive-monochrome-generic-with-active;
|
|
81
80
|
$container-color-interactive-text-disabled: $modes-color-interactive-inactive-content;
|
|
81
|
+
$container-color-interactive-text-hover: $modes-color-interactive-monochrome-generic-default; // Hover label for any accordion.
|
|
82
82
|
$container-size-none: $global-size-none;
|
|
83
83
|
$container-size-accordionstandard-chevron: $global-size-icon-m; // Accordion chevron container
|
|
84
84
|
$container-size-quotebar-width: $global-size-micro-m; // block quote bar width
|
|
@@ -13,10 +13,7 @@ $form-radius-radio: $global-radius-circle; // Radio button
|
|
|
13
13
|
$form-radius-switch: $global-radius-circle; // Switch container and handle
|
|
14
14
|
$form-radius-calendar-none: $global-radius-none; // Calendar (start and end duration)
|
|
15
15
|
$form-radius-calendar-date: $global-radius-circle; // Calendar date (hover & selected),
|
|
16
|
-
$form-color-calendar-bg-active: $modes-color-interactive-monochrome-generic-active;
|
|
17
|
-
$form-color-calendar-border-duration: $modes-color-interactive-monochrome-generic-active;
|
|
18
16
|
$form-color-labelset-label-required: $modes-color-interactive-danger-default;
|
|
19
|
-
$form-color-switch-bg-active: $modes-color-interactive-monochrome-generic-active;
|
|
20
17
|
$form-color-validation-border-error: $modes-color-status-negative-default;
|
|
21
18
|
$form-color-validation-bar-error: $modes-color-status-negative-default; // error bar to left of inputs
|
|
22
19
|
$form-color-validation-bar-warning: $modes-color-status-caution-default; // warning bar to left of inputs
|
|
@@ -35,10 +32,10 @@ $form-typography-responsive-label-l: $global-typography-responsive-component-fir
|
|
|
35
32
|
$form-typography-responsive-default-s: $global-typography-responsive-component-moderate-s;
|
|
36
33
|
$form-typography-responsive-default-m: $global-typography-responsive-component-moderate-m;
|
|
37
34
|
$form-typography-responsive-default-l: $global-typography-responsive-component-moderate-l;
|
|
35
|
+
$form-color-calendar-bg-active: $modes-color-interactive-monochrome-generic-active;
|
|
38
36
|
$form-color-calendar-bg-hover: $modes-color-interactive-monochrome-generic-hover-alt;
|
|
37
|
+
$form-color-calendar-border-duration: $modes-color-interactive-monochrome-generic-active;
|
|
39
38
|
$form-color-calendar-text-hover: $modes-color-interactive-monochrome-generic-with-hover;
|
|
40
|
-
$form-color-dropdown-label-alt: $modes-color-interactive-monochrome-generic-default;
|
|
41
|
-
$form-color-dropdown-label-enabled: $modes-color-interactive-monochrome-generic-default-alt;
|
|
42
39
|
$form-color-dropdown-label-hover: $modes-color-interactive-monochrome-generic-with-hover;
|
|
43
40
|
$form-color-typical-bg-default: $modes-color-interactive-data-entry-default;
|
|
44
41
|
$form-color-typical-bg-enabled: $modes-color-interactive-data-entry-default;
|
|
@@ -47,9 +44,8 @@ $form-color-typical-icon-active: $modes-color-interactive-data-entry-with-active
|
|
|
47
44
|
$form-color-typical-icon-hover: $modes-color-interactive-data-entry-with-hover;
|
|
48
45
|
$form-color-typical-text-hover: $modes-color-interactive-data-entry-with-hover; // text hover state when dragging a file over file input
|
|
49
46
|
$form-color-typical-text-read-only: $modes-color-generic-content-harsh;
|
|
47
|
+
$form-color-switch-bg-active: $modes-color-interactive-monochrome-generic-active;
|
|
50
48
|
$form-color-switch-bg-enabled: $modes-color-interactive-data-entry-default; // for switch
|
|
51
|
-
$form-color-switch-border-enabled: $modes-color-interactive-monochrome-subtle-default-alt;
|
|
52
|
-
$form-color-switch-fg-enabled: $modes-color-interactive-monochrome-subtle-default-alt;
|
|
53
49
|
$form-space-none: $global-space-none;
|
|
54
50
|
$form-space-calendar-x-m: $global-space-macro-m;
|
|
55
51
|
$form-space-calendar-y-m: $global-space-macro-m;
|
|
@@ -222,7 +218,9 @@ $form-color-calendar-text-enabled: $modes-color-interactive-data-entry-content;
|
|
|
222
218
|
$form-color-calendar-text-alt-enabled: $modes-color-interactive-data-entry-content-alt;
|
|
223
219
|
$form-color-dropdown-bg-hover: $popover-color-bg-hover; // REF POPOVER
|
|
224
220
|
$form-color-dropdown-label-active: $modes-color-interactive-monochrome-generic-with-active;
|
|
221
|
+
$form-color-dropdown-label-alt: $modes-color-interactive-monochrome-generic-default;
|
|
225
222
|
$form-color-dropdown-label-disabled: $modes-color-interactive-inactive-content;
|
|
223
|
+
$form-color-dropdown-label-enabled: $modes-color-interactive-monochrome-generic-default-alt;
|
|
226
224
|
$form-color-labelset-label-default: $modes-color-interactive-data-entry-content;
|
|
227
225
|
$form-color-labelset-label-alt: $modes-color-interactive-data-entry-content-alt; // used for '(optional)' text and hint text.
|
|
228
226
|
$form-color-labelset-label-disabled: $modes-color-interactive-inactive-content;
|
|
@@ -242,8 +240,10 @@ $form-color-typical-text-default: $modes-color-interactive-data-entry-content;
|
|
|
242
240
|
$form-color-typical-text-disabled: $modes-color-interactive-inactive-content;
|
|
243
241
|
$form-color-typical-text-enabled: $modes-color-interactive-data-entry-content; // Dropdown text (subtle dropdown).
|
|
244
242
|
$form-color-switch-bg-disabled: $modes-color-interactive-inactive-default-alt; // for switch
|
|
243
|
+
$form-color-switch-border-enabled: $modes-color-interactive-monochrome-subtle-default-alt;
|
|
245
244
|
$form-color-switch-fg-active: $modes-color-interactive-monochrome-generic-with-active;
|
|
246
245
|
$form-color-switch-fg-activedisabled: $modes-color-interactive-inactive-content-alt;
|
|
246
|
+
$form-color-switch-fg-enabled: $modes-color-interactive-monochrome-subtle-default-alt;
|
|
247
247
|
$form-color-switch-label-active: $modes-color-interactive-data-entry-content;
|
|
248
248
|
$form-color-switch-label-enabled: $modes-color-interactive-data-entry-content-alt;
|
|
249
249
|
$form-color-switch-icon-enabled: $modes-color-interactive-data-entry-content-alt;
|
|
@@ -5,7 +5,6 @@
|
|
|
5
5
|
|
|
6
6
|
// Do not edit directly, this file was auto-generated.
|
|
7
7
|
|
|
8
|
-
$link-color-subtle-label-hover: $modes-color-interactive-monochrome-generic-active;
|
|
9
8
|
$link-typography-responsive-default-s: $global-typography-responsive-component-underlined-moderate-s; // Small Viewports: 14.81, Large Viewports: 13.79. Match token size to component size.
|
|
10
9
|
$link-typography-responsive-default-m: $global-typography-responsive-component-underlined-moderate-m; // Small Viewports: 16, Large Viewports: 16. Match token size to component size.
|
|
11
10
|
$link-typography-responsive-default-l: $global-typography-responsive-component-underlined-moderate-l; // Small Viewports: 17.28, Large Viewports: 18.56. Match token size to component size.
|
|
@@ -19,10 +18,11 @@ $link-typography-adaptive-heading-s: $global-typography-adaptive-component-under
|
|
|
19
18
|
$link-typography-adaptive-heading-m: $global-typography-adaptive-component-underlined-firm-m;
|
|
20
19
|
$link-typography-adaptive-heading-l: $global-typography-adaptive-component-underlined-firm-l;
|
|
21
20
|
$link-color-destructive-label-default: $modes-color-interactive-danger-default-alt; // .
|
|
22
|
-
$link-color-subtle-label-
|
|
21
|
+
$link-color-subtle-label-hover: $modes-color-interactive-monochrome-generic-active;
|
|
23
22
|
$link-boxshadow-skiplink: $global-boxshadow-container-near;
|
|
24
23
|
$link-color-destructive-label-hover: $modes-color-interactive-danger-hover-alt2;
|
|
25
24
|
$link-color-typical-label-default: $modes-color-interactive-primary-default-alt;
|
|
25
|
+
$link-color-subtle-label-default: $modes-color-interactive-monochrome-generic-default;
|
|
26
26
|
$link-size-skiplink-m: $global-size-macro-m;
|
|
27
27
|
$link-size-icon-m: $global-size-icon-m;
|
|
28
28
|
$link-radius-link: $global-radius-interactive-xs; // Link (focus bg and bottom corners of focus underline)
|
|
@@ -6,16 +6,11 @@
|
|
|
6
6
|
// Do not edit directly, this file was auto-generated.
|
|
7
7
|
|
|
8
8
|
$logo-size-ai-m: 14px; // AI star
|
|
9
|
-
$logo-color-copilot-no-bg-bg-s: $modes-color-brand-copilot-no-bg-s;
|
|
10
|
-
$logo-color-copilot-no-bg-bg-star: $modes-color-brand-copilot-no-bg-star;
|
|
11
9
|
$logo-color-sage-bg-default: $modes-color-brand-default; // sage logo
|
|
12
10
|
$logo-color-sage-bg-alt: $modes-color-brand-default-alt;
|
|
13
11
|
$logo-color-trust-bg-default: $modes-color-status-positive-default; // filled
|
|
14
12
|
$logo-color-trust-outline: $modes-color-generic-content-extreme;
|
|
15
|
-
$logo-color-copilot-no-bg-fg-default: $modes-color-brand-copilot-no-bg-
|
|
16
|
-
$logo-color-copilot-with-bg-bg-s: $modes-color-brand-copilot-with-bg-s;
|
|
17
|
-
$logo-color-copilot-with-bg-bg-star: $modes-color-brand-copilot-with-bg-star;
|
|
18
|
-
$logo-color-copilot-with-bg-bg-default: $modes-color-brand-copilot-with-bg-bg;
|
|
13
|
+
$logo-color-copilot-no-bg-fg-default: $modes-color-brand-copilot-no-bg-monochrome;
|
|
19
14
|
$logo-color-ai-identifier-bg-star: $modes-color-brand-copilot-ai-identifier-default; // star bg color
|
|
20
15
|
$logo-color-ai-identifier-bg-dot: $modes-color-brand-copilot-ai-identifier-with-default;
|
|
21
16
|
$logo-color-ai-identifier-outline: $modes-color-brand-copilot-ai-identifier-default; // star outline variant
|