@sage/design-tokens 15.2.0 → 15.2.2
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 +117 -117
- package/css/frozenproduct/large/components/badge.css +3 -3
- package/css/frozenproduct/large/components/button.css +32 -32
- package/css/frozenproduct/large/components/container.css +11 -11
- package/css/frozenproduct/large/components/form.css +15 -15
- package/css/frozenproduct/large/components/link.css +2 -2
- package/css/frozenproduct/large/components/nav.css +3 -3
- package/css/frozenproduct/large/components/popover.css +6 -6
- package/css/frozenproduct/large/components/progress.css +5 -5
- package/css/frozenproduct/large/components/status.css +25 -25
- package/css/frozenproduct/large/components/tab.css +7 -7
- package/css/frozenproduct/large/components/table.css +8 -8
- package/css/frozenproduct/small/components/badge.css +3 -3
- package/css/frozenproduct/small/components/button.css +32 -32
- package/css/frozenproduct/small/components/container.css +11 -11
- package/css/frozenproduct/small/components/form.css +15 -15
- package/css/frozenproduct/small/components/link.css +2 -2
- package/css/frozenproduct/small/components/nav.css +3 -3
- package/css/frozenproduct/small/components/popover.css +6 -6
- package/css/frozenproduct/small/components/progress.css +5 -5
- package/css/frozenproduct/small/components/status.css +25 -25
- package/css/frozenproduct/small/components/tab.css +7 -7
- package/css/frozenproduct/small/components/table.css +8 -8
- package/css/product/all.css +1 -1
- package/css/product/large/components/form.css +1 -1
- package/css/product/small/components/form.css +1 -1
- package/ios/frozenproduct/large/dark/components/badge.h +2 -2
- package/ios/frozenproduct/large/dark/components/button.h +15 -15
- package/ios/frozenproduct/large/dark/components/container.h +9 -9
- package/ios/frozenproduct/large/dark/components/form.h +11 -11
- package/ios/frozenproduct/large/dark/components/nav.h +2 -2
- package/ios/frozenproduct/large/dark/components/popover.h +2 -2
- package/ios/frozenproduct/large/dark/components/progress.h +2 -2
- package/ios/frozenproduct/large/dark/components/status.h +20 -20
- package/ios/frozenproduct/large/dark/components/tab.h +5 -5
- package/ios/frozenproduct/large/dark/components/table.h +8 -8
- package/ios/frozenproduct/large/light/components/badge.h +2 -2
- package/ios/frozenproduct/large/light/components/button.h +30 -30
- package/ios/frozenproduct/large/light/components/container.h +11 -11
- package/ios/frozenproduct/large/light/components/form.h +15 -15
- package/ios/frozenproduct/large/light/components/link.h +2 -2
- package/ios/frozenproduct/large/light/components/nav.h +3 -3
- package/ios/frozenproduct/large/light/components/popover.h +6 -6
- package/ios/frozenproduct/large/light/components/progress.h +5 -5
- package/ios/frozenproduct/large/light/components/status.h +25 -25
- package/ios/frozenproduct/large/light/components/tab.h +6 -6
- package/ios/frozenproduct/large/light/components/table.h +8 -8
- package/ios/frozenproduct/small/dark/components/badge.h +2 -2
- package/ios/frozenproduct/small/dark/components/button.h +15 -15
- package/ios/frozenproduct/small/dark/components/container.h +9 -9
- package/ios/frozenproduct/small/dark/components/form.h +11 -11
- package/ios/frozenproduct/small/dark/components/nav.h +2 -2
- package/ios/frozenproduct/small/dark/components/popover.h +2 -2
- package/ios/frozenproduct/small/dark/components/progress.h +2 -2
- package/ios/frozenproduct/small/dark/components/status.h +20 -20
- package/ios/frozenproduct/small/dark/components/tab.h +5 -5
- package/ios/frozenproduct/small/dark/components/table.h +8 -8
- package/ios/frozenproduct/small/light/components/badge.h +2 -2
- package/ios/frozenproduct/small/light/components/button.h +30 -30
- package/ios/frozenproduct/small/light/components/container.h +11 -11
- package/ios/frozenproduct/small/light/components/form.h +15 -15
- package/ios/frozenproduct/small/light/components/link.h +2 -2
- package/ios/frozenproduct/small/light/components/nav.h +3 -3
- package/ios/frozenproduct/small/light/components/popover.h +6 -6
- package/ios/frozenproduct/small/light/components/progress.h +5 -5
- package/ios/frozenproduct/small/light/components/status.h +25 -25
- package/ios/frozenproduct/small/light/components/tab.h +6 -6
- package/ios/frozenproduct/small/light/components/table.h +8 -8
- package/ios/product/large/dark/components/form.h +1 -1
- package/ios/product/large/light/components/form.h +1 -1
- package/ios/product/small/dark/components/button.h +51 -51
- package/ios/product/small/dark/components/container.h +76 -76
- package/ios/product/small/dark/components/form.h +48 -48
- package/ios/product/small/dark/components/link.h +1 -1
- package/ios/product/small/dark/components/nav.h +42 -42
- package/ios/product/small/dark/components/page.h +28 -28
- package/ios/product/small/dark/components/popover.h +12 -12
- package/ios/product/small/dark/components/profile.h +7 -7
- package/ios/product/small/dark/components/progress.h +5 -5
- package/ios/product/small/dark/components/status.h +10 -10
- package/ios/product/small/dark/components/tab.h +2 -2
- package/ios/product/small/dark/components/table.h +9 -9
- package/ios/product/small/light/components/button.h +51 -51
- package/ios/product/small/light/components/container.h +76 -76
- package/ios/product/small/light/components/form.h +48 -48
- package/ios/product/small/light/components/link.h +1 -1
- package/ios/product/small/light/components/nav.h +42 -42
- package/ios/product/small/light/components/page.h +28 -28
- package/ios/product/small/light/components/popover.h +12 -12
- package/ios/product/small/light/components/profile.h +7 -7
- package/ios/product/small/light/components/progress.h +5 -5
- package/ios/product/small/light/components/status.h +10 -10
- package/ios/product/small/light/components/tab.h +2 -2
- package/ios/product/small/light/components/table.h +9 -9
- package/js/common/frozenproduct/large/dark/components/badge.js +8 -10
- package/js/common/frozenproduct/large/dark/components/button.js +81 -79
- package/js/common/frozenproduct/large/dark/components/container.js +31 -33
- package/js/common/frozenproduct/large/dark/components/form.js +42 -42
- package/js/common/frozenproduct/large/dark/components/link.js +4 -4
- package/js/common/frozenproduct/large/dark/components/nav.js +8 -8
- package/js/common/frozenproduct/large/dark/components/popover.js +14 -20
- package/js/common/frozenproduct/large/dark/components/progress.js +12 -12
- package/js/common/frozenproduct/large/dark/components/status.js +78 -76
- package/js/common/frozenproduct/large/dark/components/tab.js +19 -19
- package/js/common/frozenproduct/large/dark/components/table.js +24 -28
- package/js/common/frozenproduct/large/light/components/badge.js +8 -10
- package/js/common/frozenproduct/large/light/components/button.js +96 -94
- package/js/common/frozenproduct/large/light/components/container.js +33 -35
- package/js/common/frozenproduct/large/light/components/form.js +46 -46
- package/js/common/frozenproduct/large/light/components/link.js +6 -6
- package/js/common/frozenproduct/large/light/components/nav.js +9 -9
- package/js/common/frozenproduct/large/light/components/popover.js +18 -24
- package/js/common/frozenproduct/large/light/components/progress.js +15 -15
- package/js/common/frozenproduct/large/light/components/status.js +83 -81
- package/js/common/frozenproduct/large/light/components/tab.js +20 -20
- package/js/common/frozenproduct/large/light/components/table.js +24 -28
- package/js/common/frozenproduct/small/dark/components/badge.js +8 -10
- package/js/common/frozenproduct/small/dark/components/button.js +81 -79
- package/js/common/frozenproduct/small/dark/components/container.js +31 -33
- package/js/common/frozenproduct/small/dark/components/form.js +42 -42
- package/js/common/frozenproduct/small/dark/components/link.js +4 -4
- package/js/common/frozenproduct/small/dark/components/nav.js +8 -8
- package/js/common/frozenproduct/small/dark/components/popover.js +14 -20
- package/js/common/frozenproduct/small/dark/components/progress.js +12 -12
- package/js/common/frozenproduct/small/dark/components/status.js +78 -76
- package/js/common/frozenproduct/small/dark/components/tab.js +19 -19
- package/js/common/frozenproduct/small/dark/components/table.js +24 -28
- package/js/common/frozenproduct/small/light/components/badge.js +8 -10
- package/js/common/frozenproduct/small/light/components/button.js +96 -94
- package/js/common/frozenproduct/small/light/components/container.js +33 -35
- package/js/common/frozenproduct/small/light/components/form.js +46 -46
- package/js/common/frozenproduct/small/light/components/link.js +6 -6
- package/js/common/frozenproduct/small/light/components/nav.js +9 -9
- package/js/common/frozenproduct/small/light/components/popover.js +18 -24
- package/js/common/frozenproduct/small/light/components/progress.js +15 -15
- package/js/common/frozenproduct/small/light/components/status.js +83 -81
- package/js/common/frozenproduct/small/light/components/tab.js +20 -20
- package/js/common/frozenproduct/small/light/components/table.js +24 -28
- package/js/common/product/large/dark/components/form.js +2 -2
- package/js/common/product/large/light/components/form.js +2 -2
- package/js/common/product/small/dark/components/button.js +51 -51
- package/js/common/product/small/dark/components/container.js +76 -76
- package/js/common/product/small/dark/components/form.js +49 -49
- package/js/common/product/small/dark/components/link.js +1 -1
- package/js/common/product/small/dark/components/nav.js +42 -42
- package/js/common/product/small/dark/components/page.js +28 -28
- package/js/common/product/small/dark/components/popover.js +12 -12
- package/js/common/product/small/dark/components/profile.js +7 -7
- package/js/common/product/small/dark/components/progress.js +5 -5
- package/js/common/product/small/dark/components/status.js +10 -10
- package/js/common/product/small/dark/components/tab.js +2 -2
- package/js/common/product/small/dark/components/table.js +9 -9
- package/js/common/product/small/light/components/button.js +51 -51
- package/js/common/product/small/light/components/container.js +76 -76
- package/js/common/product/small/light/components/form.js +49 -49
- package/js/common/product/small/light/components/link.js +1 -1
- package/js/common/product/small/light/components/nav.js +42 -42
- package/js/common/product/small/light/components/page.js +28 -28
- package/js/common/product/small/light/components/popover.js +12 -12
- package/js/common/product/small/light/components/profile.js +7 -7
- package/js/common/product/small/light/components/progress.js +5 -5
- package/js/common/product/small/light/components/status.js +10 -10
- package/js/common/product/small/light/components/tab.js +2 -2
- package/js/common/product/small/light/components/table.js +9 -9
- package/js/es6/frozenproduct/large/dark/components/badge.js +2 -2
- package/js/es6/frozenproduct/large/dark/components/button.js +15 -15
- package/js/es6/frozenproduct/large/dark/components/container.js +9 -9
- package/js/es6/frozenproduct/large/dark/components/form.d.ts +1 -1
- package/js/es6/frozenproduct/large/dark/components/form.js +11 -11
- package/js/es6/frozenproduct/large/dark/components/nav.js +2 -2
- package/js/es6/frozenproduct/large/dark/components/popover.js +2 -2
- package/js/es6/frozenproduct/large/dark/components/progress.js +2 -2
- package/js/es6/frozenproduct/large/dark/components/status.js +20 -20
- package/js/es6/frozenproduct/large/dark/components/tab.js +5 -5
- package/js/es6/frozenproduct/large/dark/components/table.js +8 -8
- package/js/es6/frozenproduct/large/light/components/badge.js +2 -2
- package/js/es6/frozenproduct/large/light/components/button.js +30 -30
- package/js/es6/frozenproduct/large/light/components/container.js +11 -11
- package/js/es6/frozenproduct/large/light/components/form.d.ts +1 -1
- package/js/es6/frozenproduct/large/light/components/form.js +15 -15
- package/js/es6/frozenproduct/large/light/components/link.js +2 -2
- package/js/es6/frozenproduct/large/light/components/nav.js +3 -3
- package/js/es6/frozenproduct/large/light/components/popover.js +6 -6
- package/js/es6/frozenproduct/large/light/components/progress.js +5 -5
- package/js/es6/frozenproduct/large/light/components/status.js +25 -25
- package/js/es6/frozenproduct/large/light/components/tab.js +6 -6
- package/js/es6/frozenproduct/large/light/components/table.js +8 -8
- package/js/es6/frozenproduct/small/dark/components/badge.js +2 -2
- package/js/es6/frozenproduct/small/dark/components/button.js +15 -15
- package/js/es6/frozenproduct/small/dark/components/container.js +9 -9
- package/js/es6/frozenproduct/small/dark/components/form.d.ts +1 -1
- package/js/es6/frozenproduct/small/dark/components/form.js +11 -11
- package/js/es6/frozenproduct/small/dark/components/nav.js +2 -2
- package/js/es6/frozenproduct/small/dark/components/popover.js +2 -2
- package/js/es6/frozenproduct/small/dark/components/progress.js +2 -2
- package/js/es6/frozenproduct/small/dark/components/status.js +20 -20
- package/js/es6/frozenproduct/small/dark/components/tab.js +5 -5
- package/js/es6/frozenproduct/small/dark/components/table.js +8 -8
- package/js/es6/frozenproduct/small/light/components/badge.js +2 -2
- package/js/es6/frozenproduct/small/light/components/button.js +30 -30
- package/js/es6/frozenproduct/small/light/components/container.js +11 -11
- package/js/es6/frozenproduct/small/light/components/form.d.ts +1 -1
- package/js/es6/frozenproduct/small/light/components/form.js +15 -15
- package/js/es6/frozenproduct/small/light/components/link.js +2 -2
- package/js/es6/frozenproduct/small/light/components/nav.js +3 -3
- package/js/es6/frozenproduct/small/light/components/popover.js +6 -6
- package/js/es6/frozenproduct/small/light/components/progress.js +5 -5
- package/js/es6/frozenproduct/small/light/components/status.js +25 -25
- package/js/es6/frozenproduct/small/light/components/tab.js +6 -6
- package/js/es6/frozenproduct/small/light/components/table.js +8 -8
- package/js/es6/product/large/dark/components/form.js +1 -1
- package/js/es6/product/large/light/components/form.js +1 -1
- package/js/es6/product/small/dark/components/button.js +51 -51
- package/js/es6/product/small/dark/components/container.js +76 -76
- package/js/es6/product/small/dark/components/form.js +48 -48
- package/js/es6/product/small/dark/components/link.js +1 -1
- package/js/es6/product/small/dark/components/nav.js +42 -42
- package/js/es6/product/small/dark/components/page.js +28 -28
- package/js/es6/product/small/dark/components/popover.js +12 -12
- package/js/es6/product/small/dark/components/profile.js +7 -7
- package/js/es6/product/small/dark/components/progress.js +5 -5
- package/js/es6/product/small/dark/components/status.js +10 -10
- package/js/es6/product/small/dark/components/tab.js +2 -2
- package/js/es6/product/small/dark/components/table.js +9 -9
- package/js/es6/product/small/light/components/button.js +51 -51
- package/js/es6/product/small/light/components/container.js +76 -76
- package/js/es6/product/small/light/components/form.js +48 -48
- package/js/es6/product/small/light/components/link.js +1 -1
- package/js/es6/product/small/light/components/nav.js +42 -42
- package/js/es6/product/small/light/components/page.js +28 -28
- package/js/es6/product/small/light/components/popover.js +12 -12
- package/js/es6/product/small/light/components/profile.js +7 -7
- package/js/es6/product/small/light/components/progress.js +5 -5
- package/js/es6/product/small/light/components/status.js +10 -10
- package/js/es6/product/small/light/components/tab.js +2 -2
- package/js/es6/product/small/light/components/table.js +9 -9
- package/js/umd/frozenproduct/large/dark/components/badge.js +8 -10
- package/js/umd/frozenproduct/large/dark/components/button.js +86 -79
- package/js/umd/frozenproduct/large/dark/components/container.js +31 -33
- package/js/umd/frozenproduct/large/dark/components/form.js +42 -42
- package/js/umd/frozenproduct/large/dark/components/link.js +4 -4
- package/js/umd/frozenproduct/large/dark/components/nav.js +9 -8
- package/js/umd/frozenproduct/large/dark/components/popover.js +14 -20
- package/js/umd/frozenproduct/large/dark/components/progress.js +12 -12
- package/js/umd/frozenproduct/large/dark/components/status.js +78 -76
- package/js/umd/frozenproduct/large/dark/components/tab.js +19 -19
- package/js/umd/frozenproduct/large/dark/components/table.js +25 -28
- package/js/umd/frozenproduct/large/light/components/badge.js +8 -10
- package/js/umd/frozenproduct/large/light/components/button.js +101 -94
- package/js/umd/frozenproduct/large/light/components/container.js +33 -35
- package/js/umd/frozenproduct/large/light/components/form.js +46 -46
- package/js/umd/frozenproduct/large/light/components/link.js +6 -6
- package/js/umd/frozenproduct/large/light/components/nav.js +10 -9
- package/js/umd/frozenproduct/large/light/components/popover.js +18 -24
- package/js/umd/frozenproduct/large/light/components/progress.js +15 -15
- package/js/umd/frozenproduct/large/light/components/status.js +83 -81
- package/js/umd/frozenproduct/large/light/components/tab.js +20 -20
- package/js/umd/frozenproduct/large/light/components/table.js +25 -28
- package/js/umd/frozenproduct/small/dark/components/badge.js +8 -10
- package/js/umd/frozenproduct/small/dark/components/button.js +86 -79
- package/js/umd/frozenproduct/small/dark/components/container.js +31 -33
- package/js/umd/frozenproduct/small/dark/components/form.js +42 -42
- package/js/umd/frozenproduct/small/dark/components/link.js +4 -4
- package/js/umd/frozenproduct/small/dark/components/nav.js +9 -8
- package/js/umd/frozenproduct/small/dark/components/popover.js +14 -20
- package/js/umd/frozenproduct/small/dark/components/progress.js +12 -12
- package/js/umd/frozenproduct/small/dark/components/status.js +78 -76
- package/js/umd/frozenproduct/small/dark/components/tab.js +19 -19
- package/js/umd/frozenproduct/small/dark/components/table.js +25 -28
- package/js/umd/frozenproduct/small/light/components/badge.js +8 -10
- package/js/umd/frozenproduct/small/light/components/button.js +101 -94
- package/js/umd/frozenproduct/small/light/components/container.js +33 -35
- package/js/umd/frozenproduct/small/light/components/form.js +46 -46
- package/js/umd/frozenproduct/small/light/components/link.js +6 -6
- package/js/umd/frozenproduct/small/light/components/nav.js +10 -9
- package/js/umd/frozenproduct/small/light/components/popover.js +18 -24
- package/js/umd/frozenproduct/small/light/components/progress.js +15 -15
- package/js/umd/frozenproduct/small/light/components/status.js +83 -81
- package/js/umd/frozenproduct/small/light/components/tab.js +20 -20
- package/js/umd/frozenproduct/small/light/components/table.js +25 -28
- package/js/umd/product/large/dark/components/form.js +2 -2
- package/js/umd/product/large/light/components/form.js +2 -2
- package/js/umd/product/small/dark/components/button.js +51 -51
- package/js/umd/product/small/dark/components/container.js +76 -76
- package/js/umd/product/small/dark/components/form.js +49 -49
- package/js/umd/product/small/dark/components/link.js +1 -1
- package/js/umd/product/small/dark/components/nav.js +42 -42
- package/js/umd/product/small/dark/components/page.js +28 -28
- package/js/umd/product/small/dark/components/popover.js +12 -12
- package/js/umd/product/small/dark/components/profile.js +7 -7
- package/js/umd/product/small/dark/components/progress.js +5 -5
- package/js/umd/product/small/dark/components/status.js +10 -10
- package/js/umd/product/small/dark/components/tab.js +2 -2
- package/js/umd/product/small/dark/components/table.js +9 -9
- package/js/umd/product/small/light/components/button.js +51 -51
- package/js/umd/product/small/light/components/container.js +76 -76
- package/js/umd/product/small/light/components/form.js +49 -49
- package/js/umd/product/small/light/components/link.js +1 -1
- package/js/umd/product/small/light/components/nav.js +42 -42
- package/js/umd/product/small/light/components/page.js +28 -28
- package/js/umd/product/small/light/components/popover.js +12 -12
- package/js/umd/product/small/light/components/profile.js +7 -7
- package/js/umd/product/small/light/components/progress.js +5 -5
- package/js/umd/product/small/light/components/status.js +10 -10
- package/js/umd/product/small/light/components/tab.js +2 -2
- package/js/umd/product/small/light/components/table.js +9 -9
- package/json/flat/frozenproduct/large/dark/components/badge.json +2 -2
- package/json/flat/frozenproduct/large/dark/components/button.json +15 -15
- package/json/flat/frozenproduct/large/dark/components/container.json +9 -9
- package/json/flat/frozenproduct/large/dark/components/form.json +11 -11
- package/json/flat/frozenproduct/large/dark/components/nav.json +2 -2
- package/json/flat/frozenproduct/large/dark/components/popover.json +2 -2
- package/json/flat/frozenproduct/large/dark/components/progress.json +2 -2
- package/json/flat/frozenproduct/large/dark/components/status.json +20 -20
- package/json/flat/frozenproduct/large/dark/components/tab.json +5 -5
- package/json/flat/frozenproduct/large/dark/components/table.json +8 -8
- package/json/flat/frozenproduct/large/light/components/badge.json +2 -2
- package/json/flat/frozenproduct/large/light/components/button.json +30 -30
- package/json/flat/frozenproduct/large/light/components/container.json +11 -11
- package/json/flat/frozenproduct/large/light/components/form.json +15 -15
- package/json/flat/frozenproduct/large/light/components/link.json +2 -2
- package/json/flat/frozenproduct/large/light/components/nav.json +3 -3
- package/json/flat/frozenproduct/large/light/components/popover.json +6 -6
- package/json/flat/frozenproduct/large/light/components/progress.json +5 -5
- package/json/flat/frozenproduct/large/light/components/status.json +25 -25
- package/json/flat/frozenproduct/large/light/components/tab.json +6 -6
- package/json/flat/frozenproduct/large/light/components/table.json +8 -8
- package/json/flat/frozenproduct/small/dark/components/badge.json +2 -2
- package/json/flat/frozenproduct/small/dark/components/button.json +15 -15
- package/json/flat/frozenproduct/small/dark/components/container.json +9 -9
- package/json/flat/frozenproduct/small/dark/components/form.json +11 -11
- package/json/flat/frozenproduct/small/dark/components/nav.json +2 -2
- package/json/flat/frozenproduct/small/dark/components/popover.json +2 -2
- package/json/flat/frozenproduct/small/dark/components/progress.json +2 -2
- package/json/flat/frozenproduct/small/dark/components/status.json +20 -20
- package/json/flat/frozenproduct/small/dark/components/tab.json +5 -5
- package/json/flat/frozenproduct/small/dark/components/table.json +8 -8
- package/json/flat/frozenproduct/small/light/components/badge.json +2 -2
- package/json/flat/frozenproduct/small/light/components/button.json +30 -30
- package/json/flat/frozenproduct/small/light/components/container.json +11 -11
- package/json/flat/frozenproduct/small/light/components/form.json +15 -15
- package/json/flat/frozenproduct/small/light/components/link.json +2 -2
- package/json/flat/frozenproduct/small/light/components/nav.json +3 -3
- package/json/flat/frozenproduct/small/light/components/popover.json +6 -6
- package/json/flat/frozenproduct/small/light/components/progress.json +5 -5
- package/json/flat/frozenproduct/small/light/components/status.json +25 -25
- package/json/flat/frozenproduct/small/light/components/tab.json +6 -6
- package/json/flat/frozenproduct/small/light/components/table.json +8 -8
- package/json/flat/product/large/dark/components/form.json +1 -1
- package/json/flat/product/large/light/components/form.json +1 -1
- package/json/flat/product/small/dark/components/button.json +51 -51
- package/json/flat/product/small/dark/components/container.json +76 -76
- package/json/flat/product/small/dark/components/form.json +48 -48
- package/json/flat/product/small/dark/components/link.json +1 -1
- package/json/flat/product/small/dark/components/nav.json +42 -42
- package/json/flat/product/small/dark/components/page.json +28 -28
- package/json/flat/product/small/dark/components/popover.json +12 -12
- package/json/flat/product/small/dark/components/profile.json +7 -7
- package/json/flat/product/small/dark/components/progress.json +5 -5
- package/json/flat/product/small/dark/components/status.json +10 -10
- package/json/flat/product/small/dark/components/tab.json +2 -2
- package/json/flat/product/small/dark/components/table.json +9 -9
- package/json/flat/product/small/light/components/button.json +51 -51
- package/json/flat/product/small/light/components/container.json +76 -76
- package/json/flat/product/small/light/components/form.json +48 -48
- package/json/flat/product/small/light/components/link.json +1 -1
- package/json/flat/product/small/light/components/nav.json +42 -42
- package/json/flat/product/small/light/components/page.json +28 -28
- package/json/flat/product/small/light/components/popover.json +12 -12
- package/json/flat/product/small/light/components/profile.json +7 -7
- package/json/flat/product/small/light/components/progress.json +5 -5
- package/json/flat/product/small/light/components/status.json +10 -10
- package/json/flat/product/small/light/components/tab.json +2 -2
- package/json/flat/product/small/light/components/table.json +9 -9
- package/json/nested/frozenproduct/large/dark/components/badge.json +2 -2
- package/json/nested/frozenproduct/large/dark/components/button.json +15 -15
- package/json/nested/frozenproduct/large/dark/components/container.json +9 -9
- package/json/nested/frozenproduct/large/dark/components/form.json +11 -11
- package/json/nested/frozenproduct/large/dark/components/nav.json +2 -2
- package/json/nested/frozenproduct/large/dark/components/popover.json +2 -2
- package/json/nested/frozenproduct/large/dark/components/progress.json +2 -2
- package/json/nested/frozenproduct/large/dark/components/status.json +20 -20
- package/json/nested/frozenproduct/large/dark/components/tab.json +5 -5
- package/json/nested/frozenproduct/large/dark/components/table.json +8 -8
- package/json/nested/frozenproduct/large/light/components/badge.json +2 -2
- package/json/nested/frozenproduct/large/light/components/button.json +30 -30
- package/json/nested/frozenproduct/large/light/components/container.json +11 -11
- package/json/nested/frozenproduct/large/light/components/form.json +15 -15
- package/json/nested/frozenproduct/large/light/components/link.json +2 -2
- package/json/nested/frozenproduct/large/light/components/nav.json +3 -3
- package/json/nested/frozenproduct/large/light/components/popover.json +6 -6
- package/json/nested/frozenproduct/large/light/components/progress.json +5 -5
- package/json/nested/frozenproduct/large/light/components/status.json +25 -25
- package/json/nested/frozenproduct/large/light/components/tab.json +6 -6
- package/json/nested/frozenproduct/large/light/components/table.json +8 -8
- package/json/nested/frozenproduct/small/dark/components/badge.json +2 -2
- package/json/nested/frozenproduct/small/dark/components/button.json +15 -15
- package/json/nested/frozenproduct/small/dark/components/container.json +9 -9
- package/json/nested/frozenproduct/small/dark/components/form.json +11 -11
- package/json/nested/frozenproduct/small/dark/components/nav.json +2 -2
- package/json/nested/frozenproduct/small/dark/components/popover.json +2 -2
- package/json/nested/frozenproduct/small/dark/components/progress.json +2 -2
- package/json/nested/frozenproduct/small/dark/components/status.json +20 -20
- package/json/nested/frozenproduct/small/dark/components/tab.json +5 -5
- package/json/nested/frozenproduct/small/dark/components/table.json +8 -8
- package/json/nested/frozenproduct/small/light/components/badge.json +2 -2
- package/json/nested/frozenproduct/small/light/components/button.json +30 -30
- package/json/nested/frozenproduct/small/light/components/container.json +11 -11
- package/json/nested/frozenproduct/small/light/components/form.json +15 -15
- package/json/nested/frozenproduct/small/light/components/link.json +2 -2
- package/json/nested/frozenproduct/small/light/components/nav.json +3 -3
- package/json/nested/frozenproduct/small/light/components/popover.json +6 -6
- package/json/nested/frozenproduct/small/light/components/progress.json +5 -5
- package/json/nested/frozenproduct/small/light/components/status.json +25 -25
- package/json/nested/frozenproduct/small/light/components/tab.json +6 -6
- package/json/nested/frozenproduct/small/light/components/table.json +8 -8
- package/json/nested/product/large/dark/components/form.json +1 -1
- package/json/nested/product/large/light/components/form.json +1 -1
- package/json/nested/product/small/dark/components/button.json +51 -51
- package/json/nested/product/small/dark/components/container.json +76 -76
- package/json/nested/product/small/dark/components/form.json +48 -48
- package/json/nested/product/small/dark/components/link.json +1 -1
- package/json/nested/product/small/dark/components/nav.json +42 -42
- package/json/nested/product/small/dark/components/page.json +28 -28
- package/json/nested/product/small/dark/components/popover.json +12 -12
- package/json/nested/product/small/dark/components/profile.json +7 -7
- package/json/nested/product/small/dark/components/progress.json +5 -5
- package/json/nested/product/small/dark/components/status.json +10 -10
- package/json/nested/product/small/dark/components/tab.json +2 -2
- package/json/nested/product/small/dark/components/table.json +9 -9
- package/json/nested/product/small/light/components/button.json +51 -51
- package/json/nested/product/small/light/components/container.json +76 -76
- package/json/nested/product/small/light/components/form.json +48 -48
- package/json/nested/product/small/light/components/link.json +1 -1
- package/json/nested/product/small/light/components/nav.json +42 -42
- package/json/nested/product/small/light/components/page.json +28 -28
- package/json/nested/product/small/light/components/popover.json +12 -12
- package/json/nested/product/small/light/components/profile.json +7 -7
- package/json/nested/product/small/light/components/progress.json +5 -5
- package/json/nested/product/small/light/components/status.json +10 -10
- package/json/nested/product/small/light/components/tab.json +2 -2
- package/json/nested/product/small/light/components/table.json +9 -9
- package/package.json +1 -1
- package/sage-design-tokens-15.2.2.tgz +0 -0
- package/scss/frozenproduct/large/components/badge.scss +3 -3
- package/scss/frozenproduct/large/components/button.scss +32 -32
- package/scss/frozenproduct/large/components/container.scss +11 -11
- package/scss/frozenproduct/large/components/form.scss +14 -14
- package/scss/frozenproduct/large/components/link.scss +2 -2
- package/scss/frozenproduct/large/components/nav.scss +3 -3
- package/scss/frozenproduct/large/components/popover.scss +6 -6
- package/scss/frozenproduct/large/components/progress.scss +5 -5
- package/scss/frozenproduct/large/components/status.scss +25 -25
- package/scss/frozenproduct/large/components/tab.scss +7 -7
- package/scss/frozenproduct/large/components/table.scss +8 -8
- package/scss/frozenproduct/small/components/badge.scss +3 -3
- package/scss/frozenproduct/small/components/button.scss +38 -38
- package/scss/frozenproduct/small/components/container.scss +21 -21
- package/scss/frozenproduct/small/components/form.scss +17 -17
- package/scss/frozenproduct/small/components/link.scss +4 -4
- package/scss/frozenproduct/small/components/nav.scss +8 -8
- package/scss/frozenproduct/small/components/page.scss +1 -1
- package/scss/frozenproduct/small/components/popover.scss +6 -6
- package/scss/frozenproduct/small/components/progress.scss +9 -9
- package/scss/frozenproduct/small/components/status.scss +28 -28
- package/scss/frozenproduct/small/components/tab.scss +13 -13
- package/scss/frozenproduct/small/components/table.scss +15 -15
- package/scss/product/large/components/form.scss +1 -1
- package/scss/product/small/components/form.scss +1 -1
- package/sage-design-tokens-15.2.0.tgz +0 -0
|
@@ -776,9 +776,10 @@
|
|
|
776
776
|
--modes-color-modifier-contrast-more-dark: #FFFFFF;
|
|
777
777
|
|
|
778
778
|
/* badge component tokens */
|
|
779
|
+
--badge-color-notification-bg-default: light-dark(var(--modes-color-status-caution-frozenglobal-default-light), var(--modes-color-status-caution-frozenglobal-default-dark));
|
|
779
780
|
--badge-radius-badge: var(--global-radius-circle); /* Badge */
|
|
780
|
-
--badge-color-notification-bg-default: light-dark(var(--modes-color-status-negative-default-light), var(--modes-color-status-negative-default-dark)); /* Used in global nav notification badges */
|
|
781
781
|
--badge-color-notification-bg-alt: light-dark(var(--modes-color-status-info-default-light), var(--modes-color-status-info-default-dark));
|
|
782
|
+
--badge-color-notification-label-default: light-dark(var(--modes-color-generic-content-extreme-light), var(--modes-color-generic-content-extreme-dark));
|
|
782
783
|
--badge-color-notification-inverse-border-default: light-dark(var(--modes-color-generic-content-extreme-light), var(--modes-color-generic-content-extreme-dark));
|
|
783
784
|
--badge-color-notification-inverse-bg-default: light-dark(var(--modes-color-status-negative-inverse-default-light), var(--modes-color-status-negative-inverse-default-dark)); /* Used in global nav notification badges */
|
|
784
785
|
--badge-color-notification-inverse-bg-alt: light-dark(var(--modes-color-status-info-inverse-default-light), var(--modes-color-status-info-inverse-default-dark));
|
|
@@ -786,8 +787,7 @@
|
|
|
786
787
|
--badge-color-notification-inverse-label-alt: light-dark(var(--modes-color-generic-content-extreme-light), var(--modes-color-generic-content-extreme-dark));
|
|
787
788
|
--badge-typography-m: var(--global-typography-component-notification-m);
|
|
788
789
|
--badge-color-notification-border-default: light-dark(var(--modes-color-generic-content-nought-light), var(--modes-color-generic-content-nought-dark));
|
|
789
|
-
--badge-color-notification-label-
|
|
790
|
-
--badge-color-notification-label-alt: light-dark(var(--modes-color-generic-content-nought-light), var(--modes-color-generic-content-nought-dark));
|
|
790
|
+
--badge-color-notification-label-alt: light-dark(var(--modes-color-generic-fg-nought-light), var(--modes-color-generic-fg-nought-dark));
|
|
791
791
|
--badge-size-micro-dot: var(--global-size-micro-m); /* Micro dot badge size */
|
|
792
792
|
--badge-size-micro-numbered-min: var(--global-size-macro-xxs); /* Micro dot badge size with numbering */
|
|
793
793
|
--badge-size-micro-numbered-max: var(--global-size-macro-s); /* Micro dot badge size max width */
|
|
@@ -831,9 +831,15 @@
|
|
|
831
831
|
--button-color-typical-primary-inverse-label-hover: light-dark(var(--modes-color-interactive-primary-inverse-with-default-light), var(--modes-color-interactive-primary-inverse-with-default-dark));
|
|
832
832
|
--button-color-typical-secondary-inverse-border-disabled: light-dark(var(--modes-color-interactive-inactive-inverse-default-light), var(--modes-color-interactive-inactive-inverse-default-dark));
|
|
833
833
|
--button-color-typical-secondary-inverse-label-disabled: light-dark(var(--modes-color-interactive-inactive-inverse-content-light), var(--modes-color-interactive-inactive-inverse-content-dark));
|
|
834
|
+
--button-color-typical-tertiary-bg-enabled: light-dark(var(--modes-color-none-light), var(--modes-color-none-dark));
|
|
835
|
+
--button-color-typical-tertiary-border-disabled: light-dark(var(--modes-color-none-light), var(--modes-color-none-dark));
|
|
836
|
+
--button-color-typical-tertiary-border-enabled: light-dark(var(--modes-color-none-light), var(--modes-color-none-dark));
|
|
837
|
+
--button-color-typical-tertiary-border-hover: light-dark(var(--modes-color-none-light), var(--modes-color-none-dark));
|
|
834
838
|
--button-color-typical-tertiary-inverse-border-disabled: light-dark(var(--modes-color-interactive-inactive-inverse-default-light), var(--modes-color-interactive-inactive-inverse-default-dark));
|
|
835
839
|
--button-color-typical-tertiary-inverse-label-disabled: light-dark(var(--modes-color-interactive-inactive-inverse-content-light), var(--modes-color-interactive-inactive-inverse-content-dark));
|
|
840
|
+
--button-color-typical-subtle-label-enabled: light-dark(var(--modes-color-interactive-monochrome-frozen-default-light), var(--modes-color-interactive-monochrome-frozen-default-dark));
|
|
836
841
|
--button-color-typical-subtle-inverse-label-disabled: light-dark(var(--modes-color-interactive-inactive-inverse-content-light), var(--modes-color-interactive-inactive-inverse-content-dark));
|
|
842
|
+
--button-color-typical-toggle-border-enabled: light-dark(var(--modes-color-interactive-data-entry-frozen-with-default-light), var(--modes-color-interactive-data-entry-frozen-with-default-dark));
|
|
837
843
|
--button-typography-primary-s: var(--global-typography-component-firm-s);
|
|
838
844
|
--button-typography-primary-m: var(--global-typography-component-firm-m);
|
|
839
845
|
--button-typography-primary-l: var(--global-typography-component-firm-l);
|
|
@@ -855,20 +861,15 @@
|
|
|
855
861
|
--button-color-destructive-secondary-bg-hover: light-dark(var(--modes-color-interactive-danger-hover-alt-light), var(--modes-color-interactive-danger-hover-alt-dark));
|
|
856
862
|
--button-color-destructive-secondary-border-hover: light-dark(var(--modes-color-interactive-danger-hover-light), var(--modes-color-interactive-danger-hover-dark));
|
|
857
863
|
--button-color-destructive-secondary-label-hover: light-dark(var(--modes-color-interactive-danger-hover-light), var(--modes-color-interactive-danger-hover-dark));
|
|
858
|
-
--button-color-typical-primary-bg-enabled: light-dark(var(--modes-color-interactive-primary-default-light), var(--modes-color-interactive-primary-default-dark));
|
|
864
|
+
--button-color-typical-primary-bg-enabled: light-dark(var(--modes-color-interactive-primary-frozen-default-light), var(--modes-color-interactive-primary-frozen-default-dark));
|
|
859
865
|
--button-color-typical-primary-inverse-bg-enabled: light-dark(var(--modes-color-interactive-primary-inverse-default-light), var(--modes-color-interactive-primary-inverse-default-dark));
|
|
860
|
-
--button-color-typical-secondary-
|
|
861
|
-
--button-color-typical-secondary-label-
|
|
862
|
-
--button-color-typical-tertiary-
|
|
863
|
-
--button-color-typical-tertiary-label-active: light-dark(var(--modes-color-interactive-monochrome-with-active-alt-light), var(--modes-color-interactive-monochrome-with-active-alt-dark));
|
|
864
|
-
--button-color-typical-tertiary-label-hover: light-dark(var(--modes-color-interactive-monochrome-with-hover-light), var(--modes-color-interactive-monochrome-with-hover-dark));
|
|
866
|
+
--button-color-typical-secondary-border-enabled: light-dark(var(--modes-color-interactive-primary-frozen-default-light), var(--modes-color-interactive-primary-frozen-default-dark));
|
|
867
|
+
--button-color-typical-secondary-label-enabled: light-dark(var(--modes-color-interactive-primary-frozen-default-light), var(--modes-color-interactive-primary-frozen-default-dark));
|
|
868
|
+
--button-color-typical-tertiary-label-enabled: light-dark(var(--modes-color-interactive-primary-frozen-default-light), var(--modes-color-interactive-primary-frozen-default-dark));
|
|
865
869
|
--button-color-typical-tertiary-inverse-bg-enabled: var(--button-color-none);
|
|
866
|
-
--button-color-typical-subtle-
|
|
867
|
-
--button-color-typical-
|
|
868
|
-
--button-color-typical-
|
|
869
|
-
--button-color-typical-toggle-bg-active: light-dark(var(--modes-color-interactive-monochrome-active-light), var(--modes-color-interactive-monochrome-active-dark));
|
|
870
|
-
--button-color-typical-toggle-bg-hover: light-dark(var(--modes-color-interactive-monochrome-hover-alt-light), var(--modes-color-interactive-monochrome-hover-alt-dark));
|
|
871
|
-
--button-color-typical-toggle-label-hover: light-dark(var(--modes-color-interactive-monochrome-with-hover-light), var(--modes-color-interactive-monochrome-with-hover-dark));
|
|
870
|
+
--button-color-typical-subtle-label-active: light-dark(var(--modes-color-interactive-monochrome-frozen-active-light), var(--modes-color-interactive-monochrome-frozen-active-dark));
|
|
871
|
+
--button-color-typical-toggle-bg-active: light-dark(var(--modes-color-interactive-monochrome-frozen-active-light), var(--modes-color-interactive-monochrome-frozen-active-dark));
|
|
872
|
+
--button-color-typical-toggle-label-enabled: light-dark(var(--modes-color-interactive-monochrome-frozen-default-alt-light), var(--modes-color-interactive-monochrome-frozen-default-alt-dark));
|
|
872
873
|
--button-color-video-bg-blur: light-dark(var(--modes-color-interactive-monochrome-hover-alt-light), var(--modes-color-interactive-monochrome-hover-alt-dark));
|
|
873
874
|
--button-size-split: var(--global-size-micro-xxs); /* Split button (divider width) */
|
|
874
875
|
--button-size-xs: var(--global-size-macro-xs); /* min-height on XS Buttons */
|
|
@@ -1010,19 +1011,19 @@
|
|
|
1010
1011
|
--button-color-ai-label-enabled: light-dark(var(--modes-color-interactive-monochrome-default-light), var(--modes-color-interactive-monochrome-default-dark));
|
|
1011
1012
|
--button-color-destructive-primary-label-disabled: light-dark(var(--modes-color-interactive-inactive-content-alt-light), var(--modes-color-interactive-inactive-content-alt-dark));
|
|
1012
1013
|
--button-color-destructive-secondary-label-disabled: light-dark(var(--modes-color-interactive-inactive-content-light), var(--modes-color-interactive-inactive-content-dark));
|
|
1013
|
-
--button-color-typical-primary-bg-active: light-dark(var(--modes-color-interactive-primary-active-light), var(--modes-color-interactive-primary-active-dark));
|
|
1014
|
-
--button-color-typical-primary-bg-hover: light-dark(var(--modes-color-interactive-primary-hover-light), var(--modes-color-interactive-primary-hover-dark));
|
|
1014
|
+
--button-color-typical-primary-bg-active: light-dark(var(--modes-color-interactive-primary-frozen-active-light), var(--modes-color-interactive-primary-frozen-active-dark));
|
|
1015
|
+
--button-color-typical-primary-bg-hover: light-dark(var(--modes-color-interactive-primary-frozen-hover-light), var(--modes-color-interactive-primary-frozen-hover-dark));
|
|
1015
1016
|
--button-color-typical-primary-label-disabled: light-dark(var(--modes-color-interactive-inactive-content-alt-light), var(--modes-color-interactive-inactive-content-alt-dark));
|
|
1016
1017
|
--button-color-typical-primary-inverse-bg-active: light-dark(var(--modes-color-interactive-primary-inverse-active-light), var(--modes-color-interactive-primary-inverse-active-dark));
|
|
1017
1018
|
--button-color-typical-primary-inverse-bg-hover: light-dark(var(--modes-color-interactive-primary-inverse-hover-light), var(--modes-color-interactive-primary-inverse-hover-dark));
|
|
1018
|
-
--button-color-typical-secondary-bg-active: light-dark(var(--modes-color-interactive-primary-active-
|
|
1019
|
+
--button-color-typical-secondary-bg-active: light-dark(var(--modes-color-interactive-primary-frozen-active-light), var(--modes-color-interactive-primary-frozen-active-dark));
|
|
1019
1020
|
--button-color-typical-secondary-bg-enabled: light-dark(var(--modes-color-interactive-primary-default-alt3-light), var(--modes-color-interactive-primary-default-alt3-dark));
|
|
1020
|
-
--button-color-typical-secondary-bg-hover: light-dark(var(--modes-color-interactive-primary-hover-
|
|
1021
|
-
--button-color-typical-secondary-border-active: light-dark(var(--modes-color-interactive-primary-active-light), var(--modes-color-interactive-primary-active-dark));
|
|
1022
|
-
--button-color-typical-secondary-border-
|
|
1023
|
-
--button-color-typical-secondary-
|
|
1021
|
+
--button-color-typical-secondary-bg-hover: light-dark(var(--modes-color-interactive-primary-frozen-hover-light), var(--modes-color-interactive-primary-frozen-hover-dark));
|
|
1022
|
+
--button-color-typical-secondary-border-active: light-dark(var(--modes-color-interactive-primary-frozen-active-light), var(--modes-color-interactive-primary-frozen-active-dark));
|
|
1023
|
+
--button-color-typical-secondary-border-hover: light-dark(var(--modes-color-interactive-primary-frozen-hover-light), var(--modes-color-interactive-primary-frozen-hover-dark));
|
|
1024
|
+
--button-color-typical-secondary-label-active: light-dark(var(--modes-color-interactive-monochrome-frozen-with-active-light), var(--modes-color-interactive-monochrome-frozen-with-active-dark));
|
|
1024
1025
|
--button-color-typical-secondary-label-disabled: light-dark(var(--modes-color-interactive-inactive-content-light), var(--modes-color-interactive-inactive-content-dark));
|
|
1025
|
-
--button-color-typical-secondary-label-
|
|
1026
|
+
--button-color-typical-secondary-label-hover: light-dark(var(--modes-color-interactive-monochrome-frozen-with-hover-alt-light), var(--modes-color-interactive-monochrome-frozen-with-hover-alt-dark));
|
|
1026
1027
|
--button-color-typical-secondary-inverse-bg-active: light-dark(var(--modes-color-interactive-primary-inverse-active-alt-light), var(--modes-color-interactive-primary-inverse-active-alt-dark));
|
|
1027
1028
|
--button-color-typical-secondary-inverse-bg-enabled: light-dark(var(--modes-color-interactive-primary-inverse-default-alt3-light), var(--modes-color-interactive-primary-inverse-default-alt3-dark));
|
|
1028
1029
|
--button-color-typical-secondary-inverse-bg-hover: light-dark(var(--modes-color-interactive-primary-inverse-hover-alt-light), var(--modes-color-interactive-primary-inverse-hover-alt-dark));
|
|
@@ -1032,13 +1033,12 @@
|
|
|
1032
1033
|
--button-color-typical-secondary-inverse-label-active: light-dark(var(--modes-color-interactive-monochrome-inverse-with-active-alt-light), var(--modes-color-interactive-monochrome-inverse-with-active-alt-dark));
|
|
1033
1034
|
--button-color-typical-secondary-inverse-label-enabled: light-dark(var(--modes-color-interactive-monochrome-inverse-default-light), var(--modes-color-interactive-monochrome-inverse-default-dark));
|
|
1034
1035
|
--button-color-typical-secondary-inverse-label-hover: light-dark(var(--modes-color-interactive-monochrome-inverse-with-hover-light), var(--modes-color-interactive-monochrome-inverse-with-hover-dark));
|
|
1035
|
-
--button-color-typical-tertiary-bg-active: light-dark(var(--modes-color-interactive-primary-active-
|
|
1036
|
-
--button-color-typical-tertiary-bg-hover: light-dark(var(--modes-color-interactive-primary-hover-
|
|
1037
|
-
--button-color-typical-tertiary-border-active: light-dark(var(--modes-color-interactive-primary-active-light), var(--modes-color-interactive-primary-active-dark));
|
|
1038
|
-
--button-color-typical-tertiary-
|
|
1039
|
-
--button-color-typical-tertiary-border-hover: light-dark(var(--modes-color-interactive-primary-hover-light), var(--modes-color-interactive-primary-hover-dark));
|
|
1036
|
+
--button-color-typical-tertiary-bg-active: light-dark(var(--modes-color-interactive-primary-frozen-active-light), var(--modes-color-interactive-primary-frozen-active-dark));
|
|
1037
|
+
--button-color-typical-tertiary-bg-hover: light-dark(var(--modes-color-interactive-primary-frozen-hover-light), var(--modes-color-interactive-primary-frozen-hover-dark));
|
|
1038
|
+
--button-color-typical-tertiary-border-active: light-dark(var(--modes-color-interactive-primary-frozen-active-light), var(--modes-color-interactive-primary-frozen-active-dark));
|
|
1039
|
+
--button-color-typical-tertiary-label-active: light-dark(var(--modes-color-interactive-monochrome-frozen-with-active-light), var(--modes-color-interactive-monochrome-frozen-with-active-dark));
|
|
1040
1040
|
--button-color-typical-tertiary-label-disabled: light-dark(var(--modes-color-interactive-inactive-content-light), var(--modes-color-interactive-inactive-content-dark));
|
|
1041
|
-
--button-color-typical-tertiary-label-
|
|
1041
|
+
--button-color-typical-tertiary-label-hover: light-dark(var(--modes-color-interactive-monochrome-frozen-with-hover-alt-light), var(--modes-color-interactive-monochrome-frozen-with-hover-alt-dark));
|
|
1042
1042
|
--button-color-typical-tertiary-inverse-bg-active: light-dark(var(--modes-color-interactive-primary-inverse-active-alt-light), var(--modes-color-interactive-primary-inverse-active-alt-dark));
|
|
1043
1043
|
--button-color-typical-tertiary-inverse-bg-hover: light-dark(var(--modes-color-interactive-primary-inverse-hover-alt-light), var(--modes-color-interactive-primary-inverse-hover-alt-dark));
|
|
1044
1044
|
--button-color-typical-tertiary-inverse-border-active: light-dark(var(--modes-color-interactive-primary-inverse-active-light), var(--modes-color-interactive-primary-inverse-active-dark));
|
|
@@ -1047,17 +1047,19 @@
|
|
|
1047
1047
|
--button-color-typical-tertiary-inverse-label-active: light-dark(var(--modes-color-interactive-monochrome-inverse-with-active-alt-light), var(--modes-color-interactive-monochrome-inverse-with-active-alt-dark));
|
|
1048
1048
|
--button-color-typical-tertiary-inverse-label-enabled: light-dark(var(--modes-color-interactive-monochrome-inverse-default-light), var(--modes-color-interactive-monochrome-inverse-default-dark));
|
|
1049
1049
|
--button-color-typical-tertiary-inverse-label-hover: light-dark(var(--modes-color-interactive-monochrome-inverse-with-hover-light), var(--modes-color-interactive-monochrome-inverse-with-hover-dark));
|
|
1050
|
+
--button-color-typical-subtle-bg-active: light-dark(var(--modes-color-interactive-monochrome-frozen-active-alt-light), var(--modes-color-interactive-monochrome-frozen-active-alt-dark));
|
|
1051
|
+
--button-color-typical-subtle-bg-hover: light-dark(var(--modes-color-interactive-monochrome-frozen-hover-alt-light), var(--modes-color-interactive-monochrome-frozen-hover-alt-dark));
|
|
1050
1052
|
--button-color-typical-subtle-label-disabled: light-dark(var(--modes-color-interactive-inactive-content-light), var(--modes-color-interactive-inactive-content-dark));
|
|
1051
|
-
--button-color-typical-subtle-label-
|
|
1053
|
+
--button-color-typical-subtle-label-hover: light-dark(var(--modes-color-interactive-monochrome-frozen-with-hover-light), var(--modes-color-interactive-monochrome-frozen-with-hover-dark));
|
|
1052
1054
|
--button-color-typical-subtle-inverse-bg-hover: light-dark(var(--modes-color-interactive-monochrome-inverse-hover-alt-light), var(--modes-color-interactive-monochrome-inverse-hover-alt-dark));
|
|
1053
1055
|
--button-color-typical-subtle-inverse-label-active: light-dark(var(--modes-color-interactive-monochrome-inverse-with-active-alt-light), var(--modes-color-interactive-monochrome-inverse-with-active-alt-dark));
|
|
1054
1056
|
--button-color-typical-subtle-inverse-label-enabled: light-dark(var(--modes-color-interactive-monochrome-inverse-default-light), var(--modes-color-interactive-monochrome-inverse-default-dark));
|
|
1055
1057
|
--button-color-typical-subtle-inverse-label-hover: light-dark(var(--modes-color-interactive-monochrome-inverse-with-hover-light), var(--modes-color-interactive-monochrome-inverse-with-hover-dark));
|
|
1056
1058
|
--button-color-typical-toggle-label-active-disabled: light-dark(var(--modes-color-interactive-inactive-content-alt-light), var(--modes-color-interactive-inactive-content-alt-dark));
|
|
1057
|
-
--button-color-typical-toggle-
|
|
1058
|
-
--button-color-typical-toggle-label-active: light-dark(var(--modes-color-interactive-monochrome-with-active-light), var(--modes-color-interactive-monochrome-with-active-dark));
|
|
1059
|
+
--button-color-typical-toggle-bg-hover: light-dark(var(--modes-color-interactive-monochrome-frozen-hover-alt-light), var(--modes-color-interactive-monochrome-frozen-hover-alt-dark));
|
|
1060
|
+
--button-color-typical-toggle-label-active: light-dark(var(--modes-color-interactive-monochrome-frozen-with-active-light), var(--modes-color-interactive-monochrome-frozen-with-active-dark));
|
|
1059
1061
|
--button-color-typical-toggle-label-disabled: light-dark(var(--modes-color-interactive-inactive-content-light), var(--modes-color-interactive-inactive-content-dark));
|
|
1060
|
-
--button-color-typical-toggle-label-
|
|
1062
|
+
--button-color-typical-toggle-label-hover: light-dark(var(--modes-color-interactive-monochrome-frozen-with-hover-light), var(--modes-color-interactive-monochrome-frozen-with-hover-dark));
|
|
1061
1063
|
--button-color-video-primary-bg-enabled: light-dark(var(--modes-color-interactive-monochrome-with-default-light), var(--modes-color-interactive-monochrome-with-default-dark));
|
|
1062
1064
|
--button-color-video-primary-bg-hover: light-dark(var(--modes-color-interactive-monochrome-with-default-light), var(--modes-color-interactive-monochrome-with-default-dark));
|
|
1063
1065
|
--button-color-video-primary-label-enabled: light-dark(var(--modes-color-interactive-monochrome-default-light), var(--modes-color-interactive-monochrome-default-dark));
|
|
@@ -1102,8 +1104,6 @@
|
|
|
1102
1104
|
--button-color-destructive-secondary-border-disabled: light-dark(var(--modes-color-interactive-inactive-default-light), var(--modes-color-interactive-inactive-default-dark));
|
|
1103
1105
|
--button-color-typical-primary-bg-disabled: light-dark(var(--modes-color-interactive-inactive-default-light), var(--modes-color-interactive-inactive-default-dark));
|
|
1104
1106
|
--button-color-typical-secondary-border-disabled: light-dark(var(--modes-color-interactive-inactive-default-light), var(--modes-color-interactive-inactive-default-dark));
|
|
1105
|
-
--button-color-typical-tertiary-border-disabled: light-dark(var(--modes-color-interactive-inactive-default-light), var(--modes-color-interactive-inactive-default-dark));
|
|
1106
|
-
--button-color-typical-subtle-bg-active: light-dark(var(--modes-color-interactive-monochrome-active-alt-light), var(--modes-color-interactive-monochrome-active-alt-dark));
|
|
1107
1107
|
--button-color-typical-subtle-inverse-bg-active: light-dark(var(--modes-color-interactive-monochrome-inverse-active-alt-light), var(--modes-color-interactive-monochrome-inverse-active-alt-dark));
|
|
1108
1108
|
--button-color-typical-toggle-bg-active-disabled: light-dark(var(--modes-color-interactive-inactive-default-light), var(--modes-color-interactive-inactive-default-dark));
|
|
1109
1109
|
--button-color-typical-toggle-border-disabled: light-dark(var(--modes-color-interactive-inactive-default-light), var(--modes-color-interactive-inactive-default-dark));
|
|
@@ -1130,7 +1130,7 @@
|
|
|
1130
1130
|
--container-color-interactive-border-activated: light-dark(var(--modes-color-status-positive-default-light), var(--modes-color-status-positive-default-dark));
|
|
1131
1131
|
--container-color-interactive-bg-footer-default: light-dark(var(--modes-color-generic-bg-nought-light), var(--modes-color-generic-bg-nought-dark)); /* tile footer bg color */
|
|
1132
1132
|
--container-color-interactive-bg-enabled: light-dark(var(--modes-color-generic-bg-nought-light), var(--modes-color-generic-bg-nought-dark));
|
|
1133
|
-
--container-color-interactive-detailedicon-bg: light-dark(var(--modes-color-custom-
|
|
1133
|
+
--container-color-interactive-detailedicon-bg: light-dark(var(--modes-color-custom-frozen-light), var(--modes-color-custom-frozen-dark));
|
|
1134
1134
|
--container-color-interactive-droptarget-bg-default: light-dark(var(--modes-color-status-info-default-light), var(--modes-color-status-info-default-dark)); /* draggable drop target background color */
|
|
1135
1135
|
--container-color-standard-bg-default: light-dark(var(--modes-color-generic-bg-nought-light), var(--modes-color-generic-bg-nought-dark));
|
|
1136
1136
|
--container-color-standard-statusborder-bg-caution: light-dark(var(--modes-color-status-caution-default-light), var(--modes-color-status-caution-default-dark));
|
|
@@ -1149,7 +1149,7 @@
|
|
|
1149
1149
|
--container-typography-paragraph-s: var(--global-typography-component-moderate-s);
|
|
1150
1150
|
--container-typography-paragraph-m: var(--global-typography-component-moderate-m);
|
|
1151
1151
|
--container-typography-paragraph-l: var(--global-typography-component-moderate-l);
|
|
1152
|
-
--container-color-blockquote-border: light-dark(var(--modes-color-interactive-primary-default-light), var(--modes-color-interactive-primary-default-dark));
|
|
1152
|
+
--container-color-blockquote-border: light-dark(var(--modes-color-interactive-primary-frozen-default-light), var(--modes-color-interactive-primary-frozen-default-dark));
|
|
1153
1153
|
--container-color-interactive-bg-footer-active: light-dark(var(--modes-color-interactive-monochrome-active-light), var(--modes-color-interactive-monochrome-active-dark));
|
|
1154
1154
|
--container-color-interactive-bg-hover: light-dark(var(--modes-color-interactive-monochrome-hover-alt-light), var(--modes-color-interactive-monochrome-hover-alt-dark)); /* Used for accordion hover backgrounds */
|
|
1155
1155
|
--container-color-interactive-border-active: light-dark(var(--modes-color-interactive-monochrome-active-light), var(--modes-color-interactive-monochrome-active-dark));
|
|
@@ -1248,15 +1248,15 @@
|
|
|
1248
1248
|
--container-radius-nudge: var(--global-radius-container-l); /* nudge radius */
|
|
1249
1249
|
--container-radius-profileselector: var(--global-radius-container-m); /* Profile selector list container. */
|
|
1250
1250
|
--container-radius-texteditor: var(--global-radius-container-m); /* Text editor (footer bottom corners) */
|
|
1251
|
-
--container-radius-card-moderate: var(--global-radius-container-
|
|
1252
|
-
--container-radius-card-curved: var(--global-radius-container-
|
|
1253
|
-
--container-radius-card-sweeping: var(--global-radius-container-
|
|
1254
|
-
--container-radius-tile-moderate: var(--global-radius-container-
|
|
1255
|
-
--container-radius-tile-curved: var(--global-radius-container-
|
|
1256
|
-
--container-radius-tile-sweeping: var(--global-radius-container-
|
|
1257
|
-
--container-radius-tileselect-moderate: var(--global-radius-container-
|
|
1258
|
-
--container-radius-tileselect-curved: var(--global-radius-container-
|
|
1259
|
-
--container-radius-tileselect-sweeping: var(--global-radius-container-
|
|
1251
|
+
--container-radius-card-moderate: var(--global-radius-container-m); /* Card (less rounded) */
|
|
1252
|
+
--container-radius-card-curved: var(--global-radius-container-l); /* Card (more rounded) */
|
|
1253
|
+
--container-radius-card-sweeping: var(--global-radius-container-xl); /* Card largest rounded type */
|
|
1254
|
+
--container-radius-tile-moderate: var(--global-radius-container-m); /* Tile (less rounded) */
|
|
1255
|
+
--container-radius-tile-curved: var(--global-radius-container-l); /* Tile (more rounded) */
|
|
1256
|
+
--container-radius-tile-sweeping: var(--global-radius-container-xl); /* Tile largest roundedness */
|
|
1257
|
+
--container-radius-tileselect-moderate: var(--global-radius-container-m); /* Tile (less rounded) */
|
|
1258
|
+
--container-radius-tileselect-curved: var(--global-radius-container-l); /* Tile (more rounded) */
|
|
1259
|
+
--container-radius-tileselect-sweeping: var(--global-radius-container-xl);
|
|
1260
1260
|
--container-space-none: var(--global-space-none);
|
|
1261
1261
|
--container-space-accordionsubtle-yg-m: var(--global-space-macro-xs); /* Gap between Accordion subtle trigger and content */
|
|
1262
1262
|
--container-space-filepreview-preview-x-m: var(--global-space-micro-l); /* Horizontal padding on large thumbnail image */
|
|
@@ -1457,12 +1457,16 @@
|
|
|
1457
1457
|
--form-color-switch-border-active: transparent;
|
|
1458
1458
|
--form-color-switch-border-activedisabled: transparent;
|
|
1459
1459
|
--form-radius-none: var(--global-radius-none); /* Text editor (internal corners) */
|
|
1460
|
-
--form-radius-colorpicker: var(--global-radius-circle); /* Color picker (swatch container), */
|
|
1461
1460
|
--form-radius-radio: var(--global-radius-circle); /* Radio button */
|
|
1462
1461
|
--form-radius-switch: var(--global-radius-circle); /* Switch container and handle */
|
|
1463
1462
|
--form-radius-calendar-none: var(--global-radius-none); /* Calendar (start and end duration) */
|
|
1464
1463
|
--form-radius-calendar-date: var(--global-radius-circle); /* Calendar date (hover & selected), */
|
|
1464
|
+
--form-color-calendar-bg-duration: light-dark(var(--modes-color-interactive-inactive-frozen-default-alt-light), var(--modes-color-interactive-inactive-frozen-default-alt-dark));
|
|
1465
1465
|
--form-color-labelset-label-required: light-dark(var(--modes-color-interactive-danger-default-light), var(--modes-color-interactive-danger-default-dark));
|
|
1466
|
+
--form-color-typical-border-enabled: light-dark(var(--modes-color-interactive-data-entry-frozen-with-default-light), var(--modes-color-interactive-data-entry-frozen-with-default-dark));
|
|
1467
|
+
--form-color-switch-bg-active: light-dark(var(--modes-color-interactive-monochrome-frozen-default-light), var(--modes-color-interactive-monochrome-frozen-default-dark));
|
|
1468
|
+
--form-color-switch-border-enabled: light-dark(var(--modes-color-interactive-data-entry-frozen-with-default-light), var(--modes-color-interactive-data-entry-frozen-with-default-dark));
|
|
1469
|
+
--form-color-switch-fg-enabled: light-dark(var(--modes-color-interactive-data-entry-frozen-with-default-light), var(--modes-color-interactive-data-entry-frozen-with-default-dark));
|
|
1466
1470
|
--form-color-validation-border-error: light-dark(var(--modes-color-status-negative-default-light), var(--modes-color-status-negative-default-dark));
|
|
1467
1471
|
--form-color-validation-bar-error: light-dark(var(--modes-color-status-negative-default-light), var(--modes-color-status-negative-default-dark)); /* error bar to left of inputs */
|
|
1468
1472
|
--form-color-validation-bar-warning: light-dark(var(--modes-color-status-caution-default-light), var(--modes-color-status-caution-default-dark)); /* warning bar to left of inputs */
|
|
@@ -1476,9 +1480,8 @@
|
|
|
1476
1480
|
--form-typography-default-s: var(--global-typography-component-moderate-s);
|
|
1477
1481
|
--form-typography-default-m: var(--global-typography-component-moderate-m);
|
|
1478
1482
|
--form-typography-default-l: var(--global-typography-component-moderate-l);
|
|
1479
|
-
--form-color-calendar-bg-active: light-dark(var(--modes-color-interactive-monochrome-active-light), var(--modes-color-interactive-monochrome-active-dark));
|
|
1483
|
+
--form-color-calendar-bg-active: light-dark(var(--modes-color-interactive-monochrome-frozen-active-light), var(--modes-color-interactive-monochrome-frozen-active-dark));
|
|
1480
1484
|
--form-color-calendar-bg-hover: light-dark(var(--modes-color-interactive-monochrome-hover-alt-light), var(--modes-color-interactive-monochrome-hover-alt-dark));
|
|
1481
|
-
--form-color-calendar-border-duration: light-dark(var(--modes-color-interactive-monochrome-active-light), var(--modes-color-interactive-monochrome-active-dark));
|
|
1482
1485
|
--form-color-calendar-text-hover: light-dark(var(--modes-color-interactive-monochrome-with-hover-light), var(--modes-color-interactive-monochrome-with-hover-dark));
|
|
1483
1486
|
--form-color-dropdown-label-hover: light-dark(var(--modes-color-interactive-monochrome-with-hover-light), var(--modes-color-interactive-monochrome-with-hover-dark));
|
|
1484
1487
|
--form-color-typical-bg-default: light-dark(var(--modes-color-interactive-data-entry-default-light), var(--modes-color-interactive-data-entry-default-dark));
|
|
@@ -1488,7 +1491,6 @@
|
|
|
1488
1491
|
--form-color-typical-icon-hover: light-dark(var(--modes-color-interactive-data-entry-with-hover-light), var(--modes-color-interactive-data-entry-with-hover-dark));
|
|
1489
1492
|
--form-color-typical-text-hover: light-dark(var(--modes-color-interactive-data-entry-with-hover-light), var(--modes-color-interactive-data-entry-with-hover-dark)); /* text hover state when dragging a file over file input */
|
|
1490
1493
|
--form-color-typical-text-read-only: light-dark(var(--modes-color-generic-content-harsh-light), var(--modes-color-generic-content-harsh-dark));
|
|
1491
|
-
--form-color-switch-bg-active: light-dark(var(--modes-color-interactive-monochrome-active-light), var(--modes-color-interactive-monochrome-active-dark));
|
|
1492
1494
|
--form-color-switch-bg-enabled: light-dark(var(--modes-color-interactive-data-entry-default-light), var(--modes-color-interactive-data-entry-default-dark)); /* for switch */
|
|
1493
1495
|
--form-space-none: var(--global-space-none);
|
|
1494
1496
|
--form-space-calendar-x-m: var(--global-space-macro-m);
|
|
@@ -1661,19 +1663,18 @@
|
|
|
1661
1663
|
--form-size-rating-m: var(--global-size-icon-m); /* medium rating stars */
|
|
1662
1664
|
--form-size-rating-l: var(--global-size-icon-xl); /* large rating stars */
|
|
1663
1665
|
--form-color-calendar-bg-disabled: light-dark(var(--modes-color-interactive-inactive-default-alt-light), var(--modes-color-interactive-inactive-default-alt-dark));
|
|
1664
|
-
--form-color-calendar-
|
|
1666
|
+
--form-color-calendar-border-duration: var(--form-color-calendar-bg-active);
|
|
1665
1667
|
--form-color-calendar-text-active: light-dark(var(--modes-color-interactive-monochrome-with-active-light), var(--modes-color-interactive-monochrome-with-active-dark));
|
|
1666
1668
|
--form-color-calendar-text-alt: light-dark(var(--modes-color-interactive-data-entry-content-alt-light), var(--modes-color-interactive-data-entry-content-alt-dark)); /* Days of the week subheaders */
|
|
1667
1669
|
--form-color-calendar-text-disabled: light-dark(var(--modes-color-interactive-inactive-content-light), var(--modes-color-interactive-inactive-content-dark));
|
|
1668
1670
|
--form-color-calendar-text-duration: light-dark(var(--modes-color-interactive-data-entry-content-light), var(--modes-color-interactive-data-entry-content-dark));
|
|
1669
1671
|
--form-color-calendar-text-enabled: light-dark(var(--modes-color-interactive-data-entry-content-light), var(--modes-color-interactive-data-entry-content-dark));
|
|
1670
1672
|
--form-color-calendar-text-alt-enabled: light-dark(var(--modes-color-interactive-data-entry-content-alt-light), var(--modes-color-interactive-data-entry-content-alt-dark));
|
|
1671
|
-
--form-color-dropdown-bg-hover: var(--popover-color-bg-hover); /* REF POPOVER */
|
|
1672
1673
|
--form-color-dropdown-label-active: light-dark(var(--modes-color-interactive-monochrome-with-active-light), var(--modes-color-interactive-monochrome-with-active-dark));
|
|
1673
1674
|
--form-color-dropdown-label-alt: light-dark(var(--modes-color-interactive-monochrome-default-light), var(--modes-color-interactive-monochrome-default-dark));
|
|
1674
1675
|
--form-color-dropdown-label-disabled: light-dark(var(--modes-color-interactive-inactive-content-light), var(--modes-color-interactive-inactive-content-dark));
|
|
1675
1676
|
--form-color-dropdown-label-enabled: light-dark(var(--modes-color-interactive-monochrome-default-alt-light), var(--modes-color-interactive-monochrome-default-alt-dark));
|
|
1676
|
-
--form-color-dropdown-label-subtext: light-dark(var(--modes-color-interactive-monochrome-default-
|
|
1677
|
+
--form-color-dropdown-label-subtext: light-dark(var(--modes-color-interactive-monochrome-default-alt2-light), var(--modes-color-interactive-monochrome-default-alt2-dark)); /* Option subtext. */
|
|
1677
1678
|
--form-color-labelset-label-default: light-dark(var(--modes-color-interactive-data-entry-content-light), var(--modes-color-interactive-data-entry-content-dark));
|
|
1678
1679
|
--form-color-labelset-label-alt: light-dark(var(--modes-color-interactive-data-entry-content-alt-light), var(--modes-color-interactive-data-entry-content-alt-dark)); /* used for '(optional)' text and hint text. */
|
|
1679
1680
|
--form-color-labelset-label-disabled: light-dark(var(--modes-color-interactive-inactive-content-light), var(--modes-color-interactive-inactive-content-dark));
|
|
@@ -1693,19 +1694,18 @@
|
|
|
1693
1694
|
--form-color-typical-text-disabled: light-dark(var(--modes-color-interactive-inactive-content-light), var(--modes-color-interactive-inactive-content-dark));
|
|
1694
1695
|
--form-color-typical-text-enabled: light-dark(var(--modes-color-interactive-data-entry-content-light), var(--modes-color-interactive-data-entry-content-dark)); /* Dropdown text (subtle dropdown). */
|
|
1695
1696
|
--form-color-switch-bg-disabled: light-dark(var(--modes-color-interactive-inactive-default-alt-light), var(--modes-color-interactive-inactive-default-alt-dark)); /* for switch */
|
|
1696
|
-
--form-color-switch-border-enabled: light-dark(var(--modes-color-interactive-monochrome-subtle-default-alt-light), var(--modes-color-interactive-monochrome-subtle-default-alt-dark));
|
|
1697
1697
|
--form-color-switch-fg-active: light-dark(var(--modes-color-interactive-monochrome-with-active-light), var(--modes-color-interactive-monochrome-with-active-dark));
|
|
1698
1698
|
--form-color-switch-fg-activedisabled: light-dark(var(--modes-color-interactive-inactive-content-alt-light), var(--modes-color-interactive-inactive-content-alt-dark));
|
|
1699
|
-
--form-color-switch-fg-enabled: light-dark(var(--modes-color-interactive-monochrome-subtle-default-alt-light), var(--modes-color-interactive-monochrome-subtle-default-alt-dark));
|
|
1700
1699
|
--form-color-switch-label-active: light-dark(var(--modes-color-interactive-data-entry-content-light), var(--modes-color-interactive-data-entry-content-dark));
|
|
1701
1700
|
--form-color-switch-label-enabled: light-dark(var(--modes-color-interactive-data-entry-content-alt-light), var(--modes-color-interactive-data-entry-content-alt-dark));
|
|
1702
1701
|
--form-color-switch-icon-enabled: light-dark(var(--modes-color-interactive-data-entry-content-alt-light), var(--modes-color-interactive-data-entry-content-alt-dark));
|
|
1703
|
-
--form-radius-checkbox: var(--global-radius-interactive-
|
|
1702
|
+
--form-radius-checkbox: var(--global-radius-interactive-xs); /* S and M checkbox */
|
|
1704
1703
|
--form-radius-texteditorfooter: var(--global-radius-interactive-s); /* AI text editor footer */
|
|
1705
|
-
--form-radius-
|
|
1706
|
-
--form-radius-
|
|
1707
|
-
--form-radius-
|
|
1708
|
-
--form-radius-
|
|
1704
|
+
--form-radius-colorpicker: var(--global-radius-interactive-l); /* Color picker (swatch container) */
|
|
1705
|
+
--form-radius-fileupload: var(--global-radius-interactive-s); /* File input (file uploads) */
|
|
1706
|
+
--form-radius-fileselector: var(--global-radius-interactive-s); /* File preview (file selector asset) */
|
|
1707
|
+
--form-radius-input: var(--global-radius-interactive-s); /* Date picker input, Date range input, Dropdown select (trigger), Search, File input (draggable area), Text area, Text input */
|
|
1708
|
+
--form-radius-validationbar: var(--global-radius-interactive-xxs); /* Validation bar */
|
|
1709
1709
|
--form-radius-progressivebar: var(--global-radius-interactive-xs); /* Validation bar */
|
|
1710
1710
|
--form-radius-calendar-today: var(--global-radius-container-xs); /* Calendar (today indicator) */
|
|
1711
1711
|
--form-radius-texteditor-a-icontainer: var(--global-radius-interactive-s); /* container for draft with copilot form fields */
|
|
@@ -1737,8 +1737,8 @@
|
|
|
1737
1737
|
--form-size-dropdown-item-l: var(--popover-size-item-l); /* REF POPOVER. Menu item min height. */
|
|
1738
1738
|
--form-size-search-input-minwidth: var(--container-size-responsive-xl); /* minimum width for search input container */
|
|
1739
1739
|
--form-size-search-input-maxwidth: calc(var(--container-size-responsive-xxl) + var(--container-size-responsive-xxs)); /* maximum width for search input container */
|
|
1740
|
+
--form-color-dropdown-bg-hover: var(--popover-color-bg-hover); /* REF POPOVER */
|
|
1740
1741
|
--form-color-typical-border-alt: light-dark(var(--modes-color-interactive-inactive-default-light), var(--modes-color-interactive-inactive-default-dark));
|
|
1741
|
-
--form-color-typical-border-enabled: light-dark(var(--modes-color-interactive-data-entry-with-default-light), var(--modes-color-interactive-data-entry-with-default-dark));
|
|
1742
1742
|
--form-color-typical-border-disabled: light-dark(var(--modes-color-interactive-inactive-default-light), var(--modes-color-interactive-inactive-default-dark));
|
|
1743
1743
|
--form-color-typical-border-read-only: light-dark(var(--modes-color-interactive-inactive-default-light), var(--modes-color-interactive-inactive-default-dark));
|
|
1744
1744
|
--form-color-switch-bg-activedisabled: light-dark(var(--modes-color-interactive-inactive-default-light), var(--modes-color-interactive-inactive-default-dark));
|
|
@@ -1762,7 +1762,7 @@
|
|
|
1762
1762
|
--link-boxshadow-skiplink: var(--global-boxshadow-container-near);
|
|
1763
1763
|
--link-color-destructive-label-hover: light-dark(var(--modes-color-interactive-danger-hover-alt2-light), var(--modes-color-interactive-danger-hover-alt2-dark));
|
|
1764
1764
|
--link-color-destructive-inverse-label-hover: light-dark(var(--modes-color-interactive-danger-inverse-hover-alt2-light), var(--modes-color-interactive-danger-inverse-hover-alt2-dark));
|
|
1765
|
-
--link-color-typical-label-default: light-dark(var(--modes-color-interactive-primary-default-
|
|
1765
|
+
--link-color-typical-label-default: light-dark(var(--modes-color-interactive-primary-frozen-default-alt-light), var(--modes-color-interactive-primary-frozen-default-alt-dark));
|
|
1766
1766
|
--link-color-typical-inverse-label-default: light-dark(var(--modes-color-interactive-primary-inverse-default-alt2-light), var(--modes-color-interactive-primary-inverse-default-alt2-dark));
|
|
1767
1767
|
--link-color-subtle-label-default: light-dark(var(--modes-color-interactive-monochrome-default-light), var(--modes-color-interactive-monochrome-default-dark));
|
|
1768
1768
|
--link-color-subtle-inverse-label-default: light-dark(var(--modes-color-interactive-monochrome-inverse-default-light), var(--modes-color-interactive-monochrome-inverse-default-dark));
|
|
@@ -1774,7 +1774,7 @@
|
|
|
1774
1774
|
--link-space-integral-xg-l: var(--global-space-micro-l); /* Space between icon and link text. */
|
|
1775
1775
|
--link-space-skiplink-x: var(--global-space-macro-m); /* Skiplink container */
|
|
1776
1776
|
--link-space-skiplink-y: var(--global-space-micro-xxl); /* Skiplink container */
|
|
1777
|
-
--link-color-typical-label-hover: light-dark(var(--modes-color-interactive-primary-hover-
|
|
1777
|
+
--link-color-typical-label-hover: light-dark(var(--modes-color-interactive-primary-frozen-hover-alt-light), var(--modes-color-interactive-primary-frozen-hover-alt-dark));
|
|
1778
1778
|
--link-color-typical-inverse-label-hover: light-dark(var(--modes-color-interactive-primary-inverse-hover-alt2-light), var(--modes-color-interactive-primary-inverse-hover-alt2-dark));
|
|
1779
1779
|
|
|
1780
1780
|
/* logo component tokens */
|
|
@@ -1793,6 +1793,7 @@
|
|
|
1793
1793
|
--nav-space-leftnav-grandchilditem-x-indent: 33; /* indent on grandchild items */
|
|
1794
1794
|
--nav-color-bg-default: light-dark(var(--modes-color-generic-bg-nought-light), var(--modes-color-generic-bg-nought-dark)); /* nav bar bg */
|
|
1795
1795
|
--nav-color-item-bg-enabled: light-dark(var(--modes-color-none-light), var(--modes-color-none-dark));
|
|
1796
|
+
--nav-color-item-bg-hover: light-dark(var(--modes-color-interactive-primary-frozen-nav-hover-light), var(--modes-color-interactive-primary-frozen-nav-hover-dark));
|
|
1796
1797
|
--nav-color-leftnav-container-bg-default: light-dark(var(--modes-color-generic-bg-nought-light), var(--modes-color-generic-bg-nought-dark)); /* bg of horizontal nav variant that launches the left nav */
|
|
1797
1798
|
--nav-color-leftnav-item-bg-active: light-dark(var(--modes-color-interactive-nav-active-light), var(--modes-color-interactive-nav-active-dark));
|
|
1798
1799
|
--nav-color-leftnav-item-bg-enabled: light-dark(var(--modes-color-none-light), var(--modes-color-none-dark));
|
|
@@ -1813,9 +1814,7 @@
|
|
|
1813
1814
|
--nav-typography-default-l: var(--global-typography-component-moderate-l);
|
|
1814
1815
|
--nav-color-item-bg-active: light-dark(var(--modes-color-interactive-monochrome-active-light), var(--modes-color-interactive-monochrome-active-dark));
|
|
1815
1816
|
--nav-color-item-bg-activealt: light-dark(var(--modes-color-interactive-monochrome-hover-alt-light), var(--modes-color-interactive-monochrome-hover-alt-dark));
|
|
1816
|
-
--nav-color-item-bg-hover: light-dark(var(--modes-color-interactive-monochrome-hover-alt-light), var(--modes-color-interactive-monochrome-hover-alt-dark));
|
|
1817
1817
|
--nav-color-item-label-activealt: light-dark(var(--modes-color-interactive-monochrome-with-hover-light), var(--modes-color-interactive-monochrome-with-hover-dark));
|
|
1818
|
-
--nav-color-item-label-hover: light-dark(var(--modes-color-interactive-monochrome-with-hover-light), var(--modes-color-interactive-monochrome-with-hover-dark));
|
|
1819
1818
|
--nav-color-menu-bg-default: light-dark(var(--modes-color-generic-bg-faint-light), var(--modes-color-generic-bg-faint-dark)); /* menu (level 1) nav bg */
|
|
1820
1819
|
--nav-color-menu-bg-alt: light-dark(var(--modes-color-generic-bg-delicate-light), var(--modes-color-generic-bg-delicate-dark)); /* level 2 nav bg */
|
|
1821
1820
|
--nav-color-menu-bg-alt2: light-dark(var(--modes-color-generic-bg-soft-light), var(--modes-color-generic-bg-soft-dark)); /* level 3 nav bg */
|
|
@@ -1842,7 +1841,7 @@
|
|
|
1842
1841
|
--nav-color-topnav-item-label-enabled: light-dark(var(--modes-color-interactive-nav-with-default-light), var(--modes-color-interactive-nav-with-default-dark));
|
|
1843
1842
|
--nav-radius-menu: var(--global-radius-interactive-m); /* Drop list bottom corners, product popout list all corners */
|
|
1844
1843
|
--nav-radius-menuitem: var(--global-radius-interactive-s); /* Menu (menu item state bg shape), */
|
|
1845
|
-
--nav-radius-menumodal: var(--global-radius-interactive-
|
|
1844
|
+
--nav-radius-menumodal: var(--global-radius-interactive-m); /* Menu on mobile */
|
|
1846
1845
|
--nav-radius-leftnav-menuitem: var(--global-radius-interactive-m); /* Radius on parent, child and grandchild items in left nav */
|
|
1847
1846
|
--nav-radius-modal-menuitem: var(--global-radius-interactive-m); /* Radius on parent, child and grandchild items in left nav */
|
|
1848
1847
|
--nav-radius-topnav-menuitem: var(--global-radius-interactive-m); /* Radius on parent, child and grandchild items in left nav */
|
|
@@ -1935,6 +1934,7 @@
|
|
|
1935
1934
|
--nav-space-topnav-parentitem-x-m: var(--global-space-macro-xxxs); /* horizontal padding on stacked parent items */
|
|
1936
1935
|
--nav-space-topnav-parentitem-xg-m: var(--global-space-micro-s); /* gap within horizontal parent items */
|
|
1937
1936
|
--nav-space-topnav-parentitem-y-m: calc(var(--global-space-macro-xxxs) / 2); /* vertical padding on stacked parent items */
|
|
1937
|
+
--nav-color-item-label-hover: light-dark(var(--modes-color-interactive-primary-frozen-nav-label-hover-light), var(--modes-color-interactive-primary-frozen-nav-label-hover-dark));
|
|
1938
1938
|
|
|
1939
1939
|
/* page component tokens */
|
|
1940
1940
|
--page-color-bg-default: light-dark(var(--modes-color-generic-backdrop-nought-light), var(--modes-color-generic-backdrop-nought-dark));
|
|
@@ -1992,11 +1992,7 @@
|
|
|
1992
1992
|
--popover-typography-default-m: var(--global-typography-component-moderate-m);
|
|
1993
1993
|
--popover-typography-default-l: var(--global-typography-component-moderate-l);
|
|
1994
1994
|
--popover-boxshadow-container: var(--global-boxshadow-container-near); /* REF'D IN FORM. Popover container for Button popover, Button split, (and Form calendar, color picker, dropdown) */
|
|
1995
|
-
--popover-color-bg-active: light-dark(var(--modes-color-interactive-monochrome-active-light), var(--modes-color-interactive-monochrome-active-dark));
|
|
1996
|
-
--popover-color-bg-activealt: light-dark(var(--modes-color-interactive-monochrome-hover-alt-light), var(--modes-color-interactive-monochrome-hover-alt-dark)); /* REF'D IN FORM. */
|
|
1997
|
-
--popover-color-bg-hover: light-dark(var(--modes-color-interactive-monochrome-hover-alt-light), var(--modes-color-interactive-monochrome-hover-alt-dark)); /* REF'D IN FORM. */
|
|
1998
|
-
--popover-color-label-activealt: light-dark(var(--modes-color-interactive-monochrome-with-hover-light), var(--modes-color-interactive-monochrome-with-hover-dark));
|
|
1999
|
-
--popover-color-label-hover: light-dark(var(--modes-color-interactive-monochrome-with-hover-light), var(--modes-color-interactive-monochrome-with-hover-dark));
|
|
1995
|
+
--popover-color-bg-active: light-dark(var(--modes-color-interactive-monochrome-frozen-active-light), var(--modes-color-interactive-monochrome-frozen-active-dark));
|
|
2000
1996
|
--popover-color-submenu-bg-default: light-dark(var(--modes-color-generic-bg-faint-light), var(--modes-color-generic-bg-faint-dark)); /* popover small screen submenu container bg */
|
|
2001
1997
|
--popover-size-icon-m: var(--global-size-icon-m);
|
|
2002
1998
|
--popover-size-item-s: var(--global-size-macro-s); /* REF'D IN FORM. Menu item min height. */
|
|
@@ -2025,9 +2021,13 @@
|
|
|
2025
2021
|
--popover-space-submenu-x-s: var(--global-space-macro-xs); /* Right left padding on small screen submenu popover container. */
|
|
2026
2022
|
--popover-space-submenu-x-m: var(--global-space-macro-xs); /* Right left padding on small screen submenu popover container. */
|
|
2027
2023
|
--popover-space-submenu-x-l: var(--global-space-macro-xs); /* Right left padding on small screen submenu popover container. */
|
|
2024
|
+
--popover-color-bg-activealt: light-dark(var(--modes-color-interactive-monochrome-frozen-hover-alt-light), var(--modes-color-interactive-monochrome-frozen-hover-alt-dark));
|
|
2025
|
+
--popover-color-bg-hover: light-dark(var(--modes-color-interactive-monochrome-frozen-hover-alt-light), var(--modes-color-interactive-monochrome-frozen-hover-alt-dark));
|
|
2028
2026
|
--popover-color-label-active: light-dark(var(--modes-color-interactive-monochrome-with-active-light), var(--modes-color-interactive-monochrome-with-active-dark));
|
|
2027
|
+
--popover-color-label-activealt: light-dark(var(--modes-color-interactive-monochrome-frozen-with-hover-light), var(--modes-color-interactive-monochrome-frozen-with-hover-dark));
|
|
2029
2028
|
--popover-color-label-disabled: light-dark(var(--modes-color-interactive-inactive-content-light), var(--modes-color-interactive-inactive-content-dark));
|
|
2030
|
-
--popover-color-label-
|
|
2029
|
+
--popover-color-label-hover: light-dark(var(--modes-color-interactive-monochrome-default-light), var(--modes-color-interactive-monochrome-default-dark));
|
|
2030
|
+
--popover-color-label-enabled: light-dark(var(--modes-color-interactive-monochrome-default-light), var(--modes-color-interactive-monochrome-default-dark));
|
|
2031
2031
|
--popover-size-menu-minwidth-s: calc(var(--container-size-responsive-m) / 2); /* minwidth of small size popover menu container */
|
|
2032
2032
|
--popover-size-menu-minwidth-m: var(--container-size-responsive-xs); /* minwidth of medium size popover menu container */
|
|
2033
2033
|
--popover-size-menu-minwidth-l: var(--container-size-responsive-s); /* minwidth of large size popover menu container */
|
|
@@ -2105,12 +2105,14 @@
|
|
|
2105
2105
|
--progress-radius-stepindicator: var(--global-radius-circle); /* step indicator circles */
|
|
2106
2106
|
--progress-radius-carouselselector: var(--global-radius-circle); /* Carousel (selector dot) */
|
|
2107
2107
|
--progress-radius-skeleton-circle: var(--global-radius-circle); /* Used to represent circular elements such as profiles, badges etc */
|
|
2108
|
+
--progress-color-bg-default: light-dark(var(--modes-color-interactive-progress-frozen-bg-alt-light), var(--modes-color-interactive-progress-frozen-bg-alt-dark));
|
|
2108
2109
|
--progress-color-fg-ai: light-dark(var(--modes-color-interactive-ai-default-light), var(--modes-color-interactive-ai-default-dark)); /* For progress ring in ai buttons */
|
|
2109
2110
|
--progress-color-fg-alt: light-dark(var(--modes-color-status-positive-default-light), var(--modes-color-status-positive-default-dark));
|
|
2110
2111
|
--progress-color-fg-caution: light-dark(var(--modes-color-status-caution-default-light), var(--modes-color-status-caution-default-dark));
|
|
2111
2112
|
--progress-color-fg-error: light-dark(var(--modes-color-status-negative-default-light), var(--modes-color-status-negative-default-dark));
|
|
2112
2113
|
--progress-color-fg-info: light-dark(var(--modes-color-status-info-default-light), var(--modes-color-status-info-default-dark));
|
|
2113
2114
|
--progress-color-datavis-fg-default: light-dark(var(--modes-color-status-custom-teal-default-light), var(--modes-color-status-custom-teal-default-dark));
|
|
2115
|
+
--progress-color-loader-bg-default: light-dark(var(--modes-color-interactive-progress-frozen-bg-light), var(--modes-color-interactive-progress-frozen-bg-dark));
|
|
2114
2116
|
--progress-color-loader-fg-error: light-dark(var(--modes-color-status-negative-default-light), var(--modes-color-status-negative-default-dark));
|
|
2115
2117
|
--progress-color-loader-fg-complete: light-dark(var(--modes-color-status-positive-default-light), var(--modes-color-status-positive-default-dark));
|
|
2116
2118
|
--progress-color-stepflow-bg-complete: light-dark(var(--modes-color-status-positive-default-light), var(--modes-color-status-positive-default-dark));
|
|
@@ -2122,13 +2124,12 @@
|
|
|
2122
2124
|
--progress-typography-default-s: var(--global-typography-component-moderate-s);
|
|
2123
2125
|
--progress-typography-default-m: var(--global-typography-component-moderate-m);
|
|
2124
2126
|
--progress-typography-default-l: var(--global-typography-component-moderate-l);
|
|
2125
|
-
--progress-color-
|
|
2127
|
+
--progress-color-border-default: light-dark(var(--modes-color-generic-fg-frozen-soft-light), var(--modes-color-generic-fg-frozen-soft-dark));
|
|
2126
2128
|
--progress-color-fg-alt2: light-dark(var(--modes-color-generic-content-firm-light), var(--modes-color-generic-content-firm-dark));
|
|
2127
|
-
--progress-color-fg-default: light-dark(var(--modes-color-
|
|
2129
|
+
--progress-color-fg-default: light-dark(var(--modes-color-generic-fg-frozen-soft-light), var(--modes-color-generic-fg-frozen-soft-dark));
|
|
2128
2130
|
--progress-color-label-alt: light-dark(var(--modes-color-generic-content-firm-light), var(--modes-color-generic-content-firm-dark));
|
|
2129
2131
|
--progress-color-label-default: light-dark(var(--modes-color-generic-content-harsh-light), var(--modes-color-generic-content-harsh-dark));
|
|
2130
|
-
--progress-color-loader-
|
|
2131
|
-
--progress-color-loader-fg-default: light-dark(var(--modes-color-interactive-monochrome-active-light), var(--modes-color-interactive-monochrome-active-dark)); /* used for loader standard loader spinner */
|
|
2132
|
+
--progress-color-loader-fg-default: light-dark(var(--modes-color-interactive-primary-frozen-default-light), var(--modes-color-interactive-primary-frozen-default-dark)); /* used for loader standard loader spinner */
|
|
2132
2133
|
--progress-color-loader-inverse-bg-default: light-dark(var(--modes-color-interactive-progress-bg-alt-light), var(--modes-color-interactive-progress-bg-alt-dark)); /* used for inverse loader bgs */
|
|
2133
2134
|
--progress-color-stepflow-bg-active: light-dark(var(--modes-color-interactive-monochrome-active-light), var(--modes-color-interactive-monochrome-active-dark));
|
|
2134
2135
|
--progress-color-stepflow-bg-default: light-dark(var(--modes-color-generic-fg-nought-light), var(--modes-color-generic-fg-nought-dark));
|
|
@@ -2155,7 +2156,6 @@
|
|
|
2155
2156
|
--progress-size-stepindicator-bar: var(--global-size-micro-xxs); /* step indicator bar */
|
|
2156
2157
|
--progress-size-stepindicator-stepcircle-s: var(--global-size-macro-xs); /* M size step indicator */
|
|
2157
2158
|
--progress-size-stepindicator-stepcircle-m: var(--global-size-macro-s); /* M size step indicator */
|
|
2158
|
-
--progress-color-border-default: light-dark(var(--modes-color-generic-fg-soft-light), var(--modes-color-generic-fg-soft-dark));
|
|
2159
2159
|
--progress-color-loader-inverse-fg-default: light-dark(var(--modes-color-interactive-monochrome-with-active-light), var(--modes-color-interactive-monochrome-with-active-dark)); /* used on inverse loading spinner */
|
|
2160
2160
|
--progress-color-stepflow-border-default: light-dark(var(--modes-color-generic-fg-soft-light), var(--modes-color-generic-fg-soft-dark));
|
|
2161
2161
|
--progress-color-stepindicator-border-default: light-dark(var(--modes-color-generic-fg-soft-light), var(--modes-color-generic-fg-soft-dark));
|
|
@@ -2223,34 +2223,29 @@
|
|
|
2223
2223
|
--progress-space-stepindicator-horizontal-text-x-m: var(--global-space-micro-l); /* horizontal variant left and right padding on text container */
|
|
2224
2224
|
|
|
2225
2225
|
/* status component tokens */
|
|
2226
|
+
--status-color-message-global-info-bg-default: light-dark(var(--modes-color-status-info-frozenglobal-default-light), var(--modes-color-status-info-frozenglobal-default-dark)); /* Global message bg */
|
|
2227
|
+
--status-color-message-global-warning-bg-default: light-dark(var(--modes-color-status-caution-frozenglobal-default-light), var(--modes-color-status-caution-frozenglobal-default-dark)); /* Global message bg */
|
|
2226
2228
|
--status-radius-none: var(--global-radius-none); /* Pill (embedded element inner corners) */
|
|
2227
2229
|
--status-color-none: light-dark(var(--modes-color-none-light), var(--modes-color-none-dark)); /* transparent override used for hiding colors when needed. */
|
|
2228
2230
|
--status-color-message-contextual-bg: light-dark(var(--modes-color-generic-bg-nought-light), var(--modes-color-generic-bg-nought-dark));
|
|
2229
2231
|
--status-color-message-contextual-icon: light-dark(var(--modes-color-generic-bg-nought-light), var(--modes-color-generic-bg-nought-dark)); /* decorative icon on standard contextual messages */
|
|
2230
2232
|
--status-color-message-contextual-icon-alt: light-dark(var(--modes-color-status-neutral-default-light), var(--modes-color-status-neutral-default-dark)); /* icon on neutral status dialogs */
|
|
2231
|
-
--status-color-message-contextual-ai-bg-alt: light-dark(var(--modes-color-status-neutral-default-alt-light), var(--modes-color-status-neutral-default-alt-dark));
|
|
2232
2233
|
--status-color-message-contextual-callout-bg-alt: light-dark(var(--modes-color-status-callout-default-alt-light), var(--modes-color-status-callout-default-alt-dark)); /* Subtle message bg */
|
|
2233
2234
|
--status-color-message-contextual-error-bg-default: light-dark(var(--modes-color-status-negative-default-light), var(--modes-color-status-negative-default-dark));
|
|
2234
|
-
--status-color-message-contextual-error-bg-alt: light-dark(var(--modes-color-status-negative-default-alt-light), var(--modes-color-status-negative-default-alt-dark)); /* Subtle message bg */
|
|
2235
2235
|
--status-color-message-contextual-error-border-default: light-dark(var(--modes-color-status-negative-default-light), var(--modes-color-status-negative-default-dark));
|
|
2236
2236
|
--status-color-message-contextual-error-icon: light-dark(var(--modes-color-status-negative-default-light), var(--modes-color-status-negative-default-dark)); /* Icon on tinted bgs */
|
|
2237
2237
|
--status-color-message-contextual-info-bg-default: light-dark(var(--modes-color-status-info-default-light), var(--modes-color-status-info-default-dark));
|
|
2238
|
-
--status-color-message-contextual-info-bg-alt: light-dark(var(--modes-color-status-info-default-alt-light), var(--modes-color-status-info-default-alt-dark)); /* Subtle message bg */
|
|
2239
2238
|
--status-color-message-contextual-info-border-default: light-dark(var(--modes-color-status-info-default-light), var(--modes-color-status-info-default-dark));
|
|
2240
2239
|
--status-color-message-contextual-info-icon: light-dark(var(--modes-color-status-info-default-light), var(--modes-color-status-info-default-dark)); /* Icon on tinted bgs */
|
|
2241
2240
|
--status-color-message-contextual-success-bg-default: light-dark(var(--modes-color-status-positive-default-light), var(--modes-color-status-positive-default-dark));
|
|
2242
|
-
--status-color-message-contextual-success-bg-alt: light-dark(var(--modes-color-status-positive-default-alt-light), var(--modes-color-status-positive-default-alt-dark)); /* Subtle message bg */
|
|
2243
2241
|
--status-color-message-contextual-success-border-default: light-dark(var(--modes-color-status-positive-default-light), var(--modes-color-status-positive-default-dark));
|
|
2244
2242
|
--status-color-message-contextual-success-icon: light-dark(var(--modes-color-status-positive-default-light), var(--modes-color-status-positive-default-dark)); /* Icon on tinted bgs */
|
|
2245
2243
|
--status-color-message-contextual-warning-bg-default: light-dark(var(--modes-color-status-caution-default-light), var(--modes-color-status-caution-default-dark));
|
|
2246
|
-
--status-color-message-contextual-warning-bg-alt: light-dark(var(--modes-color-status-caution-default-alt-light), var(--modes-color-status-caution-default-alt-dark)); /* Subtle message bg */
|
|
2247
2244
|
--status-color-message-contextual-warning-border-default: light-dark(var(--modes-color-status-caution-default-light), var(--modes-color-status-caution-default-dark));
|
|
2248
2245
|
--status-color-message-contextual-warning-icon: light-dark(var(--modes-color-status-caution-default-light), var(--modes-color-status-caution-default-dark)); /* Icon on tinted bgs */
|
|
2249
2246
|
--status-color-message-global-callout-bg-default: light-dark(var(--modes-color-status-callout-default-alt-light), var(--modes-color-status-callout-default-alt-dark)); /* Global message bg */
|
|
2250
|
-
--status-color-message-global-info-bg-
|
|
2251
|
-
--status-color-message-global-
|
|
2252
|
-
--status-color-message-global-warning-bg-default: light-dark(var(--modes-color-status-caution-default-alt-light), var(--modes-color-status-caution-default-alt-dark)); /* Global message bg */
|
|
2253
|
-
--status-color-message-global-warning-icon: light-dark(var(--modes-color-status-caution-default-light), var(--modes-color-status-caution-default-dark)); /* Icon on tinted bgs */
|
|
2247
|
+
--status-color-message-global-info-bg-hover: light-dark(var(--modes-color-status-info-frozenglobal-hover-light), var(--modes-color-status-info-frozenglobal-hover-dark)); /* Global message bg */
|
|
2248
|
+
--status-color-message-global-warning-bg-hover: light-dark(var(--modes-color-status-caution-frozenglobal-hover-light), var(--modes-color-status-caution-frozenglobal-hover-dark)); /* Global message bg */
|
|
2254
2249
|
--status-color-pill-custom-blue-bg-default: light-dark(var(--modes-color-status-custom-blue-default-light), var(--modes-color-status-custom-blue-default-dark));
|
|
2255
2250
|
--status-color-pill-custom-blue-bg-alt-default: light-dark(var(--modes-color-status-custom-blue-default-alt-light), var(--modes-color-status-custom-blue-default-alt-dark)); /* outline pill bg */
|
|
2256
2251
|
--status-color-pill-custom-blue-border-default: light-dark(var(--modes-color-status-custom-blue-default-light), var(--modes-color-status-custom-blue-default-dark));
|
|
@@ -2282,7 +2277,6 @@
|
|
|
2282
2277
|
--status-color-pill-custom-slate-bg-alt-default: light-dark(var(--modes-color-status-custom-slate-default-alt-light), var(--modes-color-status-custom-slate-default-alt-dark)); /* outline pill bg */
|
|
2283
2278
|
--status-color-pill-custom-slate-border-default: light-dark(var(--modes-color-status-custom-slate-default-light), var(--modes-color-status-custom-slate-default-dark));
|
|
2284
2279
|
--status-color-pill-error-bg-default: light-dark(var(--modes-color-status-negative-default-light), var(--modes-color-status-negative-default-dark));
|
|
2285
|
-
--status-color-pill-error-bg-alt-default: light-dark(var(--modes-color-status-negative-default-alt-light), var(--modes-color-status-negative-default-alt-dark)); /* outline pill bg */
|
|
2286
2280
|
--status-color-pill-error-border-default: light-dark(var(--modes-color-status-negative-default-light), var(--modes-color-status-negative-default-dark));
|
|
2287
2281
|
--status-color-pill-error-inverse-bg-default: light-dark(var(--modes-color-status-negative-inverse-default-light), var(--modes-color-status-negative-inverse-default-dark));
|
|
2288
2282
|
--status-color-pill-error-inverse-bg-alt-default: light-dark(var(--modes-color-status-negative-inverse-default-alt-light), var(--modes-color-status-negative-inverse-default-alt-dark)); /* outline pill bg */
|
|
@@ -2294,25 +2288,22 @@
|
|
|
2294
2288
|
--status-color-pill-important-inverse-bg-alt-default: light-dark(var(--modes-color-status-important-inverse-default-alt-light), var(--modes-color-status-important-inverse-default-alt-dark)); /* outline pill bg */
|
|
2295
2289
|
--status-color-pill-important-inverse-border-default: light-dark(var(--modes-color-status-important-inverse-default-light), var(--modes-color-status-important-inverse-default-dark));
|
|
2296
2290
|
--status-color-pill-info-bg-default: light-dark(var(--modes-color-status-info-default-light), var(--modes-color-status-info-default-dark));
|
|
2297
|
-
--status-color-pill-info-bg-alt-default: light-dark(var(--modes-color-status-info-default-alt-light), var(--modes-color-status-info-default-alt-dark)); /* outline pill bg */
|
|
2298
2291
|
--status-color-pill-info-border-default: light-dark(var(--modes-color-status-info-default-light), var(--modes-color-status-info-default-dark));
|
|
2299
2292
|
--status-color-pill-info-inverse-bg-default: light-dark(var(--modes-color-status-info-inverse-default-light), var(--modes-color-status-info-inverse-default-dark));
|
|
2300
2293
|
--status-color-pill-info-inverse-bg-alt-default: light-dark(var(--modes-color-status-info-inverse-default-alt-light), var(--modes-color-status-info-inverse-default-alt-dark)); /* outline pill bg */
|
|
2301
2294
|
--status-color-pill-info-inverse-border-default: light-dark(var(--modes-color-status-info-inverse-default-light), var(--modes-color-status-info-inverse-default-dark));
|
|
2302
|
-
--status-color-pill-neutral-bg-default: light-dark(var(--modes-color-status-neutral-default-light), var(--modes-color-status-neutral-default-dark));
|
|
2303
|
-
--status-color-pill-neutral-bg-
|
|
2304
|
-
--status-color-pill-neutral-border-default: light-dark(var(--modes-color-status-neutral-default-light), var(--modes-color-status-neutral-default-dark));
|
|
2295
|
+
--status-color-pill-neutral-bg-default: light-dark(var(--modes-color-status-neutral-frozen-default-light), var(--modes-color-status-neutral-frozen-default-dark));
|
|
2296
|
+
--status-color-pill-neutral-bg-hover: light-dark(var(--modes-color-status-neutral-frozen-hover-light), var(--modes-color-status-neutral-frozen-hover-dark));
|
|
2297
|
+
--status-color-pill-neutral-border-default: light-dark(var(--modes-color-status-neutral-frozen-default-light), var(--modes-color-status-neutral-frozen-default-dark));
|
|
2305
2298
|
--status-color-pill-neutral-inverse-bg-default: light-dark(var(--modes-color-status-neutral-inverse-default-light), var(--modes-color-status-neutral-inverse-default-dark));
|
|
2306
2299
|
--status-color-pill-neutral-inverse-bg-alt-default: light-dark(var(--modes-color-status-neutral-inverse-default-alt-light), var(--modes-color-status-neutral-inverse-default-alt-dark)); /* outline pill bg */
|
|
2307
2300
|
--status-color-pill-neutral-inverse-border-default: light-dark(var(--modes-color-status-neutral-inverse-default-light), var(--modes-color-status-neutral-inverse-default-dark));
|
|
2308
2301
|
--status-color-pill-success-bg-default: light-dark(var(--modes-color-status-positive-default-light), var(--modes-color-status-positive-default-dark));
|
|
2309
|
-
--status-color-pill-success-bg-alt-default: light-dark(var(--modes-color-status-positive-default-alt-light), var(--modes-color-status-positive-default-alt-dark)); /* outline pill bg */
|
|
2310
2302
|
--status-color-pill-success-border-default: light-dark(var(--modes-color-status-positive-default-light), var(--modes-color-status-positive-default-dark));
|
|
2311
2303
|
--status-color-pill-success-inverse-bg-default: light-dark(var(--modes-color-status-positive-inverse-default-light), var(--modes-color-status-positive-inverse-default-dark));
|
|
2312
2304
|
--status-color-pill-success-inverse-bg-alt-default: light-dark(var(--modes-color-status-positive-inverse-default-alt-light), var(--modes-color-status-positive-inverse-default-alt-dark)); /* outline pill bg */
|
|
2313
2305
|
--status-color-pill-success-inverse-border-default: light-dark(var(--modes-color-status-positive-inverse-default-light), var(--modes-color-status-positive-inverse-default-dark));
|
|
2314
2306
|
--status-color-pill-warning-bg-default: light-dark(var(--modes-color-status-caution-default-light), var(--modes-color-status-caution-default-dark));
|
|
2315
|
-
--status-color-pill-warning-bg-alt-default: light-dark(var(--modes-color-status-caution-default-alt-light), var(--modes-color-status-caution-default-alt-dark)); /* Global message bg */
|
|
2316
2307
|
--status-color-pill-warning-border-default: light-dark(var(--modes-color-status-caution-default-light), var(--modes-color-status-caution-default-dark));
|
|
2317
2308
|
--status-color-pill-warning-inverse-bg-default: light-dark(var(--modes-color-status-caution-inverse-default-light), var(--modes-color-status-caution-inverse-default-dark));
|
|
2318
2309
|
--status-color-pill-warning-inverse-bg-alt-default: light-dark(var(--modes-color-status-caution-inverse-default-alt-light), var(--modes-color-status-caution-inverse-default-alt-dark)); /* Global message bg */
|
|
@@ -2328,11 +2319,14 @@
|
|
|
2328
2319
|
--status-typography-heading-l: var(--global-typography-component-firm-l);
|
|
2329
2320
|
--status-color-message-contextual-text: light-dark(var(--modes-color-status-content-with-hover-alt-light), var(--modes-color-status-content-with-hover-alt-dark)); /* Message text. */
|
|
2330
2321
|
--status-color-message-contextual-ai-bg-default: light-dark(var(--modes-color-status-ai-default-alt-light), var(--modes-color-status-ai-default-alt-dark));
|
|
2322
|
+
--status-color-message-contextual-ai-bg-alt: var(--status-color-none); /* Subtle message bg */
|
|
2331
2323
|
--status-color-message-contextual-ai-border-default: light-dark(var(--modes-color-status-ai-default-alt-light), var(--modes-color-status-ai-default-alt-dark));
|
|
2324
|
+
--status-color-message-contextual-error-bg-alt: var(--status-color-none); /* Subtle message bg */
|
|
2325
|
+
--status-color-message-contextual-info-bg-alt: var(--status-color-none); /* Subtle message bg */
|
|
2326
|
+
--status-color-message-contextual-success-bg-alt: var(--status-color-none); /* Subtle message bg */
|
|
2327
|
+
--status-color-message-contextual-warning-bg-alt: var(--status-color-none); /* Subtle message bg */
|
|
2332
2328
|
--status-color-message-global-label-hover: light-dark(var(--modes-color-interactive-monochrome-with-hover-light), var(--modes-color-interactive-monochrome-with-hover-dark));
|
|
2333
2329
|
--status-color-message-global-callout-bg-hover: light-dark(var(--modes-color-status-callout-hover-alt-light), var(--modes-color-status-callout-hover-alt-dark)); /* global message bg hover */
|
|
2334
|
-
--status-color-message-global-info-bg-hover: light-dark(var(--modes-color-status-info-hover-alt-light), var(--modes-color-status-info-hover-alt-dark));
|
|
2335
|
-
--status-color-message-global-warning-bg-hover: light-dark(var(--modes-color-status-caution-hover-alt-light), var(--modes-color-status-caution-hover-alt-dark));
|
|
2336
2330
|
--status-color-pill-custom-blue-bg-alt-hover: light-dark(var(--modes-color-status-custom-blue-hover-alt-light), var(--modes-color-status-custom-blue-hover-alt-dark));
|
|
2337
2331
|
--status-color-pill-custom-blue-bg-hover: light-dark(var(--modes-color-status-custom-blue-hover-light), var(--modes-color-status-custom-blue-hover-dark));
|
|
2338
2332
|
--status-color-pill-custom-teal-bg-alt-hover: light-dark(var(--modes-color-status-custom-teal-hover-alt-light), var(--modes-color-status-custom-teal-hover-alt-dark));
|
|
@@ -2353,6 +2347,7 @@
|
|
|
2353
2347
|
--status-color-pill-custom-gray-bg-hover: light-dark(var(--modes-color-status-custom-gray-hover-light), var(--modes-color-status-custom-gray-hover-dark));
|
|
2354
2348
|
--status-color-pill-custom-slate-bg-alt-hover: light-dark(var(--modes-color-status-custom-slate-hover-alt-light), var(--modes-color-status-custom-slate-hover-alt-dark));
|
|
2355
2349
|
--status-color-pill-custom-slate-bg-hover: light-dark(var(--modes-color-status-custom-slate-hover-light), var(--modes-color-status-custom-slate-hover-dark));
|
|
2350
|
+
--status-color-pill-error-bg-alt-default: var(--status-color-none); /* outline pill bg */
|
|
2356
2351
|
--status-color-pill-error-bg-alt-hover: light-dark(var(--modes-color-status-negative-hover-alt-light), var(--modes-color-status-negative-hover-alt-dark));
|
|
2357
2352
|
--status-color-pill-error-bg-hover: light-dark(var(--modes-color-status-negative-hover-light), var(--modes-color-status-negative-hover-dark));
|
|
2358
2353
|
--status-color-pill-error-inverse-bg-alt-hover: light-dark(var(--modes-color-status-negative-inverse-hover-alt-light), var(--modes-color-status-negative-inverse-hover-alt-dark));
|
|
@@ -2363,30 +2358,35 @@
|
|
|
2363
2358
|
--status-color-pill-important-bg-hover: light-dark(var(--modes-color-status-important-hover-light), var(--modes-color-status-important-hover-dark));
|
|
2364
2359
|
--status-color-pill-important-inverse-bg-alt-hover: light-dark(var(--modes-color-status-important-inverse-hover-alt-light), var(--modes-color-status-important-inverse-hover-alt-dark));
|
|
2365
2360
|
--status-color-pill-important-inverse-bg-hover: light-dark(var(--modes-color-status-important-inverse-hover-light), var(--modes-color-status-important-inverse-hover-dark));
|
|
2361
|
+
--status-color-pill-info-bg-alt-default: var(--status-color-none); /* outline pill bg */
|
|
2366
2362
|
--status-color-pill-info-bg-alt-hover: light-dark(var(--modes-color-status-info-hover-alt-light), var(--modes-color-status-info-hover-alt-dark));
|
|
2367
2363
|
--status-color-pill-info-bg-hover: light-dark(var(--modes-color-status-info-hover-light), var(--modes-color-status-info-hover-dark));
|
|
2368
2364
|
--status-color-pill-info-inverse-bg-alt-hover: light-dark(var(--modes-color-status-info-inverse-hover-alt-light), var(--modes-color-status-info-inverse-hover-alt-dark));
|
|
2369
2365
|
--status-color-pill-info-inverse-bg-hover: light-dark(var(--modes-color-status-info-inverse-hover-light), var(--modes-color-status-info-inverse-hover-dark));
|
|
2370
|
-
--status-color-pill-neutral-bg-alt-
|
|
2371
|
-
--status-color-pill-neutral-bg-hover: light-dark(var(--modes-color-status-neutral-hover-light), var(--modes-color-status-neutral-hover-dark));
|
|
2366
|
+
--status-color-pill-neutral-bg-alt-default: var(--status-color-none); /* outline pill bg */
|
|
2367
|
+
--status-color-pill-neutral-bg-alt-hover: light-dark(var(--modes-color-status-neutral-frozen-hover-alt-light), var(--modes-color-status-neutral-frozen-hover-alt-dark));
|
|
2372
2368
|
--status-color-pill-neutral-inverse-bg-alt-hover: light-dark(var(--modes-color-status-neutral-inverse-hover-alt-light), var(--modes-color-status-neutral-inverse-hover-alt-dark));
|
|
2373
2369
|
--status-color-pill-neutral-inverse-bg-hover: light-dark(var(--modes-color-status-neutral-inverse-hover-light), var(--modes-color-status-neutral-inverse-hover-dark));
|
|
2374
2370
|
--status-color-pill-readonly-label: light-dark(var(--modes-color-generic-content-firm-light), var(--modes-color-generic-content-firm-dark)); /* Pill (all types, readonly, when nested in disabled parent components) */
|
|
2371
|
+
--status-color-pill-success-bg-alt-default: var(--status-color-none); /* outline pill bg */
|
|
2375
2372
|
--status-color-pill-success-bg-alt-hover: light-dark(var(--modes-color-status-positive-hover-alt-light), var(--modes-color-status-positive-hover-alt-dark));
|
|
2376
2373
|
--status-color-pill-success-bg-hover: light-dark(var(--modes-color-status-positive-hover-light), var(--modes-color-status-positive-hover-dark));
|
|
2377
2374
|
--status-color-pill-success-inverse-bg-alt-hover: light-dark(var(--modes-color-status-positive-inverse-hover-alt-light), var(--modes-color-status-positive-inverse-hover-alt-dark));
|
|
2378
2375
|
--status-color-pill-success-inverse-bg-hover: light-dark(var(--modes-color-status-positive-inverse-hover-light), var(--modes-color-status-positive-inverse-hover-dark));
|
|
2376
|
+
--status-color-pill-warning-bg-alt-default: var(--status-color-none); /* Global message bg */
|
|
2379
2377
|
--status-color-pill-warning-bg-alt-hover: light-dark(var(--modes-color-status-caution-hover-alt-light), var(--modes-color-status-caution-hover-alt-dark));
|
|
2380
2378
|
--status-color-pill-warning-bg-hover: light-dark(var(--modes-color-status-caution-hover-light), var(--modes-color-status-caution-hover-dark));
|
|
2381
2379
|
--status-color-pill-warning-inverse-bg-alt-hover: light-dark(var(--modes-color-status-caution-inverse-hover-alt-light), var(--modes-color-status-caution-inverse-hover-alt-dark));
|
|
2382
2380
|
--status-color-pill-warning-inverse-bg-hover: light-dark(var(--modes-color-status-caution-inverse-hover-light), var(--modes-color-status-caution-inverse-hover-dark));
|
|
2383
|
-
--status-color-rating-bg-default: light-dark(var(--modes-color-status-reviews-default-light), var(--modes-color-status-reviews-default-dark));
|
|
2384
|
-
--status-color-rating-bg-default-alt: light-dark(var(--modes-color-status-reviews-default-alt-light), var(--modes-color-status-reviews-default-alt-dark));
|
|
2385
|
-
--status-color-rating-bg-hover: light-dark(var(--modes-color-status-reviews-hover-light), var(--modes-color-status-reviews-hover-dark));
|
|
2386
|
-
--status-color-rating-border-default: light-dark(var(--modes-color-status-reviews-default-light), var(--modes-color-status-reviews-default-dark));
|
|
2381
|
+
--status-color-rating-bg-default: light-dark(var(--modes-color-status-reviews-frozen-default-light), var(--modes-color-status-reviews-frozen-default-dark));
|
|
2382
|
+
--status-color-rating-bg-default-alt: light-dark(var(--modes-color-status-reviews-frozen-default-alt-light), var(--modes-color-status-reviews-frozen-default-alt-dark));
|
|
2383
|
+
--status-color-rating-bg-hover: light-dark(var(--modes-color-status-reviews-frozen-hover-light), var(--modes-color-status-reviews-frozen-hover-dark));
|
|
2384
|
+
--status-color-rating-border-default: light-dark(var(--modes-color-status-reviews-frozen-default-light), var(--modes-color-status-reviews-frozen-default-dark));
|
|
2387
2385
|
--status-color-message-contextual-callout-icon: light-dark(var(--modes-color-status-content-with-default-alt-light), var(--modes-color-status-content-with-default-alt-dark));
|
|
2388
2386
|
--status-color-message-global-label-default: light-dark(var(--modes-color-status-content-with-default-alt-light), var(--modes-color-status-content-with-default-alt-dark));
|
|
2389
2387
|
--status-color-message-global-callout-icon: light-dark(var(--modes-color-status-content-with-default-alt-light), var(--modes-color-status-content-with-default-alt-dark)); /* Icon on tinted bgs */
|
|
2388
|
+
--status-color-message-global-info-icon: light-dark(var(--modes-color-status-content-with-default-alt-light), var(--modes-color-status-content-with-default-alt-dark));
|
|
2389
|
+
--status-color-message-global-warning-icon: light-dark(var(--modes-color-status-content-with-default-alt-light), var(--modes-color-status-content-with-default-alt-dark));
|
|
2390
2390
|
--status-color-pill-generic-label-default: light-dark(var(--modes-color-status-content-with-default-light), var(--modes-color-status-content-with-default-dark));
|
|
2391
2391
|
--status-color-pill-generic-label-hover: light-dark(var(--modes-color-status-content-with-hover-light), var(--modes-color-status-content-with-hover-dark));
|
|
2392
2392
|
--status-color-pill-generic-label-alt-default: light-dark(var(--modes-color-status-content-with-default-alt-light), var(--modes-color-status-content-with-default-alt-dark));
|
|
@@ -2401,7 +2401,7 @@
|
|
|
2401
2401
|
--status-size-message-global-m: var(--global-size-macro-m); /* Global message minheight */
|
|
2402
2402
|
--status-size-icon-m: var(--global-size-icon-m);
|
|
2403
2403
|
--status-radius-message: var(--global-radius-container-m); /* Message */
|
|
2404
|
-
--status-radius-pill: var(--global-radius-container-
|
|
2404
|
+
--status-radius-pill: var(--global-radius-container-xs); /* Pill (outer corners) */
|
|
2405
2405
|
--status-borderwidth-pill: var(--global-borderwidth-s); /* Outlined Pill border */
|
|
2406
2406
|
--status-borderwidth-message: var(--global-borderwidth-xs); /* Contextual message and AI inline border */
|
|
2407
2407
|
--status-space-none: var(--global-space-none);
|
|
@@ -2443,8 +2443,7 @@
|
|
|
2443
2443
|
--tab-typography-label-s: var(--global-typography-component-firm-s);
|
|
2444
2444
|
--tab-typography-label-m: var(--global-typography-component-firm-m);
|
|
2445
2445
|
--tab-typography-label-l: var(--global-typography-component-firm-l);
|
|
2446
|
-
--tab-color-
|
|
2447
|
-
--tab-color-border-active: light-dark(var(--modes-color-interactive-monochrome-active-light), var(--modes-color-interactive-monochrome-active-dark));
|
|
2446
|
+
--tab-color-border-active: light-dark(var(--modes-color-interactive-primary-frozen-default-light), var(--modes-color-interactive-primary-frozen-default-dark));
|
|
2448
2447
|
--tab-color-icon-hover: light-dark(var(--modes-color-interactive-monochrome-with-hover-light), var(--modes-color-interactive-monochrome-with-hover-dark));
|
|
2449
2448
|
--tab-color-label-active: light-dark(var(--modes-color-interactive-monochrome-active-light), var(--modes-color-interactive-monochrome-active-dark));
|
|
2450
2449
|
--tab-color-icon-active: light-dark(var(--modes-color-interactive-monochrome-active-light), var(--modes-color-interactive-monochrome-active-dark));
|
|
@@ -2464,16 +2463,17 @@
|
|
|
2464
2463
|
--tab-space-xg-l: var(--global-space-micro-l); /* Gap between elements in Tab. */
|
|
2465
2464
|
--tab-space-y-m: var(--global-space-micro-l); /* Top bottom padding in Tab. */
|
|
2466
2465
|
--tab-space-y-l: var(--global-space-micro-xxl); /* Top bottom padding in Tab. */
|
|
2467
|
-
--tab-color-bg-active: light-dark(var(--modes-color-interactive-monochrome-with-
|
|
2466
|
+
--tab-color-bg-active: light-dark(var(--modes-color-interactive-monochrome-with-default-light), var(--modes-color-interactive-monochrome-with-default-dark));
|
|
2467
|
+
--tab-color-bg-hover: light-dark(var(--modes-color-interactive-monochrome-frozen-hover-alt-light), var(--modes-color-interactive-monochrome-frozen-hover-alt-dark)); /* For anchor nav, not tab. */
|
|
2468
2468
|
--tab-color-border-activealt: light-dark(var(--modes-color-generic-fg-delicate-light), var(--modes-color-generic-fg-delicate-dark));
|
|
2469
|
-
--tab-color-border-enabled: light-dark(var(--modes-color-
|
|
2470
|
-
--tab-color-border-hover: light-dark(var(--modes-color-
|
|
2469
|
+
--tab-color-border-enabled: light-dark(var(--modes-color-interactive-monochrome-frozen-hover-alt-light), var(--modes-color-interactive-monochrome-frozen-hover-alt-dark));
|
|
2470
|
+
--tab-color-border-hover: light-dark(var(--modes-color-interactive-monochrome-frozen-hover-alt-light), var(--modes-color-interactive-monochrome-frozen-hover-alt-dark));
|
|
2471
2471
|
--tab-color-icon-enabled: light-dark(var(--modes-color-interactive-monochrome-default-alt-light), var(--modes-color-interactive-monochrome-default-alt-dark));
|
|
2472
2472
|
--tab-color-label-enabled: light-dark(var(--modes-color-interactive-monochrome-default-light), var(--modes-color-interactive-monochrome-default-dark));
|
|
2473
2473
|
--tab-color-validation-label-error: light-dark(var(--modes-color-interactive-monochrome-default-alt-light), var(--modes-color-interactive-monochrome-default-alt-dark));
|
|
2474
2474
|
--tab-color-validation-label-warning: light-dark(var(--modes-color-interactive-monochrome-default-alt-light), var(--modes-color-interactive-monochrome-default-alt-dark));
|
|
2475
|
-
--tab-radius-m: var(--global-radius-interactive-
|
|
2476
|
-
--tab-radius-l: var(--global-radius-interactive-
|
|
2475
|
+
--tab-radius-m: var(--global-radius-interactive-s); /* Tab horizontal - top corners. Tab vertical - left corners. */
|
|
2476
|
+
--tab-radius-l: var(--global-radius-interactive-s); /* Tab horizontal - top corners. Tab vertical - left corners. */
|
|
2477
2477
|
--tab-radius-baseline-m: var(--global-radius-interactive-xxs);
|
|
2478
2478
|
--tab-radius-baseline-l: var(--global-radius-interactive-xxs);
|
|
2479
2479
|
--tab-radius-indicator-m: var(--global-radius-interactive-xs); /* Indicator for hover and active. */
|
|
@@ -2484,7 +2484,11 @@
|
|
|
2484
2484
|
|
|
2485
2485
|
/* table component tokens */
|
|
2486
2486
|
--table-color-header-subtle-bg-default: light-dark(var(--modes-color-none-light), var(--modes-color-none-dark));
|
|
2487
|
+
--table-color-header-harsh-bg-default: light-dark(var(--modes-color-interactive-monochrome-frozen-default-light), var(--modes-color-interactive-monochrome-frozen-default-dark));
|
|
2488
|
+
--table-color-row-bg-activated: light-dark(var(--modes-color-interactive-primary-frozen-table-default-light), var(--modes-color-interactive-primary-frozen-table-default-dark));
|
|
2487
2489
|
--table-color-row-bg-default: light-dark(var(--modes-color-generic-bg-nought-light), var(--modes-color-generic-bg-nought-dark));
|
|
2490
|
+
--table-color-row-bg-alt: light-dark(var(--modes-color-generic-bg-frozen-delicate-light), var(--modes-color-generic-bg-frozen-delicate-dark));
|
|
2491
|
+
--table-color-row-bg-hover: light-dark(var(--modes-color-generic-bg-frozen-soft-light), var(--modes-color-generic-bg-frozen-soft-dark));
|
|
2488
2492
|
--table-color-row-label-hover: light-dark(var(--modes-color-generic-content-extreme-light), var(--modes-color-generic-content-extreme-dark));
|
|
2489
2493
|
--table-typography-heading-s: var(--global-typography-component-firm-s);
|
|
2490
2494
|
--table-typography-heading-m: var(--global-typography-component-firm-m);
|
|
@@ -2495,12 +2499,11 @@
|
|
|
2495
2499
|
--table-typography-label-s: var(--global-typography-component-firm-s);
|
|
2496
2500
|
--table-typography-label-m: var(--global-typography-component-firm-m);
|
|
2497
2501
|
--table-typography-label-l: var(--global-typography-component-firm-l);
|
|
2498
|
-
--table-color-
|
|
2499
|
-
--table-color-row-bg-active: light-dark(var(--modes-color-interactive-monochrome-active-light), var(--modes-color-interactive-monochrome-active-dark));
|
|
2500
|
-
--table-color-row-bg-alt: light-dark(var(--modes-color-generic-bg-delicate-light), var(--modes-color-generic-bg-delicate-dark)); /* Zebra stripes */
|
|
2502
|
+
--table-color-header-harsh-bg-alt: light-dark(var(--modes-color-interactive-monochrome-frozen-default-alt-light), var(--modes-color-interactive-monochrome-frozen-default-alt-dark));
|
|
2501
2503
|
--table-color-row-bg-alt2: light-dark(var(--modes-color-generic-bg-soft-light), var(--modes-color-generic-bg-soft-dark)); /* Zebra stripes combined with child rows. */
|
|
2502
2504
|
--table-color-row-bg-alt3: light-dark(var(--modes-color-generic-bg-faint-light), var(--modes-color-generic-bg-faint-dark)); /* Child rows. */
|
|
2503
|
-
--table-color-row-
|
|
2505
|
+
--table-color-row-label-activated: light-dark(var(--modes-color-interactive-monochrome-with-active-alt-light), var(--modes-color-interactive-monochrome-with-active-alt-dark));
|
|
2506
|
+
--table-color-row-label-active: light-dark(var(--modes-color-interactive-monochrome-with-active-alt-light), var(--modes-color-interactive-monochrome-with-active-alt-dark));
|
|
2504
2507
|
--table-color-row-label-default: light-dark(var(--modes-color-generic-content-harsh-light), var(--modes-color-generic-content-harsh-dark));
|
|
2505
2508
|
--table-color-footer-bg-default: light-dark(var(--modes-color-generic-bg-soft-light), var(--modes-color-generic-bg-soft-dark));
|
|
2506
2509
|
--table-boxshadow-firstchild: var(--global-boxshadow-inner-near);
|
|
@@ -2512,15 +2515,12 @@
|
|
|
2512
2515
|
--table-color-header-subtle-border-default: light-dark(var(--modes-color-generic-fg-delicate-light), var(--modes-color-generic-fg-delicate-dark)); /* Header borders */
|
|
2513
2516
|
--table-color-header-subtle-label-default: light-dark(var(--modes-color-interactive-monochrome-default-light), var(--modes-color-interactive-monochrome-default-dark));
|
|
2514
2517
|
--table-color-header-subtle-label-hover: light-dark(var(--modes-color-interactive-monochrome-default-light), var(--modes-color-interactive-monochrome-default-dark));
|
|
2515
|
-
--table-color-header-harsh-bg-alt: light-dark(var(--modes-color-interactive-monochrome-default-light), var(--modes-color-interactive-monochrome-default-dark)); /* header alt */
|
|
2516
|
-
--table-color-header-harsh-bg-default: light-dark(var(--modes-color-interactive-monochrome-default-alt-light), var(--modes-color-interactive-monochrome-default-alt-dark));
|
|
2517
2518
|
--table-color-header-harsh-bg-hover: light-dark(var(--modes-color-interactive-monochrome-hover-light), var(--modes-color-interactive-monochrome-hover-dark));
|
|
2518
2519
|
--table-color-header-harsh-border-default: light-dark(var(--modes-color-generic-fg-soft-light), var(--modes-color-generic-fg-soft-dark));
|
|
2519
2520
|
--table-color-header-harsh-label-default: light-dark(var(--modes-color-interactive-monochrome-with-default-light), var(--modes-color-interactive-monochrome-with-default-dark));
|
|
2520
2521
|
--table-color-header-harsh-label-hover: light-dark(var(--modes-color-interactive-monochrome-default-light), var(--modes-color-interactive-monochrome-default-dark));
|
|
2522
|
+
--table-color-row-bg-active: light-dark(var(--modes-color-interactive-monochrome-frozen-active-alt-light), var(--modes-color-interactive-monochrome-frozen-active-alt-dark));
|
|
2521
2523
|
--table-color-row-border-default: light-dark(var(--modes-color-generic-fg-delicate-light), var(--modes-color-generic-fg-delicate-dark));
|
|
2522
|
-
--table-color-row-label-activated: light-dark(var(--modes-color-interactive-monochrome-with-active-light), var(--modes-color-interactive-monochrome-with-active-dark));
|
|
2523
|
-
--table-color-row-label-active: light-dark(var(--modes-color-interactive-monochrome-with-active-light), var(--modes-color-interactive-monochrome-with-active-dark));
|
|
2524
2524
|
--table-color-footer-border-default: light-dark(var(--modes-color-generic-fg-delicate-light), var(--modes-color-generic-fg-delicate-dark)); /* Header borders */
|
|
2525
2525
|
--table-color-footer-label-default: light-dark(var(--modes-color-interactive-monochrome-default-light), var(--modes-color-interactive-monochrome-default-dark));
|
|
2526
2526
|
--table-radius-container: var(--global-radius-container-m); /* Table (parent container) */
|