@common-origin/design-system 2.23.0 → 3.1.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +2 -2
- package/dist/client.js +2219 -1026
- package/dist/client.js.map +1 -1
- package/dist/components/atoms/Badge/Badge.d.mts +5 -12
- package/dist/components/atoms/Badge/Badge.d.ts +5 -12
- package/dist/components/atoms/Badge/Badge.mjs +0 -7
- package/dist/components/atoms/Badge/index.d.mts +1 -1
- package/dist/components/atoms/Badge/index.d.ts +1 -1
- package/dist/components/atoms/Box/Box.d.mts +22 -34
- package/dist/components/atoms/Box/Box.d.ts +22 -34
- package/dist/components/atoms/Box/Box.mjs +8 -11
- package/dist/components/atoms/Button/Button.d.mts +1 -4
- package/dist/components/atoms/Button/Button.d.ts +1 -4
- package/dist/components/atoms/Button/Button.mjs +3 -10
- package/dist/components/atoms/CategoryLabel/CategoryLabel.d.mts +4 -12
- package/dist/components/atoms/CategoryLabel/CategoryLabel.d.ts +4 -12
- package/dist/components/atoms/CategoryLabel/CategoryLabel.mjs +5 -16
- package/dist/components/atoms/Chip/Chip.d.mts +8 -20
- package/dist/components/atoms/Chip/Chip.d.ts +8 -20
- package/dist/components/atoms/Chip/Chip.mjs +20 -46
- package/dist/components/atoms/Chip/Chip.mjs.map +1 -1
- package/dist/components/atoms/Chip/FilterChip.d.mts +22 -10
- package/dist/components/atoms/Chip/FilterChip.d.ts +22 -10
- package/dist/components/atoms/Chip/FilterChip.mjs +66 -6
- package/dist/components/atoms/Chip/FilterChip.mjs.map +1 -1
- package/dist/components/atoms/Chip/InputChip.mjs +4 -6
- package/dist/components/atoms/Chip/InputChip.mjs.map +1 -1
- package/dist/components/atoms/Chip/index.d.mts +0 -1
- package/dist/components/atoms/Chip/index.d.ts +0 -1
- package/dist/components/atoms/Chip/shared/types.d.mts +9 -19
- package/dist/components/atoms/Chip/shared/types.d.ts +9 -19
- package/dist/components/atoms/Chip/shared/utils.d.mts +3 -3
- package/dist/components/atoms/Chip/shared/utils.d.ts +3 -3
- package/dist/components/atoms/Chip/shared/utils.mjs +4 -8
- package/dist/components/atoms/Chip/shared/utils.mjs.map +1 -1
- package/dist/components/atoms/DateFormatter/DateFormatter.d.mts +2 -5
- package/dist/components/atoms/DateFormatter/DateFormatter.d.ts +2 -5
- package/dist/components/atoms/DateFormatter/DateFormatter.mjs +0 -1
- package/dist/components/atoms/StatusLabel/StatusLabel.mjs +1 -4
- package/dist/components/atoms/StatusLabel/StatusLabel.mjs.map +1 -1
- package/dist/components/atoms/StatusLabel/StatusLabelBase.d.mts +5 -7
- package/dist/components/atoms/StatusLabel/StatusLabelBase.d.ts +5 -7
- package/dist/components/atoms/StatusLabel/StatusLabelBase.mjs +10 -12
- package/dist/components/atoms/Tag/Tag.d.mts +2 -4
- package/dist/components/atoms/Tag/Tag.d.ts +2 -4
- package/dist/components/atoms/Tag/Tag.mjs +0 -24
- package/dist/components/atoms/Tooltip/Tooltip.d.mts +41 -0
- package/dist/components/atoms/Tooltip/Tooltip.d.ts +41 -0
- package/dist/components/atoms/Tooltip/Tooltip.mjs +204 -0
- package/dist/components/atoms/Tooltip/Tooltip.mjs.map +1 -0
- package/dist/components/atoms/Tooltip/index.d.mts +2 -0
- package/dist/components/atoms/Tooltip/index.d.ts +2 -0
- package/dist/components/atoms/index.d.mts +1 -2
- package/dist/components/atoms/index.d.ts +1 -2
- package/dist/components/index.d.mts +1 -0
- package/dist/components/index.d.ts +1 -0
- package/dist/components/layout/GridSystem/GridSystem.d.mts +23 -18
- package/dist/components/layout/GridSystem/GridSystem.d.ts +23 -18
- package/dist/components/layout/GridSystem/GridSystem.mjs +7 -5
- package/dist/components/molecules/ActionSheet/ActionSheet.mjs +1 -0
- package/dist/components/molecules/AgentInput/AgentInput.d.mts +5 -0
- package/dist/components/molecules/AgentInput/AgentInput.d.ts +5 -0
- package/dist/components/molecules/AgentInput/AgentInput.mjs +1 -1
- package/dist/components/molecules/Alert/Alert.d.mts +1 -9
- package/dist/components/molecules/Alert/Alert.d.ts +1 -9
- package/dist/components/molecules/Alert/Alert.mjs +14 -27
- package/dist/components/molecules/ChipGroup/ChipGroup.d.mts +0 -1
- package/dist/components/molecules/ChipGroup/ChipGroup.d.ts +0 -1
- package/dist/components/molecules/ChipGroup/ChipGroup.mjs +2 -6
- package/dist/components/molecules/DateGroup/DateGroup.d.mts +1 -2
- package/dist/components/molecules/DateGroup/DateGroup.d.ts +1 -2
- package/dist/components/molecules/List/List.d.mts +2 -0
- package/dist/components/molecules/List/List.d.ts +2 -0
- package/dist/components/molecules/List/ListItem.d.mts +2 -0
- package/dist/components/molecules/List/ListItem.d.ts +2 -0
- package/dist/components/molecules/List/ListItem.mjs +5 -5
- package/dist/components/molecules/Menu/Menu.d.mts +117 -0
- package/dist/components/molecules/Menu/Menu.d.ts +117 -0
- package/dist/components/molecules/Menu/Menu.mjs +473 -0
- package/dist/components/molecules/Menu/Menu.mjs.map +1 -0
- package/dist/components/molecules/Menu/index.d.mts +2 -0
- package/dist/components/molecules/Menu/index.d.ts +2 -0
- package/dist/components/molecules/Modal/Modal.d.mts +0 -1
- package/dist/components/molecules/Modal/Modal.d.ts +0 -1
- package/dist/components/molecules/SearchField/SearchField.mjs +2 -0
- package/dist/components/molecules/SidebarNavItem/SidebarNavContext.d.mts +13 -0
- package/dist/components/molecules/SidebarNavItem/SidebarNavContext.d.ts +13 -0
- package/dist/components/molecules/SidebarNavItem/SidebarNavContext.mjs +13 -0
- package/dist/components/molecules/SidebarNavItem/SidebarNavContext.mjs.map +1 -0
- package/dist/components/molecules/SidebarNavItem/SidebarNavItem.d.mts +43 -0
- package/dist/components/molecules/SidebarNavItem/SidebarNavItem.d.ts +43 -0
- package/dist/components/molecules/SidebarNavItem/SidebarNavItem.mjs +148 -0
- package/dist/components/molecules/SidebarNavItem/SidebarNavItem.mjs.map +1 -0
- package/dist/components/molecules/SidebarNavItem/index.d.mts +2 -0
- package/dist/components/molecules/SidebarNavItem/index.d.ts +2 -0
- package/dist/components/molecules/SidebarNavSection/SidebarNavSection.d.mts +36 -0
- package/dist/components/molecules/SidebarNavSection/SidebarNavSection.d.ts +36 -0
- package/dist/components/molecules/SidebarNavSection/SidebarNavSection.mjs +188 -0
- package/dist/components/molecules/SidebarNavSection/SidebarNavSection.mjs.map +1 -0
- package/dist/components/molecules/SidebarNavSection/index.d.mts +2 -0
- package/dist/components/molecules/SidebarNavSection/index.d.ts +2 -0
- package/dist/components/molecules/TabBar/TabBar.d.mts +0 -13
- package/dist/components/molecules/TabBar/TabBar.d.ts +0 -13
- package/dist/components/molecules/TabBar/TabBar.mjs +2 -4
- package/dist/components/molecules/TabBar/index.d.mts +1 -1
- package/dist/components/molecules/TabBar/index.d.ts +1 -1
- package/dist/components/molecules/TransactionListItem/TransactionListItem.mjs +1 -1
- package/dist/components/molecules/WorkspaceSwitcher/WorkspaceSwitcher.d.mts +39 -0
- package/dist/components/molecules/WorkspaceSwitcher/WorkspaceSwitcher.d.ts +39 -0
- package/dist/components/molecules/WorkspaceSwitcher/WorkspaceSwitcher.mjs +131 -0
- package/dist/components/molecules/WorkspaceSwitcher/WorkspaceSwitcher.mjs.map +1 -0
- package/dist/components/molecules/WorkspaceSwitcher/index.d.mts +2 -0
- package/dist/components/molecules/WorkspaceSwitcher/index.d.ts +2 -0
- package/dist/components/molecules/index.d.mts +4 -1
- package/dist/components/molecules/index.d.ts +4 -1
- package/dist/components/organisms/SidebarNav/SidebarNav.d.mts +52 -0
- package/dist/components/organisms/SidebarNav/SidebarNav.d.ts +52 -0
- package/dist/components/organisms/SidebarNav/SidebarNav.mjs +235 -0
- package/dist/components/organisms/SidebarNav/SidebarNav.mjs.map +1 -0
- package/dist/components/organisms/SidebarNav/index.d.mts +2 -0
- package/dist/components/organisms/SidebarNav/index.d.ts +2 -0
- package/dist/components/organisms/index.d.mts +1 -0
- package/dist/components/organisms/index.d.ts +1 -0
- package/dist/data.js +72 -565
- package/dist/data.js.map +1 -1
- package/dist/index.js +11 -5
- package/dist/index.js.map +1 -1
- package/dist/index.mjs +7 -5
- package/dist/index.mjs.map +1 -1
- package/dist/lib/floatingPosition.d.mts +43 -0
- package/dist/lib/floatingPosition.d.ts +43 -0
- package/dist/lib/floatingPosition.mjs +86 -0
- package/dist/lib/floatingPosition.mjs.map +1 -0
- package/dist/lib/keyboardFocus.d.mts +6 -0
- package/dist/lib/keyboardFocus.d.ts +6 -0
- package/dist/lib/keyboardFocus.mjs +17 -0
- package/dist/lib/keyboardFocus.mjs.map +1 -0
- package/dist/lib/tokenAliases.d.mts +11 -11
- package/dist/lib/tokenAliases.d.ts +11 -11
- package/dist/lib/tokenAliases.mjs +13 -88
- package/dist/lib/tokenAliases.mjs.map +1 -1
- package/dist/lib/useFloatingLayer.d.mts +25 -0
- package/dist/lib/useFloatingLayer.d.ts +25 -0
- package/dist/lib/useFloatingLayer.mjs +86 -0
- package/dist/lib/useFloatingLayer.mjs.map +1 -0
- package/dist/styles/icons.json +30 -1
- package/dist/styles/icons.json.mjs +34 -3
- package/dist/styles/icons.json.mjs.map +1 -1
- package/dist/styles/tokens.d.mts +179 -2485
- package/dist/styles/tokens.d.ts +179 -2485
- package/dist/styles/tokens.json +39 -563
- package/dist/styles/tokens.json.mjs +39 -563
- package/dist/styles/tokens.json.mjs.map +1 -1
- package/dist/tokens/index.js +39 -563
- package/dist/tokens/index.js.map +1 -1
- package/dist/tokens/index.mjs +39 -563
- package/dist/tokens/index.mjs.map +1 -1
- package/dist/tokens/styles/tokens.d.mts +179 -2485
- package/dist/tokens/styles/tokens.d.ts +179 -2485
- package/dist/tokens.css +41 -493
- package/dist/types/icons.d.mts +1 -1
- package/dist/types/icons.d.ts +1 -1
- package/dist/types/icons.mjs.map +1 -1
- package/package.json +2 -2
- package/dist/components/atoms/CategoryBadge/CategoryBadge.d.mts +0 -29
- package/dist/components/atoms/CategoryBadge/CategoryBadge.d.ts +0 -29
- package/dist/components/atoms/CategoryBadge/CategoryBadge.mjs +0 -29
- package/dist/components/atoms/CategoryBadge/CategoryBadge.mjs.map +0 -1
- package/dist/components/atoms/CategoryBadge/index.d.mts +0 -2
- package/dist/components/atoms/CategoryBadge/index.d.ts +0 -2
- package/dist/components/atoms/Chip/BooleanChip.d.mts +0 -28
- package/dist/components/atoms/Chip/BooleanChip.d.ts +0 -28
- package/dist/components/atoms/Chip/BooleanChip.mjs +0 -76
- package/dist/components/atoms/Chip/BooleanChip.mjs.map +0 -1
- package/dist/components/atoms/StatusBadge/StatusBadge.d.mts +0 -24
- package/dist/components/atoms/StatusBadge/StatusBadge.d.ts +0 -24
- package/dist/components/atoms/StatusBadge/StatusBadge.mjs +0 -18
- package/dist/components/atoms/StatusBadge/StatusBadge.mjs.map +0 -1
- package/dist/components/atoms/StatusBadge/index.d.mts +0 -2
- package/dist/components/atoms/StatusBadge/index.d.ts +0 -2
- package/dist/components/molecules/PageTitle/PageTitle.d.mts +0 -21
- package/dist/components/molecules/PageTitle/PageTitle.d.ts +0 -21
- package/dist/components/molecules/PageTitle/PageTitle.mjs +0 -77
- package/dist/components/molecules/PageTitle/PageTitle.mjs.map +0 -1
- package/dist/components/molecules/PageTitle/index.d.mts +0 -1
- package/dist/components/molecules/PageTitle/index.d.ts +0 -1
package/dist/tokens.css
CHANGED
|
@@ -361,108 +361,6 @@
|
|
|
361
361
|
--co-base-color-magenta-alpha-1000: rgba(215, 0, 212, 1); /** Solid fill on hover. Composites to magenta.1000 over white. */
|
|
362
362
|
--co-base-color-magenta-alpha-1100: rgba(177, 0, 175, 1); /** Secondary text: at least 4.5:1 on 100 to 500 and white. Composites to magenta.1100 over white. */
|
|
363
363
|
--co-base-color-magenta-alpha-1200: rgba(37, 0, 35, 0.918); /** Primary text, and the darkest step. Composites to magenta.1200 over white. */
|
|
364
|
-
--co-base-color-neutral-100: #f8f9fa; /** Deprecated: The Bootstrap neutral ramp is replaced by the gray ramp, whose steps have different values and jobs (decision 0040). Removed in 3.0. */
|
|
365
|
-
--co-base-color-neutral-200: #e9ecef; /** Deprecated: The Bootstrap neutral ramp is replaced by the gray ramp, whose steps have different values and jobs (decision 0040). Removed in 3.0. */
|
|
366
|
-
--co-base-color-neutral-300: #dee2e6; /** Deprecated: The Bootstrap neutral ramp is replaced by the gray ramp, whose steps have different values and jobs (decision 0040). Removed in 3.0. */
|
|
367
|
-
--co-base-color-neutral-400: #ced4da; /** Deprecated: The Bootstrap neutral ramp is replaced by the gray ramp, whose steps have different values and jobs (decision 0040). Removed in 3.0. */
|
|
368
|
-
--co-base-color-neutral-500: #adb5bd; /** Deprecated: The Bootstrap neutral ramp is replaced by the gray ramp, whose steps have different values and jobs (decision 0040). Removed in 3.0. */
|
|
369
|
-
--co-base-color-neutral-600: #6c757d; /** Deprecated: The Bootstrap neutral ramp is replaced by the gray ramp, whose steps have different values and jobs (decision 0040). Removed in 3.0. */
|
|
370
|
-
--co-base-color-neutral-700: #495057; /** Deprecated: The Bootstrap neutral ramp is replaced by the gray ramp, whose steps have different values and jobs (decision 0040). Removed in 3.0. */
|
|
371
|
-
--co-base-color-neutral-800: #343a40; /** Deprecated: The Bootstrap neutral ramp is replaced by the gray ramp, whose steps have different values and jobs (decision 0040). Removed in 3.0. */
|
|
372
|
-
--co-base-color-neutral-900: #212529; /** Deprecated: The Bootstrap neutral ramp is replaced by the gray ramp, whose steps have different values and jobs (decision 0040). Removed in 3.0. */
|
|
373
|
-
--co-base-color-neutral-1000: #16191C; /** Deprecated: The Bootstrap neutral ramp is replaced by the gray ramp, whose steps have different values and jobs (decision 0040). Removed in 3.0. */
|
|
374
|
-
--co-base-color-neutral-000: #ffffff; /** Deprecated: The Bootstrap neutral ramp is replaced by the gray ramp (decision 0040); its white is base.color.white (decision 0049). Removed in 3.0. */
|
|
375
|
-
--co-base-color-green-100: #CEF8E0; /** Deprecated: The Spectrum 1 hue ramps are replaced by the role ramps (accent, success, warning, serious, danger, ai) and the display ramps (olive, periwinkle, rose, magenta), with different values (decisions 0040, 0043, 0044). Removed in 3.0. */
|
|
376
|
-
--co-base-color-green-200: #ADF4CE; /** Deprecated: The Spectrum 1 hue ramps are replaced by the role ramps (accent, success, warning, serious, danger, ai) and the display ramps (olive, periwinkle, rose, magenta), with different values (decisions 0040, 0043, 0044). Removed in 3.0. */
|
|
377
|
-
--co-base-color-green-300: #89ECBC; /** Deprecated: The Spectrum 1 hue ramps are replaced by the role ramps (accent, success, warning, serious, danger, ai) and the display ramps (olive, periwinkle, rose, magenta), with different values (decisions 0040, 0043, 0044). Removed in 3.0. */
|
|
378
|
-
--co-base-color-green-400: #67DEA8; /** Deprecated: The Spectrum 1 hue ramps are replaced by the role ramps (accent, success, warning, serious, danger, ai) and the display ramps (olive, periwinkle, rose, magenta), with different values (decisions 0040, 0043, 0044). Removed in 3.0. */
|
|
379
|
-
--co-base-color-green-500: #49CC93; /** Deprecated: The Spectrum 1 hue ramps are replaced by the role ramps (accent, success, warning, serious, danger, ai) and the display ramps (olive, periwinkle, rose, magenta), with different values (decisions 0040, 0043, 0044). Removed in 3.0. */
|
|
380
|
-
--co-base-color-green-600: #2FB880; /** Deprecated: The Spectrum 1 hue ramps are replaced by the role ramps (accent, success, warning, serious, danger, ai) and the display ramps (olive, periwinkle, rose, magenta), with different values (decisions 0040, 0043, 0044). Removed in 3.0. */
|
|
381
|
-
--co-base-color-green-700: #15A46E; /** Deprecated: The Spectrum 1 hue ramps are replaced by the role ramps (accent, success, warning, serious, danger, ai) and the display ramps (olive, periwinkle, rose, magenta), with different values (decisions 0040, 0043, 0044). Removed in 3.0. */
|
|
382
|
-
--co-base-color-green-800: #008F5D; /** Deprecated: The Spectrum 1 hue ramps are replaced by the role ramps (accent, success, warning, serious, danger, ai) and the display ramps (olive, periwinkle, rose, magenta), with different values (decisions 0040, 0043, 0044). Removed in 3.0. */
|
|
383
|
-
--co-base-color-green-900: #007A4D; /** Deprecated: The Spectrum 1 hue ramps are replaced by the role ramps (accent, success, warning, serious, danger, ai) and the display ramps (olive, periwinkle, rose, magenta), with different values (decisions 0040, 0043, 0044). Removed in 3.0. */
|
|
384
|
-
--co-base-color-green-1000: #00653E; /** Deprecated: The Spectrum 1 hue ramps are replaced by the role ramps (accent, success, warning, serious, danger, ai) and the display ramps (olive, periwinkle, rose, magenta), with different values (decisions 0040, 0043, 0044). Removed in 3.0. */
|
|
385
|
-
--co-base-color-green-1100: #005132; /** Deprecated: The Spectrum 1 hue ramps are replaced by the role ramps (accent, success, warning, serious, danger, ai) and the display ramps (olive, periwinkle, rose, magenta), with different values (decisions 0040, 0043, 0044). Removed in 3.0. */
|
|
386
|
-
--co-base-color-green-1200: #053F27; /** Deprecated: The Spectrum 1 hue ramps are replaced by the role ramps (accent, success, warning, serious, danger, ai) and the display ramps (olive, periwinkle, rose, magenta), with different values (decisions 0040, 0043, 0044). Removed in 3.0. */
|
|
387
|
-
--co-base-color-green-1300: #0A2E1D; /** Deprecated: The Spectrum 1 hue ramps are replaced by the role ramps (accent, success, warning, serious, danger, ai) and the display ramps (olive, periwinkle, rose, magenta), with different values (decisions 0040, 0043, 0044). Removed in 3.0. */
|
|
388
|
-
--co-base-color-orange-100: #FFECCC; /** Deprecated: The Spectrum 1 hue ramps are replaced by the role ramps (accent, success, warning, serious, danger, ai) and the display ramps (olive, periwinkle, rose, magenta), with different values (decisions 0040, 0043, 0044). Removed in 3.0. */
|
|
389
|
-
--co-base-color-orange-200: #FFDFAD; /** Deprecated: The Spectrum 1 hue ramps are replaced by the role ramps (accent, success, warning, serious, danger, ai) and the display ramps (olive, periwinkle, rose, magenta), with different values (decisions 0040, 0043, 0044). Removed in 3.0. */
|
|
390
|
-
--co-base-color-orange-300: #FDD291; /** Deprecated: The Spectrum 1 hue ramps are replaced by the role ramps (accent, success, warning, serious, danger, ai) and the display ramps (olive, periwinkle, rose, magenta), with different values (decisions 0040, 0043, 0044). Removed in 3.0. */
|
|
391
|
-
--co-base-color-orange-400: #FFBB63; /** Deprecated: The Spectrum 1 hue ramps are replaced by the role ramps (accent, success, warning, serious, danger, ai) and the display ramps (olive, periwinkle, rose, magenta), with different values (decisions 0040, 0043, 0044). Removed in 3.0. */
|
|
392
|
-
--co-base-color-orange-500: #FFA037; /** Deprecated: The Spectrum 1 hue ramps are replaced by the role ramps (accent, success, warning, serious, danger, ai) and the display ramps (olive, periwinkle, rose, magenta), with different values (decisions 0040, 0043, 0044). Removed in 3.0. */
|
|
393
|
-
--co-base-color-orange-600: #F68511; /** Deprecated: The Spectrum 1 hue ramps are replaced by the role ramps (accent, success, warning, serious, danger, ai) and the display ramps (olive, periwinkle, rose, magenta), with different values (decisions 0040, 0043, 0044). Removed in 3.0. */
|
|
394
|
-
--co-base-color-orange-700: #E46F00; /** Deprecated: The Spectrum 1 hue ramps are replaced by the role ramps (accent, success, warning, serious, danger, ai) and the display ramps (olive, periwinkle, rose, magenta), with different values (decisions 0040, 0043, 0044). Removed in 3.0. */
|
|
395
|
-
--co-base-color-orange-800: #CB5D00; /** Deprecated: The Spectrum 1 hue ramps are replaced by the role ramps (accent, success, warning, serious, danger, ai) and the display ramps (olive, periwinkle, rose, magenta), with different values (decisions 0040, 0043, 0044). Removed in 3.0. */
|
|
396
|
-
--co-base-color-orange-900: #B14C00; /** Deprecated: The Spectrum 1 hue ramps are replaced by the role ramps (accent, success, warning, serious, danger, ai) and the display ramps (olive, periwinkle, rose, magenta), with different values (decisions 0040, 0043, 0044). Removed in 3.0. */
|
|
397
|
-
--co-base-color-orange-1000: #953D00; /** Deprecated: The Spectrum 1 hue ramps are replaced by the role ramps (accent, success, warning, serious, danger, ai) and the display ramps (olive, periwinkle, rose, magenta), with different values (decisions 0040, 0043, 0044). Removed in 3.0. */
|
|
398
|
-
--co-base-color-orange-1100: #7A2F00; /** Deprecated: The Spectrum 1 hue ramps are replaced by the role ramps (accent, success, warning, serious, danger, ai) and the display ramps (olive, periwinkle, rose, magenta), with different values (decisions 0040, 0043, 0044). Removed in 3.0. */
|
|
399
|
-
--co-base-color-orange-1200: #612300; /** Deprecated: The Spectrum 1 hue ramps are replaced by the role ramps (accent, success, warning, serious, danger, ai) and the display ramps (olive, periwinkle, rose, magenta), with different values (decisions 0040, 0043, 0044). Removed in 3.0. */
|
|
400
|
-
--co-base-color-orange-1300: #491901; /** Deprecated: The Spectrum 1 hue ramps are replaced by the role ramps (accent, success, warning, serious, danger, ai) and the display ramps (olive, periwinkle, rose, magenta), with different values (decisions 0040, 0043, 0044). Removed in 3.0. */
|
|
401
|
-
--co-base-color-red-100: #FFEBE7; /** Deprecated: The Spectrum 1 hue ramps are replaced by the role ramps (accent, success, warning, serious, danger, ai) and the display ramps (olive, periwinkle, rose, magenta), with different values (decisions 0040, 0043, 0044). Removed in 3.0. */
|
|
402
|
-
--co-base-color-red-200: #FFDDD6; /** Deprecated: The Spectrum 1 hue ramps are replaced by the role ramps (accent, success, warning, serious, danger, ai) and the display ramps (olive, periwinkle, rose, magenta), with different values (decisions 0040, 0043, 0044). Removed in 3.0. */
|
|
403
|
-
--co-base-color-red-300: #FFCDC3; /** Deprecated: The Spectrum 1 hue ramps are replaced by the role ramps (accent, success, warning, serious, danger, ai) and the display ramps (olive, periwinkle, rose, magenta), with different values (decisions 0040, 0043, 0044). Removed in 3.0. */
|
|
404
|
-
--co-base-color-red-400: #FFB7A9; /** Deprecated: The Spectrum 1 hue ramps are replaced by the role ramps (accent, success, warning, serious, danger, ai) and the display ramps (olive, periwinkle, rose, magenta), with different values (decisions 0040, 0043, 0044). Removed in 3.0. */
|
|
405
|
-
--co-base-color-red-500: #FF9B88; /** Deprecated: The Spectrum 1 hue ramps are replaced by the role ramps (accent, success, warning, serious, danger, ai) and the display ramps (olive, periwinkle, rose, magenta), with different values (decisions 0040, 0043, 0044). Removed in 3.0. */
|
|
406
|
-
--co-base-color-red-600: #FF7C65; /** Deprecated: The Spectrum 1 hue ramps are replaced by the role ramps (accent, success, warning, serious, danger, ai) and the display ramps (olive, periwinkle, rose, magenta), with different values (decisions 0040, 0043, 0044). Removed in 3.0. */
|
|
407
|
-
--co-base-color-red-700: #F75C46; /** Deprecated: The Spectrum 1 hue ramps are replaced by the role ramps (accent, success, warning, serious, danger, ai) and the display ramps (olive, periwinkle, rose, magenta), with different values (decisions 0040, 0043, 0044). Removed in 3.0. */
|
|
408
|
-
--co-base-color-red-800: #EA3829; /** Deprecated: The Spectrum 1 hue ramps are replaced by the role ramps (accent, success, warning, serious, danger, ai) and the display ramps (olive, periwinkle, rose, magenta), with different values (decisions 0040, 0043, 0044). Removed in 3.0. */
|
|
409
|
-
--co-base-color-red-900: #D31510; /** Deprecated: The Spectrum 1 hue ramps are replaced by the role ramps (accent, success, warning, serious, danger, ai) and the display ramps (olive, periwinkle, rose, magenta), with different values (decisions 0040, 0043, 0044). Removed in 3.0. */
|
|
410
|
-
--co-base-color-red-1000: #B40000; /** Deprecated: The Spectrum 1 hue ramps are replaced by the role ramps (accent, success, warning, serious, danger, ai) and the display ramps (olive, periwinkle, rose, magenta), with different values (decisions 0040, 0043, 0044). Removed in 3.0. */
|
|
411
|
-
--co-base-color-red-1100: #930000; /** Deprecated: The Spectrum 1 hue ramps are replaced by the role ramps (accent, success, warning, serious, danger, ai) and the display ramps (olive, periwinkle, rose, magenta), with different values (decisions 0040, 0043, 0044). Removed in 3.0. */
|
|
412
|
-
--co-base-color-red-1200: #740000; /** Deprecated: The Spectrum 1 hue ramps are replaced by the role ramps (accent, success, warning, serious, danger, ai) and the display ramps (olive, periwinkle, rose, magenta), with different values (decisions 0040, 0043, 0044). Removed in 3.0. */
|
|
413
|
-
--co-base-color-red-1300: #590000; /** Deprecated: The Spectrum 1 hue ramps are replaced by the role ramps (accent, success, warning, serious, danger, ai) and the display ramps (olive, periwinkle, rose, magenta), with different values (decisions 0040, 0043, 0044). Removed in 3.0. */
|
|
414
|
-
--co-base-color-blue-100: #E0F2FF; /** Deprecated: The Spectrum 1 hue ramps are replaced by the role ramps (accent, success, warning, serious, danger, ai) and the display ramps (olive, periwinkle, rose, magenta), with different values (decisions 0040, 0043, 0044). Removed in 3.0. */
|
|
415
|
-
--co-base-color-blue-200: #CAE8FF; /** Deprecated: The Spectrum 1 hue ramps are replaced by the role ramps (accent, success, warning, serious, danger, ai) and the display ramps (olive, periwinkle, rose, magenta), with different values (decisions 0040, 0043, 0044). Removed in 3.0. */
|
|
416
|
-
--co-base-color-blue-300: #B5DEFF; /** Deprecated: The Spectrum 1 hue ramps are replaced by the role ramps (accent, success, warning, serious, danger, ai) and the display ramps (olive, periwinkle, rose, magenta), with different values (decisions 0040, 0043, 0044). Removed in 3.0. */
|
|
417
|
-
--co-base-color-blue-400: #96CEFD; /** Deprecated: The Spectrum 1 hue ramps are replaced by the role ramps (accent, success, warning, serious, danger, ai) and the display ramps (olive, periwinkle, rose, magenta), with different values (decisions 0040, 0043, 0044). Removed in 3.0. */
|
|
418
|
-
--co-base-color-blue-500: #78BBFA; /** Deprecated: The Spectrum 1 hue ramps are replaced by the role ramps (accent, success, warning, serious, danger, ai) and the display ramps (olive, periwinkle, rose, magenta), with different values (decisions 0040, 0043, 0044). Removed in 3.0. */
|
|
419
|
-
--co-base-color-blue-600: #59A7F6; /** Deprecated: The Spectrum 1 hue ramps are replaced by the role ramps (accent, success, warning, serious, danger, ai) and the display ramps (olive, periwinkle, rose, magenta), with different values (decisions 0040, 0043, 0044). Removed in 3.0. */
|
|
420
|
-
--co-base-color-blue-700: #3892F3; /** Deprecated: The Spectrum 1 hue ramps are replaced by the role ramps (accent, success, warning, serious, danger, ai) and the display ramps (olive, periwinkle, rose, magenta), with different values (decisions 0040, 0043, 0044). Removed in 3.0. */
|
|
421
|
-
--co-base-color-blue-800: #147AF3; /** Deprecated: The Spectrum 1 hue ramps are replaced by the role ramps (accent, success, warning, serious, danger, ai) and the display ramps (olive, periwinkle, rose, magenta), with different values (decisions 0040, 0043, 0044). Removed in 3.0. */
|
|
422
|
-
--co-base-color-blue-900: #0265DC; /** Deprecated: The Spectrum 1 hue ramps are replaced by the role ramps (accent, success, warning, serious, danger, ai) and the display ramps (olive, periwinkle, rose, magenta), with different values (decisions 0040, 0043, 0044). Removed in 3.0. */
|
|
423
|
-
--co-base-color-blue-1000: #0054B6; /** Deprecated: The Spectrum 1 hue ramps are replaced by the role ramps (accent, success, warning, serious, danger, ai) and the display ramps (olive, periwinkle, rose, magenta), with different values (decisions 0040, 0043, 0044). Removed in 3.0. */
|
|
424
|
-
--co-base-color-blue-1100: #004491; /** Deprecated: The Spectrum 1 hue ramps are replaced by the role ramps (accent, success, warning, serious, danger, ai) and the display ramps (olive, periwinkle, rose, magenta), with different values (decisions 0040, 0043, 0044). Removed in 3.0. */
|
|
425
|
-
--co-base-color-blue-1200: #003571; /** Deprecated: The Spectrum 1 hue ramps are replaced by the role ramps (accent, success, warning, serious, danger, ai) and the display ramps (olive, periwinkle, rose, magenta), with different values (decisions 0040, 0043, 0044). Removed in 3.0. */
|
|
426
|
-
--co-base-color-blue-1300: #002754; /** Deprecated: The Spectrum 1 hue ramps are replaced by the role ramps (accent, success, warning, serious, danger, ai) and the display ramps (olive, periwinkle, rose, magenta), with different values (decisions 0040, 0043, 0044). Removed in 3.0. */
|
|
427
|
-
--co-base-color-purple-100: #F9F0FF; /** Deprecated: The Spectrum 1 hue ramps are replaced by the role ramps (accent, success, warning, serious, danger, ai) and the display ramps (olive, periwinkle, rose, magenta), with different values (decisions 0040, 0043, 0044). Removed in 3.0. */
|
|
428
|
-
--co-base-color-purple-200: #F4E1FF; /** Deprecated: The Spectrum 1 hue ramps are replaced by the role ramps (accent, success, warning, serious, danger, ai) and the display ramps (olive, periwinkle, rose, magenta), with different values (decisions 0040, 0043, 0044). Removed in 3.0. */
|
|
429
|
-
--co-base-color-purple-300: #EDD0FF; /** Deprecated: The Spectrum 1 hue ramps are replaced by the role ramps (accent, success, warning, serious, danger, ai) and the display ramps (olive, periwinkle, rose, magenta), with different values (decisions 0040, 0043, 0044). Removed in 3.0. */
|
|
430
|
-
--co-base-color-purple-400: #E3B8FF; /** Deprecated: The Spectrum 1 hue ramps are replaced by the role ramps (accent, success, warning, serious, danger, ai) and the display ramps (olive, periwinkle, rose, magenta), with different values (decisions 0040, 0043, 0044). Removed in 3.0. */
|
|
431
|
-
--co-base-color-purple-500: #D59DFF; /** Deprecated: The Spectrum 1 hue ramps are replaced by the role ramps (accent, success, warning, serious, danger, ai) and the display ramps (olive, periwinkle, rose, magenta), with different values (decisions 0040, 0043, 0044). Removed in 3.0. */
|
|
432
|
-
--co-base-color-purple-600: #C27EF7; /** Deprecated: The Spectrum 1 hue ramps are replaced by the role ramps (accent, success, warning, serious, danger, ai) and the display ramps (olive, periwinkle, rose, magenta), with different values (decisions 0040, 0043, 0044). Removed in 3.0. */
|
|
433
|
-
--co-base-color-purple-700: #AD5FE8; /** Deprecated: The Spectrum 1 hue ramps are replaced by the role ramps (accent, success, warning, serious, danger, ai) and the display ramps (olive, periwinkle, rose, magenta), with different values (decisions 0040, 0043, 0044). Removed in 3.0. */
|
|
434
|
-
--co-base-color-purple-800: #9644D4; /** Deprecated: The Spectrum 1 hue ramps are replaced by the role ramps (accent, success, warning, serious, danger, ai) and the display ramps (olive, periwinkle, rose, magenta), with different values (decisions 0040, 0043, 0044). Removed in 3.0. */
|
|
435
|
-
--co-base-color-purple-900: #7E2EBD; /** Deprecated: The Spectrum 1 hue ramps are replaced by the role ramps (accent, success, warning, serious, danger, ai) and the display ramps (olive, periwinkle, rose, magenta), with different values (decisions 0040, 0043, 0044). Removed in 3.0. */
|
|
436
|
-
--co-base-color-purple-1000: #67229F; /** Deprecated: The Spectrum 1 hue ramps are replaced by the role ramps (accent, success, warning, serious, danger, ai) and the display ramps (olive, periwinkle, rose, magenta), with different values (decisions 0040, 0043, 0044). Removed in 3.0. */
|
|
437
|
-
--co-base-color-purple-1100: #511882; /** Deprecated: The Spectrum 1 hue ramps are replaced by the role ramps (accent, success, warning, serious, danger, ai) and the display ramps (olive, periwinkle, rose, magenta), with different values (decisions 0040, 0043, 0044). Removed in 3.0. */
|
|
438
|
-
--co-base-color-purple-1200: #3D1066; /** Deprecated: The Spectrum 1 hue ramps are replaced by the role ramps (accent, success, warning, serious, danger, ai) and the display ramps (olive, periwinkle, rose, magenta), with different values (decisions 0040, 0043, 0044). Removed in 3.0. */
|
|
439
|
-
--co-base-color-purple-1300: #2B0A4D; /** Deprecated: The Spectrum 1 hue ramps are replaced by the role ramps (accent, success, warning, serious, danger, ai) and the display ramps (olive, periwinkle, rose, magenta), with different values (decisions 0040, 0043, 0044). Removed in 3.0. */
|
|
440
|
-
--co-base-color-pink-100: #FFEFF9; /** Deprecated: The Spectrum 1 hue ramps are replaced by the role ramps (accent, success, warning, serious, danger, ai) and the display ramps (olive, periwinkle, rose, magenta), with different values (decisions 0040, 0043, 0044). Removed in 3.0. */
|
|
441
|
-
--co-base-color-pink-200: #FFDFF4; /** Deprecated: The Spectrum 1 hue ramps are replaced by the role ramps (accent, success, warning, serious, danger, ai) and the display ramps (olive, periwinkle, rose, magenta), with different values (decisions 0040, 0043, 0044). Removed in 3.0. */
|
|
442
|
-
--co-base-color-pink-300: #FFCBED; /** Deprecated: The Spectrum 1 hue ramps are replaced by the role ramps (accent, success, warning, serious, danger, ai) and the display ramps (olive, periwinkle, rose, magenta), with different values (decisions 0040, 0043, 0044). Removed in 3.0. */
|
|
443
|
-
--co-base-color-pink-400: #FFB0E3; /** Deprecated: The Spectrum 1 hue ramps are replaced by the role ramps (accent, success, warning, serious, danger, ai) and the display ramps (olive, periwinkle, rose, magenta), with different values (decisions 0040, 0043, 0044). Removed in 3.0. */
|
|
444
|
-
--co-base-color-pink-500: #FF8ED4; /** Deprecated: The Spectrum 1 hue ramps are replaced by the role ramps (accent, success, warning, serious, danger, ai) and the display ramps (olive, periwinkle, rose, magenta), with different values (decisions 0040, 0043, 0044). Removed in 3.0. */
|
|
445
|
-
--co-base-color-pink-600: #FF69C1; /** Deprecated: The Spectrum 1 hue ramps are replaced by the role ramps (accent, success, warning, serious, danger, ai) and the display ramps (olive, periwinkle, rose, magenta), with different values (decisions 0040, 0043, 0044). Removed in 3.0. */
|
|
446
|
-
--co-base-color-pink-700: #FF42AB; /** Deprecated: The Spectrum 1 hue ramps are replaced by the role ramps (accent, success, warning, serious, danger, ai) and the display ramps (olive, periwinkle, rose, magenta), with different values (decisions 0040, 0043, 0044). Removed in 3.0. */
|
|
447
|
-
--co-base-color-pink-800: #F31A93; /** Deprecated: The Spectrum 1 hue ramps are replaced by the role ramps (accent, success, warning, serious, danger, ai) and the display ramps (olive, periwinkle, rose, magenta), with different values (decisions 0040, 0043, 0044). Removed in 3.0. */
|
|
448
|
-
--co-base-color-pink-900: #DC007B; /** Deprecated: The Spectrum 1 hue ramps are replaced by the role ramps (accent, success, warning, serious, danger, ai) and the display ramps (olive, periwinkle, rose, magenta), with different values (decisions 0040, 0043, 0044). Removed in 3.0. */
|
|
449
|
-
--co-base-color-pink-1000: #B90064; /** Deprecated: The Spectrum 1 hue ramps are replaced by the role ramps (accent, success, warning, serious, danger, ai) and the display ramps (olive, periwinkle, rose, magenta), with different values (decisions 0040, 0043, 0044). Removed in 3.0. */
|
|
450
|
-
--co-base-color-pink-1100: #97004E; /** Deprecated: The Spectrum 1 hue ramps are replaced by the role ramps (accent, success, warning, serious, danger, ai) and the display ramps (olive, periwinkle, rose, magenta), with different values (decisions 0040, 0043, 0044). Removed in 3.0. */
|
|
451
|
-
--co-base-color-pink-1200: #78003A; /** Deprecated: The Spectrum 1 hue ramps are replaced by the role ramps (accent, success, warning, serious, danger, ai) and the display ramps (olive, periwinkle, rose, magenta), with different values (decisions 0040, 0043, 0044). Removed in 3.0. */
|
|
452
|
-
--co-base-color-pink-1300: #5C0029; /** Deprecated: The Spectrum 1 hue ramps are replaced by the role ramps (accent, success, warning, serious, danger, ai) and the display ramps (olive, periwinkle, rose, magenta), with different values (decisions 0040, 0043, 0044). Removed in 3.0. */
|
|
453
|
-
--co-base-color-yellow-100: #FFF3D6; /** Deprecated: The Spectrum 1 hue ramps are replaced by the role ramps (accent, success, warning, serious, danger, ai) and the display ramps (olive, periwinkle, rose, magenta), with different values (decisions 0040, 0043, 0044). Removed in 3.0. */
|
|
454
|
-
--co-base-color-yellow-200: #FFE9B3; /** Deprecated: The Spectrum 1 hue ramps are replaced by the role ramps (accent, success, warning, serious, danger, ai) and the display ramps (olive, periwinkle, rose, magenta), with different values (decisions 0040, 0043, 0044). Removed in 3.0. */
|
|
455
|
-
--co-base-color-yellow-300: #FFDE8F; /** Deprecated: The Spectrum 1 hue ramps are replaced by the role ramps (accent, success, warning, serious, danger, ai) and the display ramps (olive, periwinkle, rose, magenta), with different values (decisions 0040, 0043, 0044). Removed in 3.0. */
|
|
456
|
-
--co-base-color-yellow-400: #FFD162; /** Deprecated: The Spectrum 1 hue ramps are replaced by the role ramps (accent, success, warning, serious, danger, ai) and the display ramps (olive, periwinkle, rose, magenta), with different values (decisions 0040, 0043, 0044). Removed in 3.0. */
|
|
457
|
-
--co-base-color-yellow-500: #FFC233; /** Deprecated: The Spectrum 1 hue ramps are replaced by the role ramps (accent, success, warning, serious, danger, ai) and the display ramps (olive, periwinkle, rose, magenta), with different values (decisions 0040, 0043, 0044). Removed in 3.0. */
|
|
458
|
-
--co-base-color-yellow-600: #EDAD0A; /** Deprecated: The Spectrum 1 hue ramps are replaced by the role ramps (accent, success, warning, serious, danger, ai) and the display ramps (olive, periwinkle, rose, magenta), with different values (decisions 0040, 0043, 0044). Removed in 3.0. */
|
|
459
|
-
--co-base-color-yellow-700: #D39700; /** Deprecated: The Spectrum 1 hue ramps are replaced by the role ramps (accent, success, warning, serious, danger, ai) and the display ramps (olive, periwinkle, rose, magenta), with different values (decisions 0040, 0043, 0044). Removed in 3.0. */
|
|
460
|
-
--co-base-color-yellow-800: #B88100; /** Deprecated: The Spectrum 1 hue ramps are replaced by the role ramps (accent, success, warning, serious, danger, ai) and the display ramps (olive, periwinkle, rose, magenta), with different values (decisions 0040, 0043, 0044). Removed in 3.0. */
|
|
461
|
-
--co-base-color-yellow-900: #9D6C00; /** Deprecated: The Spectrum 1 hue ramps are replaced by the role ramps (accent, success, warning, serious, danger, ai) and the display ramps (olive, periwinkle, rose, magenta), with different values (decisions 0040, 0043, 0044). Removed in 3.0. */
|
|
462
|
-
--co-base-color-yellow-1000: #825800; /** Deprecated: The Spectrum 1 hue ramps are replaced by the role ramps (accent, success, warning, serious, danger, ai) and the display ramps (olive, periwinkle, rose, magenta), with different values (decisions 0040, 0043, 0044). Removed in 3.0. */
|
|
463
|
-
--co-base-color-yellow-1100: #694600; /** Deprecated: The Spectrum 1 hue ramps are replaced by the role ramps (accent, success, warning, serious, danger, ai) and the display ramps (olive, periwinkle, rose, magenta), with different values (decisions 0040, 0043, 0044). Removed in 3.0. */
|
|
464
|
-
--co-base-color-yellow-1200: #523600; /** Deprecated: The Spectrum 1 hue ramps are replaced by the role ramps (accent, success, warning, serious, danger, ai) and the display ramps (olive, periwinkle, rose, magenta), with different values (decisions 0040, 0043, 0044). Removed in 3.0. */
|
|
465
|
-
--co-base-color-yellow-1300: #3D2800; /** Deprecated: The Spectrum 1 hue ramps are replaced by the role ramps (accent, success, warning, serious, danger, ai) and the display ramps (olive, periwinkle, rose, magenta), with different values (decisions 0040, 0043, 0044). Removed in 3.0. */
|
|
466
364
|
--co-base-spacing-auto: auto;
|
|
467
365
|
--co-base-font-family-heading: 'Inter', sans-serif;
|
|
468
366
|
--co-base-font-family-body: 'Inter', sans-serif;
|
|
@@ -525,87 +423,11 @@
|
|
|
525
423
|
--co-base-easing-ease-in-back: cubic-bezier(0.36, 0, 0.66, -0.56);
|
|
526
424
|
--co-base-easing-ease-out-back: cubic-bezier(0.34, 1.56, 0.64, 1);
|
|
527
425
|
--co-base-easing-ease-in-out-back: cubic-bezier(0.68, -0.6, 0.32, 1.6);
|
|
528
|
-
--co-component-button-focus-outline-offset: 2px; /** Deprecated: Use semantic.border.focusOffset (decision 0022). Removed in 3.0. */
|
|
529
|
-
--co-component-chip-focus-outline-offset: 2px; /** Deprecated: Use semantic.border.focusOffset (decision 0022). Removed in 3.0. */
|
|
530
|
-
--co-component-icon-button-primary-min-width: 40px; /** Deprecated: No IconButton reads it: sizes take their minimum width from semantic.size.control (decision 0034). Removed in 3.0. */
|
|
531
|
-
--co-component-icon-button-primary-min-height: 40px; /** Deprecated: No IconButton reads it: sizes take their minimum height from semantic.size.control (decision 0034). Removed in 3.0. */
|
|
532
|
-
--co-component-icon-button-primary-display: flex; /** Deprecated: Layout mechanics stay in component code (decision 0014, rule 5); IconButton sets display: flex itself. Removed in 3.0. */
|
|
533
|
-
--co-component-icon-button-primary-align-items: center; /** Deprecated: Layout mechanics stay in component code (decision 0014, rule 5); IconButton sets align-items: center itself. Removed in 3.0. */
|
|
534
|
-
--co-component-icon-button-primary-justify-content: center; /** Deprecated: Layout mechanics stay in component code (decision 0014, rule 5); IconButton sets justify-content: center itself. Removed in 3.0. */
|
|
535
|
-
--co-component-icon-button-focus-outline-offset: 2px; /** Deprecated: Use semantic.border.focusOffset (decision 0022). Removed in 3.0. */
|
|
536
|
-
--co-component-icon-button-sizes-small-min-width: 32px; /** Deprecated: IconButton takes its minimum width from semantic.size.control.sm (decision 0034). Removed in 3.0. */
|
|
537
|
-
--co-component-icon-button-sizes-small-min-height: 32px; /** Deprecated: IconButton takes its minimum height from semantic.size.control.sm (decision 0034). Removed in 3.0. */
|
|
538
|
-
--co-component-icon-button-sizes-medium-min-width: 40px; /** Deprecated: IconButton takes its minimum width from semantic.size.control.md (decision 0034). Removed in 3.0. */
|
|
539
|
-
--co-component-icon-button-sizes-medium-min-height: 40px; /** Deprecated: IconButton takes its minimum height from semantic.size.control.md (decision 0034). Removed in 3.0. */
|
|
540
|
-
--co-component-icon-button-sizes-large-min-width: 48px; /** Deprecated: IconButton takes its minimum width from semantic.size.control.lg (decision 0034). Removed in 3.0. */
|
|
541
|
-
--co-component-icon-button-sizes-large-min-height: 48px; /** Deprecated: IconButton takes its minimum height from semantic.size.control.lg (decision 0034). Removed in 3.0. */
|
|
542
|
-
--co-component-input-default-padding-y: 11px; /** Deprecated: Single-line fields take their min-height from semantic.size.control.lg with no vertical padding (decisions 0022 and 0034). Removed in 3.0. */
|
|
543
|
-
--co-component-input-focus-outline-offset: 2px; /** Deprecated: Use semantic.border.focusOffset (decision 0022). Removed in 3.0. */
|
|
544
|
-
--co-component-input-error-focus-outline-offset: 2px; /** Deprecated: Use semantic.border.focusOffset (decision 0022). Removed in 3.0. */
|
|
545
|
-
--co-component-input-disabled-cursor: not-allowed; /** Deprecated: Behaviour, not a design decision, stays in component code (decision 0014, rule 5); inputs set cursor: not-allowed themselves. Removed in 3.0. */
|
|
546
426
|
--co-semantic-elevation-inset: inset 0 2px 4px 0 rgba(0, 0, 0, 0.06); /** Sunken/pressed states, input fields, wells */
|
|
547
|
-
--co-semantic-border-radius-none: 0; /** Deprecated: Renamed to semantic.radius.none by the semantic grammar (decision 0031). Removed in 3.0. */
|
|
548
|
-
--co-semantic-color-background-inverse-overlay: rgba(255, 255, 255, 0.2); /** Deprecated: Renamed to semantic.color.fill.inverse-none-hover by the semantic grammar (decision 0031). Removed in 3.0. */
|
|
549
427
|
--co-semantic-color-fill-none-hover: rgba(34, 34, 34, 0.1); /** Hover tint for a fill-less control over any background, such as a chip close button. */
|
|
550
428
|
--co-semantic-color-fill-none-pressed: rgba(34, 34, 34, 0.15); /** Pressed tint for a fill-less control over any background, such as a chip close button. */
|
|
551
429
|
--co-semantic-color-fill-inverse-none-hover: rgba(255, 255, 255, 0.2); /** Hover tint for a fill-less element on a dark background, such as a count on a dark tab. */
|
|
552
430
|
--co-semantic-surface-scrim: rgba(34, 34, 34, 0.5); /** Backdrop behind a modal surface: Modal, Sheet, ActionSheet. */
|
|
553
|
-
--co-base-size-0: var(--co-base-dimension-0); /** Deprecated: base.size and base.spacing were two copies of one 4px scale, merged into base.dimension (#188). Removed in 3.0. */
|
|
554
|
-
--co-base-size-1: var(--co-base-dimension-1); /** Deprecated: base.size and base.spacing were two copies of one 4px scale, merged into base.dimension (#188). Removed in 3.0. */
|
|
555
|
-
--co-base-size-2: var(--co-base-dimension-2); /** Deprecated: base.size and base.spacing were two copies of one 4px scale, merged into base.dimension (#188). Removed in 3.0. */
|
|
556
|
-
--co-base-size-3: var(--co-base-dimension-3); /** Deprecated: base.size and base.spacing were two copies of one 4px scale, merged into base.dimension (#188). Removed in 3.0. */
|
|
557
|
-
--co-base-size-4: var(--co-base-dimension-4); /** Deprecated: base.size and base.spacing were two copies of one 4px scale, merged into base.dimension (#188). Removed in 3.0. */
|
|
558
|
-
--co-base-size-5: var(--co-base-dimension-5); /** Deprecated: base.size and base.spacing were two copies of one 4px scale, merged into base.dimension (#188). Removed in 3.0. */
|
|
559
|
-
--co-base-size-6: var(--co-base-dimension-6); /** Deprecated: base.size and base.spacing were two copies of one 4px scale, merged into base.dimension (#188). Removed in 3.0. */
|
|
560
|
-
--co-base-size-7: var(--co-base-dimension-7); /** Deprecated: base.size and base.spacing were two copies of one 4px scale, merged into base.dimension (#188). Removed in 3.0. */
|
|
561
|
-
--co-base-size-8: var(--co-base-dimension-8); /** Deprecated: base.size and base.spacing were two copies of one 4px scale, merged into base.dimension (#188). Removed in 3.0. */
|
|
562
|
-
--co-base-size-9: var(--co-base-dimension-9); /** Deprecated: base.size and base.spacing were two copies of one 4px scale, merged into base.dimension (#188). Removed in 3.0. */
|
|
563
|
-
--co-base-size-10: var(--co-base-dimension-10); /** Deprecated: base.size and base.spacing were two copies of one 4px scale, merged into base.dimension (#188). Removed in 3.0. */
|
|
564
|
-
--co-base-size-11: var(--co-base-dimension-11); /** Deprecated: base.size and base.spacing were two copies of one 4px scale, merged into base.dimension (#188). Removed in 3.0. */
|
|
565
|
-
--co-base-size-12: var(--co-base-dimension-12); /** Deprecated: base.size and base.spacing were two copies of one 4px scale, merged into base.dimension (#188). Removed in 3.0. */
|
|
566
|
-
--co-base-size-14: var(--co-base-dimension-14); /** Deprecated: base.size and base.spacing were two copies of one 4px scale, merged into base.dimension (#188). Removed in 3.0. */
|
|
567
|
-
--co-base-size-15: var(--co-base-dimension-15); /** Deprecated: base.size and base.spacing were two copies of one 4px scale, merged into base.dimension (#188). Removed in 3.0. */
|
|
568
|
-
--co-base-size-16: var(--co-base-dimension-16); /** Deprecated: base.size and base.spacing were two copies of one 4px scale, merged into base.dimension (#188). Removed in 3.0. */
|
|
569
|
-
--co-base-size-18: var(--co-base-dimension-18); /** Deprecated: base.size and base.spacing were two copies of one 4px scale, merged into base.dimension (#188). Removed in 3.0. */
|
|
570
|
-
--co-base-size-20: var(--co-base-dimension-20); /** Deprecated: base.size and base.spacing were two copies of one 4px scale, merged into base.dimension (#188). Removed in 3.0. */
|
|
571
|
-
--co-base-size-24: var(--co-base-dimension-24); /** Deprecated: base.size and base.spacing were two copies of one 4px scale, merged into base.dimension (#188). Removed in 3.0. */
|
|
572
|
-
--co-base-size-28: var(--co-base-dimension-28); /** Deprecated: base.size and base.spacing were two copies of one 4px scale, merged into base.dimension (#188). Removed in 3.0. */
|
|
573
|
-
--co-base-size-30: var(--co-base-dimension-30); /** Deprecated: base.size and base.spacing were two copies of one 4px scale, merged into base.dimension (#188). Removed in 3.0. */
|
|
574
|
-
--co-base-size-32: var(--co-base-dimension-32); /** Deprecated: base.size and base.spacing were two copies of one 4px scale, merged into base.dimension (#188). Removed in 3.0. */
|
|
575
|
-
--co-base-size-40: var(--co-base-dimension-40); /** Deprecated: base.size and base.spacing were two copies of one 4px scale, merged into base.dimension (#188). Removed in 3.0. */
|
|
576
|
-
--co-base-size-45: var(--co-base-dimension-45); /** Deprecated: base.size and base.spacing were two copies of one 4px scale, merged into base.dimension (#188). Removed in 3.0. */
|
|
577
|
-
--co-base-size-48: var(--co-base-dimension-48); /** Deprecated: base.size and base.spacing were two copies of one 4px scale, merged into base.dimension (#188). Removed in 3.0. */
|
|
578
|
-
--co-base-size-50: var(--co-base-dimension-50); /** Deprecated: base.size and base.spacing were two copies of one 4px scale, merged into base.dimension (#188). Removed in 3.0. */
|
|
579
|
-
--co-base-size-56: var(--co-base-dimension-56); /** Deprecated: base.size and base.spacing were two copies of one 4px scale, merged into base.dimension (#188). Removed in 3.0. */
|
|
580
|
-
--co-base-size-64: var(--co-base-dimension-64); /** Deprecated: base.size and base.spacing were two copies of one 4px scale, merged into base.dimension (#188). Removed in 3.0. */
|
|
581
|
-
--co-base-size-75: var(--co-base-dimension-75); /** Deprecated: base.size and base.spacing were two copies of one 4px scale, merged into base.dimension (#188). Removed in 3.0. */
|
|
582
|
-
--co-base-size-90: var(--co-base-dimension-90); /** Deprecated: base.size and base.spacing were two copies of one 4px scale, merged into base.dimension (#188). Removed in 3.0. */
|
|
583
|
-
--co-base-size-100: var(--co-base-dimension-100); /** Deprecated: base.size and base.spacing were two copies of one 4px scale, merged into base.dimension (#188). Removed in 3.0. */
|
|
584
|
-
--co-base-size-140: var(--co-base-dimension-140); /** Deprecated: base.size and base.spacing were two copies of one 4px scale, merged into base.dimension (#188). Removed in 3.0. */
|
|
585
|
-
--co-base-size-180: var(--co-base-dimension-180); /** Deprecated: base.size and base.spacing were two copies of one 4px scale, merged into base.dimension (#188). Removed in 3.0. */
|
|
586
|
-
--co-base-size-192: var(--co-base-dimension-192); /** Deprecated: base.size and base.spacing were two copies of one 4px scale, merged into base.dimension (#188). Removed in 3.0. */
|
|
587
|
-
--co-base-spacing-0: var(--co-base-dimension-0); /** Deprecated: base.size and base.spacing were two copies of one 4px scale, merged into base.dimension (#188). Removed in 3.0. */
|
|
588
|
-
--co-base-spacing-1: var(--co-base-dimension-1); /** Deprecated: base.size and base.spacing were two copies of one 4px scale, merged into base.dimension (#188). Removed in 3.0. */
|
|
589
|
-
--co-base-spacing-2: var(--co-base-dimension-2); /** Deprecated: base.size and base.spacing were two copies of one 4px scale, merged into base.dimension (#188). Removed in 3.0. */
|
|
590
|
-
--co-base-spacing-3: var(--co-base-dimension-3); /** Deprecated: base.size and base.spacing were two copies of one 4px scale, merged into base.dimension (#188). Removed in 3.0. */
|
|
591
|
-
--co-base-spacing-4: var(--co-base-dimension-4); /** Deprecated: base.size and base.spacing were two copies of one 4px scale, merged into base.dimension (#188). Removed in 3.0. */
|
|
592
|
-
--co-base-spacing-5: var(--co-base-dimension-5); /** Deprecated: base.size and base.spacing were two copies of one 4px scale, merged into base.dimension (#188). Removed in 3.0. */
|
|
593
|
-
--co-base-spacing-6: var(--co-base-dimension-6); /** Deprecated: base.size and base.spacing were two copies of one 4px scale, merged into base.dimension (#188). Removed in 3.0. */
|
|
594
|
-
--co-base-spacing-7: var(--co-base-dimension-7); /** Deprecated: base.size and base.spacing were two copies of one 4px scale, merged into base.dimension (#188). Removed in 3.0. */
|
|
595
|
-
--co-base-spacing-8: var(--co-base-dimension-8); /** Deprecated: base.size and base.spacing were two copies of one 4px scale, merged into base.dimension (#188). Removed in 3.0. */
|
|
596
|
-
--co-base-spacing-9: var(--co-base-dimension-9); /** Deprecated: base.size and base.spacing were two copies of one 4px scale, merged into base.dimension (#188). Removed in 3.0. */
|
|
597
|
-
--co-base-spacing-10: var(--co-base-dimension-10); /** Deprecated: base.size and base.spacing were two copies of one 4px scale, merged into base.dimension (#188). Removed in 3.0. */
|
|
598
|
-
--co-base-spacing-12: var(--co-base-dimension-12); /** Deprecated: base.size and base.spacing were two copies of one 4px scale, merged into base.dimension (#188). Removed in 3.0. */
|
|
599
|
-
--co-base-spacing-14: var(--co-base-dimension-14); /** Deprecated: base.size and base.spacing were two copies of one 4px scale, merged into base.dimension (#188). Removed in 3.0. */
|
|
600
|
-
--co-base-spacing-16: var(--co-base-dimension-16); /** Deprecated: base.size and base.spacing were two copies of one 4px scale, merged into base.dimension (#188). Removed in 3.0. */
|
|
601
|
-
--co-base-spacing-20: var(--co-base-dimension-20); /** Deprecated: base.size and base.spacing were two copies of one 4px scale, merged into base.dimension (#188). Removed in 3.0. */
|
|
602
|
-
--co-base-spacing-24: var(--co-base-dimension-24); /** Deprecated: base.size and base.spacing were two copies of one 4px scale, merged into base.dimension (#188). Removed in 3.0. */
|
|
603
|
-
--co-base-spacing-28: var(--co-base-dimension-28); /** Deprecated: base.size and base.spacing were two copies of one 4px scale, merged into base.dimension (#188). Removed in 3.0. */
|
|
604
|
-
--co-base-spacing-32: var(--co-base-dimension-32); /** Deprecated: base.size and base.spacing were two copies of one 4px scale, merged into base.dimension (#188). Removed in 3.0. */
|
|
605
|
-
--co-base-spacing-40: var(--co-base-dimension-40); /** Deprecated: base.size and base.spacing were two copies of one 4px scale, merged into base.dimension (#188). Removed in 3.0. */
|
|
606
|
-
--co-base-spacing-48: var(--co-base-dimension-48); /** Deprecated: base.size and base.spacing were two copies of one 4px scale, merged into base.dimension (#188). Removed in 3.0. */
|
|
607
|
-
--co-base-spacing-56: var(--co-base-dimension-56); /** Deprecated: base.size and base.spacing were two copies of one 4px scale, merged into base.dimension (#188). Removed in 3.0. */
|
|
608
|
-
--co-base-spacing-64: var(--co-base-dimension-64); /** Deprecated: base.size and base.spacing were two copies of one 4px scale, merged into base.dimension (#188). Removed in 3.0. */
|
|
609
431
|
--co-semantic-elevation-none: var(--co-base-shadow-none); /** No elevation - flat surfaces, default state */
|
|
610
432
|
--co-semantic-elevation-raised: var(--co-base-shadow-2); /** Subtle lift - cards, buttons with depth */
|
|
611
433
|
--co-semantic-elevation-floating: var(--co-base-shadow-4); /** Moderate lift - tooltips, popovers, dropdowns */
|
|
@@ -638,26 +460,14 @@
|
|
|
638
460
|
--co-semantic-letter-spacing-normal: var(--co-base-letter-spacing-2); /** 0: default tracking (h5, h6 and text). */
|
|
639
461
|
--co-semantic-letter-spacing-wide: var(--co-base-letter-spacing-4); /** Wide tracking for small uppercase labels, such as SearchField section headers. */
|
|
640
462
|
--co-semantic-font-weight-regular: var(--co-base-font-weight-2); /** 400. Body text, captions, most UI text. */
|
|
641
|
-
--co-semantic-font-weight-medium: var(--co-base-font-weight-3); /** 500.
|
|
642
|
-
--co-semantic-font-weight-semibold: var(--co-base-font-weight-4); /** 600.
|
|
643
|
-
--co-semantic-font-weight-bold: var(--co-base-font-weight-5); /** 700.
|
|
644
|
-
--co-semantic-z-index-sticky: var(--co-base-z-index-1); /** Deprecated: Renamed to semantic.layer.sticky by the semantic grammar (decision 0031). Removed in 3.0. */
|
|
645
|
-
--co-semantic-z-index-dropdown: var(--co-base-z-index-6); /** Deprecated: Renamed to semantic.layer.dropdown by the semantic grammar (decision 0031). Removed in 3.0. */
|
|
646
|
-
--co-semantic-z-index-overlay: var(--co-base-z-index-7); /** Deprecated: Renamed to semantic.layer.overlay by the semantic grammar (decision 0031). Removed in 3.0. */
|
|
647
|
-
--co-semantic-z-index-modal: var(--co-base-z-index-8); /** Deprecated: Renamed to semantic.layer.modal by the semantic grammar (decision 0031). Removed in 3.0. */
|
|
463
|
+
--co-semantic-font-weight-medium: var(--co-base-font-weight-3); /** 500. Subtitle, buttons, emphasis within UI text. */
|
|
464
|
+
--co-semantic-font-weight-semibold: var(--co-base-font-weight-4); /** 600. Headings (h1 to h6), labels and short titles (label, Alert title). */
|
|
465
|
+
--co-semantic-font-weight-bold: var(--co-base-font-weight-5); /** 700. The display heading, overline, strong indicators such as the required-field asterisk. */
|
|
648
466
|
--co-semantic-border-default: var(--co-base-border-width-1) var(--co-base-border-style-solid) var(--co-semantic-color-border-default); /** Hairline in the default border colour: dividers and decorative outlines, such as Breadcrumbs, CodeBlock and Divider. 1.53:1 on white, so never a control edge (decision 0025). */
|
|
649
467
|
--co-semantic-border-focus: var(--co-base-border-width-2) var(--co-base-border-style-solid) var(--co-semantic-color-border-focus); /** The focus ring every component draws, with border.focusOffset; never blue (decision 0029). */
|
|
650
468
|
--co-semantic-border-width-thin: var(--co-base-border-width-1); /** Hairline border: dividers, control edges and rings. */
|
|
651
469
|
--co-semantic-border-width-thick: var(--co-base-border-width-2); /** Thick border: focus rings, emphasised outlines and selected states. */
|
|
652
470
|
--co-semantic-border-focus-offset: var(--co-base-border-width-2); /** Gap between an element and its focus ring; negate it to inset the ring inside the element. */
|
|
653
|
-
--co-semantic-border-radius-xs: var(--co-base-border-radius-1); /** Deprecated: Renamed to semantic.radius.xs by the semantic grammar (decision 0031). Removed in 3.0. */
|
|
654
|
-
--co-semantic-border-radius-sm: var(--co-base-border-radius-2); /** Deprecated: Renamed to semantic.radius.sm by the semantic grammar (decision 0031). Removed in 3.0. */
|
|
655
|
-
--co-semantic-border-radius-md: var(--co-base-border-radius-3); /** Deprecated: Renamed to semantic.radius.md by the semantic grammar (decision 0031). Removed in 3.0. */
|
|
656
|
-
--co-semantic-border-radius-lg: var(--co-base-border-radius-4); /** Deprecated: Renamed to semantic.radius.lg by the semantic grammar (decision 0031). Removed in 3.0. */
|
|
657
|
-
--co-semantic-border-radius-xl: var(--co-base-border-radius-5); /** Deprecated: Renamed to semantic.radius.xl by the semantic grammar (decision 0031). Removed in 3.0. */
|
|
658
|
-
--co-semantic-border-radius-2xl: var(--co-base-border-radius-6); /** Deprecated: Renamed to semantic.radius.2xl by the semantic grammar (decision 0031). Removed in 3.0. */
|
|
659
|
-
--co-semantic-border-radius-3xl: var(--co-base-border-radius-7); /** Deprecated: Renamed to semantic.radius.3xl by the semantic grammar (decision 0031). Removed in 3.0. */
|
|
660
|
-
--co-semantic-border-radius-circle: var(--co-base-border-radius-circle); /** Deprecated: Renamed to semantic.radius.full by the semantic grammar (decision 0031). Removed in 3.0. */
|
|
661
471
|
--co-semantic-border-input-hover: var(--co-base-border-width-1) var(--co-base-border-style-solid) var(--co-semantic-color-border-input-hover); /** Firm hairline that must read as a boundary, such as a hovered text input. */
|
|
662
472
|
--co-semantic-size-100: var(--co-base-dimension-1); /** Size step for thin bars: the TabBar scrollbar, the small ProgressBar. */
|
|
663
473
|
--co-semantic-size-200: var(--co-base-dimension-2); /** Size step for small marks: the Badge dot, the medium ProgressBar. */
|
|
@@ -666,21 +476,27 @@
|
|
|
666
476
|
--co-semantic-size-600: var(--co-base-dimension-6); /** Size step for the medium label height, used by chips and StatusLabel. */
|
|
667
477
|
--co-semantic-size-800: var(--co-base-dimension-8); /** Size step for compact rows and large labels, such as the Checkbox row. */
|
|
668
478
|
--co-semantic-size-1200: var(--co-base-dimension-12); /** Size step for headers and indents, such as the AccountCard header. */
|
|
479
|
+
--co-semantic-size-1400: var(--co-base-dimension-14); /** Size step for the collapsed SidebarNav rail: one icon row with an inset on each side. */
|
|
669
480
|
--co-semantic-size-1500: var(--co-base-dimension-15); /** Size step for the comfortable ListItem expanded indent. */
|
|
670
481
|
--co-semantic-size-1800: var(--co-base-dimension-18); /** Size step for tall rows, such as the TransactionListItem minimum height. */
|
|
671
482
|
--co-semantic-size-2000: var(--co-base-dimension-20); /** Size step for small illustrations, such as the small EmptyState image. */
|
|
672
483
|
--co-semantic-size-3000: var(--co-base-dimension-30); /** Size step for medium illustrations and multi-line inputs: EmptyState, TextArea. */
|
|
673
484
|
--co-semantic-size-4500: var(--co-base-dimension-45); /** Size step for truncation widths, such as a Breadcrumbs label. */
|
|
674
485
|
--co-semantic-size-5000: var(--co-base-dimension-50); /** Size step for large illustrations, such as the large EmptyState image. */
|
|
675
|
-
--co-semantic-size-
|
|
486
|
+
--co-semantic-size-5600: var(--co-base-dimension-56); /** Size step for a narrow navigation column: the narrow SidebarNav. */
|
|
487
|
+
--co-semantic-size-6400: var(--co-base-dimension-64); /** Size step for a standard navigation column: the default SidebarNav. */
|
|
488
|
+
--co-semantic-size-7500: var(--co-base-dimension-75); /** Size step for narrow column widths: AccountCard, EmptyState actions, the wide SidebarNav, the widest a Tooltip grows. */
|
|
676
489
|
--co-semantic-size-9000: var(--co-base-dimension-90); /** Size step for readable text widths, such as EmptyState copy. */
|
|
677
490
|
--co-semantic-size-10000: var(--co-base-dimension-100); /** Size step for compact panel widths, such as the EmptyState block. */
|
|
678
491
|
--co-semantic-size-19200: var(--co-base-dimension-192); /** Size step for wide content columns, such as CardLarge. */
|
|
679
492
|
--co-semantic-size-pointer-target: var(--co-base-dimension-6); /** Minimum pointer target for a control that's smaller to look at: its invisible hit area (WCAG 2.5.8, decision 0039). On touch screens, use touchTarget. */
|
|
680
|
-
--co-semantic-size-touch-target: var(--co-base-dimension-11); /**
|
|
493
|
+
--co-semantic-size-touch-target: var(--co-base-dimension-11); /** Invisible hit area of a small control on touch screens, such as the Slider thumb. Not a row or control height: those follow density down to pointerTarget (decision 0051). */
|
|
681
494
|
--co-semantic-size-control-sm: var(--co-base-dimension-8); /** Minimum height of small controls: small Buttons and IconButtons, buttons inside fields (decision 0034). */
|
|
682
495
|
--co-semantic-size-control-md: var(--co-base-dimension-10); /** Minimum height of medium controls: the default IconButton, medium Buttons (decision 0034). */
|
|
683
496
|
--co-semantic-size-control-lg: var(--co-base-dimension-12); /** Minimum height of large controls: text fields, Dropdown, SearchField, the default Button (decision 0034). */
|
|
497
|
+
--co-semantic-size-row-sm: var(--co-base-dimension-8); /** Minimum height of dense single-line rows: navigation items, menu items, dense table rows. Follows density down to the minimum pointer target (decision 0051). */
|
|
498
|
+
--co-semantic-size-row-md: var(--co-base-dimension-12); /** Minimum height of single-line list rows: ListItem and the rows built on it, such as ActionSheet actions and SearchField suggestions. Follows density (decision 0051). */
|
|
499
|
+
--co-semantic-size-row-lg: var(--co-base-dimension-18); /** Minimum height of two-line rows: TransactionListItem. Follows density (decision 0051). */
|
|
684
500
|
--co-semantic-size-overlay-sm: var(--co-base-dimension-100); /** Width of a small Modal, and the default width or height of a Sheet. */
|
|
685
501
|
--co-semantic-size-overlay-md: var(--co-base-dimension-140); /** Width of a medium overlay panel, such as a medium Modal. */
|
|
686
502
|
--co-semantic-size-overlay-lg: var(--co-base-dimension-180); /** Width of a large overlay panel, such as a large Modal. */
|
|
@@ -688,23 +504,6 @@
|
|
|
688
504
|
--co-semantic-size-label-medium: var(--co-base-dimension-6); /** Height of a medium label and every chip: StatusLabel, Tag, CategoryLabel (0018, 0035). */
|
|
689
505
|
--co-semantic-size-label-large: var(--co-base-dimension-8); /** Height of a large label: CategoryLabel large (decision 0018). */
|
|
690
506
|
--co-semantic-size-menu-max-height: var(--co-base-dimension-75); /** Tallest a floating menu grows before it scrolls: Dropdown, SearchField. */
|
|
691
|
-
--co-semantic-size-dimension-1: var(--co-base-dimension-1); /** Deprecated: Renamed to semantic.size.100 by the semantic grammar (decision 0031). Removed in 3.0. */
|
|
692
|
-
--co-semantic-size-dimension-2: var(--co-base-dimension-2); /** Deprecated: Renamed to semantic.size.200 by the semantic grammar (decision 0031). Removed in 3.0. */
|
|
693
|
-
--co-semantic-size-dimension-4: var(--co-base-dimension-4); /** Deprecated: Renamed to semantic.size.400 by the semantic grammar (decision 0031). Removed in 3.0. */
|
|
694
|
-
--co-semantic-size-dimension-5: var(--co-base-dimension-5); /** Deprecated: Renamed to semantic.size.500 by the semantic grammar (decision 0031). Removed in 3.0. */
|
|
695
|
-
--co-semantic-size-dimension-6: var(--co-base-dimension-6); /** Deprecated: Renamed to semantic.size.600 by the semantic grammar (decision 0031). Removed in 3.0. */
|
|
696
|
-
--co-semantic-size-dimension-8: var(--co-base-dimension-8); /** Deprecated: Renamed to semantic.size.800 by the semantic grammar (decision 0031). Removed in 3.0. */
|
|
697
|
-
--co-semantic-size-dimension-12: var(--co-base-dimension-12); /** Deprecated: Renamed to semantic.size.1200 by the semantic grammar (decision 0031). Removed in 3.0. */
|
|
698
|
-
--co-semantic-size-dimension-15: var(--co-base-dimension-15); /** Deprecated: Renamed to semantic.size.1500 by the semantic grammar (decision 0031). Removed in 3.0. */
|
|
699
|
-
--co-semantic-size-dimension-18: var(--co-base-dimension-18); /** Deprecated: Renamed to semantic.size.1800 by the semantic grammar (decision 0031). Removed in 3.0. */
|
|
700
|
-
--co-semantic-size-dimension-20: var(--co-base-dimension-20); /** Deprecated: Renamed to semantic.size.2000 by the semantic grammar (decision 0031). Removed in 3.0. */
|
|
701
|
-
--co-semantic-size-dimension-30: var(--co-base-dimension-30); /** Deprecated: Renamed to semantic.size.3000 by the semantic grammar (decision 0031). Removed in 3.0. */
|
|
702
|
-
--co-semantic-size-dimension-45: var(--co-base-dimension-45); /** Deprecated: Renamed to semantic.size.4500 by the semantic grammar (decision 0031). Removed in 3.0. */
|
|
703
|
-
--co-semantic-size-dimension-50: var(--co-base-dimension-50); /** Deprecated: Renamed to semantic.size.5000 by the semantic grammar (decision 0031). Removed in 3.0. */
|
|
704
|
-
--co-semantic-size-dimension-75: var(--co-base-dimension-75); /** Deprecated: Renamed to semantic.size.7500 by the semantic grammar (decision 0031). Removed in 3.0. */
|
|
705
|
-
--co-semantic-size-dimension-90: var(--co-base-dimension-90); /** Deprecated: Renamed to semantic.size.9000 by the semantic grammar (decision 0031). Removed in 3.0. */
|
|
706
|
-
--co-semantic-size-dimension-100: var(--co-base-dimension-100); /** Deprecated: Renamed to semantic.size.10000 by the semantic grammar (decision 0031). Removed in 3.0. */
|
|
707
|
-
--co-semantic-size-dimension-192: var(--co-base-dimension-192); /** Deprecated: Renamed to semantic.size.19200 by the semantic grammar (decision 0031). Removed in 3.0. */
|
|
708
507
|
--co-semantic-size-icon-xs: var(--co-base-dimension-3); /** The smallest icon size, for dense inline indicators. */
|
|
709
508
|
--co-semantic-size-icon-sm: var(--co-base-dimension-4); /** Icons in compact controls, such as Alert's dismiss icon and small icon buttons. */
|
|
710
509
|
--co-semantic-size-icon-md: var(--co-base-dimension-5); /** Icons beside body text, such as Alert's severity icon. */
|
|
@@ -716,32 +515,6 @@
|
|
|
716
515
|
--co-semantic-size-avatar-md: var(--co-base-dimension-10); /** Medium avatar, the default size. */
|
|
717
516
|
--co-semantic-size-avatar-lg: var(--co-base-dimension-12); /** Large avatar, in headers and cards. */
|
|
718
517
|
--co-semantic-size-avatar-xl: var(--co-base-dimension-16); /** Extra-large avatar, on profile pages. */
|
|
719
|
-
--co-semantic-spacing-separator-sm: var(--co-base-dimension-4); /** Deprecated: Renamed to semantic.space.400 by the semantic grammar (decision 0031). Removed in 3.0. */
|
|
720
|
-
--co-semantic-spacing-separator-md: var(--co-base-dimension-6); /** Deprecated: Renamed to semantic.space.600 by the semantic grammar (decision 0031). Removed in 3.0. */
|
|
721
|
-
--co-semantic-spacing-separator-lg: var(--co-base-dimension-8); /** Deprecated: Renamed to semantic.space.800 by the semantic grammar (decision 0031). Removed in 3.0. */
|
|
722
|
-
--co-semantic-spacing-separator-xl: var(--co-base-dimension-12); /** Deprecated: Renamed to semantic.space.1200 by the semantic grammar (decision 0031). Removed in 3.0. */
|
|
723
|
-
--co-semantic-spacing-component-xs: var(--co-base-dimension-1); /** Deprecated: Renamed to semantic.space.inset.xs by the semantic grammar (decision 0031). Removed in 3.0. */
|
|
724
|
-
--co-semantic-spacing-component-sm: var(--co-base-dimension-2); /** Deprecated: Renamed to semantic.space.inset.sm by the semantic grammar (decision 0031). Removed in 3.0. */
|
|
725
|
-
--co-semantic-spacing-component-md: var(--co-base-dimension-3); /** Deprecated: Renamed to semantic.space.inset.md by the semantic grammar (decision 0031). Removed in 3.0. */
|
|
726
|
-
--co-semantic-spacing-component-lg: var(--co-base-dimension-4); /** Deprecated: Renamed to semantic.space.inset.lg by the semantic grammar (decision 0031). Removed in 3.0. */
|
|
727
|
-
--co-semantic-spacing-component-xl: var(--co-base-dimension-5); /** Deprecated: Renamed to semantic.space.inset.xl by the semantic grammar (decision 0031). Removed in 3.0. */
|
|
728
|
-
--co-semantic-spacing-component-2xl: var(--co-base-dimension-6); /** Deprecated: Renamed to semantic.space.inset.2xl by the semantic grammar (decision 0031). Removed in 3.0. */
|
|
729
|
-
--co-semantic-spacing-layout-none: var(--co-base-dimension-0); /** Deprecated: Renamed to semantic.space.0 by the semantic grammar (decision 0031). Removed in 3.0. */
|
|
730
|
-
--co-semantic-spacing-layout-xs: var(--co-base-dimension-1); /** Deprecated: Renamed to semantic.space.100 by the semantic grammar (decision 0031). Removed in 3.0. */
|
|
731
|
-
--co-semantic-spacing-layout-sm: var(--co-base-dimension-2); /** Deprecated: Renamed to semantic.space.200 by the semantic grammar (decision 0031). Removed in 3.0. */
|
|
732
|
-
--co-semantic-spacing-layout-md: var(--co-base-dimension-3); /** Deprecated: Renamed to semantic.space.300 by the semantic grammar (decision 0031). Removed in 3.0. */
|
|
733
|
-
--co-semantic-spacing-layout-lg: var(--co-base-dimension-4); /** Deprecated: Renamed to semantic.space.400 by the semantic grammar (decision 0031). Removed in 3.0. */
|
|
734
|
-
--co-semantic-spacing-layout-xl: var(--co-base-dimension-5); /** Deprecated: Renamed to semantic.space.500 by the semantic grammar (decision 0031). Removed in 3.0. */
|
|
735
|
-
--co-semantic-spacing-layout-2xl: var(--co-base-dimension-6); /** Deprecated: Renamed to semantic.space.600 by the semantic grammar (decision 0031). Removed in 3.0. */
|
|
736
|
-
--co-semantic-spacing-layout-3xl: var(--co-base-dimension-7); /** Deprecated: Renamed to semantic.space.700 by the semantic grammar (decision 0031). Removed in 3.0. */
|
|
737
|
-
--co-semantic-spacing-layout-4xl: var(--co-base-dimension-8); /** Deprecated: Renamed to semantic.space.800 by the semantic grammar (decision 0031). Removed in 3.0. */
|
|
738
|
-
--co-semantic-spacing-layout-5xl: var(--co-base-dimension-9); /** Deprecated: Renamed to semantic.space.900 by the semantic grammar (decision 0031). Removed in 3.0. */
|
|
739
|
-
--co-semantic-spacing-layout-6xl: var(--co-base-dimension-10); /** Deprecated: Renamed to semantic.space.1000 by the semantic grammar (decision 0031). Removed in 3.0. */
|
|
740
|
-
--co-semantic-spacing-layout-7xl: var(--co-base-dimension-12); /** Deprecated: Renamed to semantic.space.1200 by the semantic grammar (decision 0031). Removed in 3.0. */
|
|
741
|
-
--co-semantic-spacing-layout-8xl: var(--co-base-dimension-14); /** Deprecated: Renamed to semantic.space.1400 by the semantic grammar (decision 0031). Removed in 3.0. */
|
|
742
|
-
--co-semantic-spacing-layout-9xl: var(--co-base-dimension-16); /** Deprecated: Renamed to semantic.space.1600 by the semantic grammar (decision 0031). Removed in 3.0. */
|
|
743
|
-
--co-semantic-spacing-layout-10xl: var(--co-base-dimension-20); /** Deprecated: Renamed to semantic.space.2000 by the semantic grammar (decision 0031). Removed in 3.0. */
|
|
744
|
-
--co-semantic-spacing-layout-11xl: var(--co-base-dimension-24); /** Deprecated: Renamed to semantic.space.2400 by the semantic grammar (decision 0031). Removed in 3.0. */
|
|
745
518
|
--co-semantic-spacing-layout-auto: var(--co-base-spacing-auto); /** auto: lets the browser compute the space, such as margin: auto to centre or push an element. */
|
|
746
519
|
--co-semantic-color-text-default: var(--co-base-color-gray-1200); /** Primary text: body copy, labels and headings. 15.91:1 on white, 15.51:1 on the page. */
|
|
747
520
|
--co-semantic-color-text-inverse: var(--co-base-color-gray-100); /** Text on dark or coloured fills, such as the primary, accent and danger Buttons. 15.51:1 on fill.emphasis. */
|
|
@@ -753,15 +526,7 @@
|
|
|
753
526
|
--co-semantic-color-text-danger: var(--co-base-color-danger-1100); /** Error text: field error messages, InlineAlert errors. 6.03:1 on white. */
|
|
754
527
|
--co-semantic-color-text-ai: var(--co-base-color-ai-1100); /** AI-generated content and agent actions, such as the label on proposed content (0046); always with the AI icon and a label, never colour alone (0043). 5.99:1 on white, 5.68:1 on the page. */
|
|
755
528
|
--co-semantic-color-text-serious: var(--co-base-color-serious-1100); /** Serious-warning text: between warning and danger (decisions 0043, 0045). 6.04:1 on white. */
|
|
756
|
-
--co-semantic-color-background-subtle: var(--co-base-color-white); /** Deprecated: Split by use (decision 0031): semantic.surface.raised for surfaces such as cards, inputs and sheets; component.slider.thumb.background for Slider's thumb. Removed in 3.0. */
|
|
757
|
-
--co-semantic-color-background-emphasis-hover: var(--co-base-color-neutral-800); /** Deprecated: Renamed to semantic.color.fill.emphasis-hover by the semantic grammar (decision 0031). Removed in 3.0. */
|
|
758
|
-
--co-semantic-color-background-emphasis-active: var(--co-base-color-neutral-1000); /** Deprecated: Renamed to semantic.color.fill.emphasis-pressed by the semantic grammar (decision 0031). Removed in 3.0. */
|
|
759
|
-
--co-semantic-color-background-transparent: var(--co-base-color-transparent); /** Deprecated: Renamed to semantic.color.fill.none by the semantic grammar (decision 0031). Removed in 3.0. */
|
|
760
|
-
--co-semantic-color-background-overlay: var(--co-semantic-surface-scrim); /** Deprecated: Renamed to semantic.surface.scrim by the semantic grammar (decision 0031). Removed in 3.0. */
|
|
761
|
-
--co-semantic-color-background-hover-overlay: var(--co-semantic-color-fill-none-hover); /** Deprecated: Renamed to semantic.color.fill.none-hover by the semantic grammar (decision 0031). Removed in 3.0. */
|
|
762
|
-
--co-semantic-color-background-active-overlay: var(--co-semantic-color-fill-none-pressed); /** Deprecated: Renamed to semantic.color.fill.none-pressed by the semantic grammar (decision 0031). Removed in 3.0. */
|
|
763
529
|
--co-semantic-color-border-default: var(--co-base-color-gray-700); /** Default border colour for dividers and decorative outlines only (decision 0040). 1.53:1 on white, below the 3:1 a control edge needs; use color.border.input for that (decision 0025). */
|
|
764
|
-
--co-semantic-color-border-strong: var(--co-base-color-neutral-800); /** Deprecated: Split by use (decision 0031): semantic.color.border.input-hover for a hovered control, semantic.color.border.focus for the focus ring and CardSmall's ring, semantic.color.fill.inverse for drag handles. Removed in 3.0. */
|
|
765
530
|
--co-semantic-color-border-success: var(--co-base-color-success-800); /** Green border for success outlines, such as an outlined success Alert. 3.18:1 on white (decision 0025). */
|
|
766
531
|
--co-semantic-color-border-warning: var(--co-base-color-warning-800); /** Yellow border for warning outlines, such as an outlined warning Alert. 3.19:1 on white (decision 0025). */
|
|
767
532
|
--co-semantic-color-border-none: var(--co-base-color-transparent); /** An invisible border that keeps its width, so a borderless state takes the same space as a bordered one (for example Alert's borderless appearance, decision 0019). */
|
|
@@ -803,8 +568,6 @@
|
|
|
803
568
|
--co-semantic-color-category-magenta-text: var(--co-base-color-magenta-1100); /** Text and icons of an outlined or minimal magenta CategoryLabel. 6.02:1 on white, 5.38:1 on magenta-muted. */
|
|
804
569
|
--co-semantic-color-category-magenta-muted: var(--co-base-color-magenta-300); /** Light magenta fill of a minimal CategoryLabel, behind the magenta-text colour. */
|
|
805
570
|
--co-semantic-color-fill-emphasis: var(--co-base-color-gray-1200); /** Strong near-black fill for the primary Button and IconButton and the emphasis Chip, with text.inverse on it (15.91:1). Hover and pressed mix in text.inverse at opacity.state (decision 0048). */
|
|
806
|
-
--co-semantic-color-fill-emphasis-hover: var(--co-base-color-neutral-800); /** Deprecated: Strong-fill states mix text.inverse into fill.emphasis at opacity.state.hover and opacity.state.pressed (decision 0048). Removed in 3.0. */
|
|
807
|
-
--co-semantic-color-fill-emphasis-pressed: var(--co-base-color-neutral-1000); /** Deprecated: Strong-fill states mix text.inverse into fill.emphasis at opacity.state.hover and opacity.state.pressed (decision 0048). Removed in 3.0. */
|
|
808
571
|
--co-semantic-color-fill-muted: var(--co-base-color-gray-300); /** Light grey fill for quiet grouped content, such as the default Chip. The resting fill step, so it shows on the page. */
|
|
809
572
|
--co-semantic-color-fill-inverse: var(--co-base-color-gray-1200); /** Dark fill for inverse elements: a checked Checkbox, Modal and Sheet drag handles. */
|
|
810
573
|
--co-semantic-color-fill-accent: var(--co-base-color-accent-1100); /** Blue fill for the accent Button and other deliberate highlights (0003), with text.inverse on it at 6.00:1. */
|
|
@@ -842,25 +605,17 @@
|
|
|
842
605
|
--co-semantic-color-data-sequential-periwinkle-3: var(--co-base-color-periwinkle-800); /** Sequential step 3 of 5. 3.20:1 on white. */
|
|
843
606
|
--co-semantic-color-data-sequential-periwinkle-4: var(--co-base-color-periwinkle-1000); /** Sequential step 4 of 5. 4.37:1 on white. */
|
|
844
607
|
--co-semantic-color-data-sequential-periwinkle-5: var(--co-base-color-periwinkle-1200); /** Sequential step 5 of 5. 15.91:1 on white. */
|
|
845
|
-
--co-semantic-motion-duration-normal: var(--co-base-duration-normal); /** Deprecated: Renamed to semantic.motion.duration.moderate by the semantic grammar (decision 0031, settled in 0037). Removed in 3.0. */
|
|
846
608
|
--co-semantic-motion-duration-fast: var(--co-base-duration-fast); /** Quick responses to input: hover, press, focus and small indicators. */
|
|
847
609
|
--co-semantic-motion-duration-slow: var(--co-base-duration-moderate); /** The longest duration (P6): larger movements, such as a Sheet sliding in. */
|
|
848
610
|
--co-semantic-motion-duration-instant: var(--co-base-duration-instant); /** No duration: changes that should happen at once, such as movement under reduced motion. */
|
|
849
611
|
--co-semantic-motion-duration-moderate: var(--co-base-duration-normal); /** The default duration for state changes and short movements, such as a menu opening. */
|
|
850
|
-
--co-semantic-motion-
|
|
851
|
-
--co-semantic-motion-easing-ease-out: var(--co-base-easing-ease-out); /** Deprecated: Renamed to semantic.motion.easing.decelerate by the semantic grammar (decision 0031, settled in 0037). Removed in 3.0. */
|
|
612
|
+
--co-semantic-motion-delay-hint: var(--co-base-duration-slow); /** How long the pointer rests on a control before its Tooltip opens, so passing pointers don't open it. A wait before anything moves, not an animation duration. */
|
|
852
613
|
--co-semantic-motion-easing-standard: var(--co-base-easing-ease-in-out); /** Easing for change on screen: something moving or resizing in place. */
|
|
853
614
|
--co-semantic-motion-easing-decelerate: var(--co-base-easing-ease-out); /** Easing for things arriving or responding: entrances, hover and press. */
|
|
854
615
|
--co-semantic-motion-easing-accelerate: var(--co-base-easing-ease-in); /** Easing for things leaving: exits and dismissals speed up as they go (decision 0037). */
|
|
855
|
-
--co-semantic-motion-transition-fast: all var(--co-base-duration-fast) var(--co-base-easing-ease-out); /** Deprecated: It animates every property (`transition: all`). List the properties instead, with motion.duration and motion.easing, or use a motion.transition composite (decision 0037). Removed in 3.0. */
|
|
856
|
-
--co-semantic-motion-transition-normal: all var(--co-base-duration-normal) var(--co-base-easing-ease-in-out); /** Deprecated: It animates every property (`transition: all`). List the properties instead, with motion.duration and motion.easing, or use a motion.transition composite (decision 0037). Removed in 3.0. */
|
|
857
|
-
--co-semantic-motion-transition-slow: all var(--co-base-duration-moderate) var(--co-base-easing-ease-in-out); /** Deprecated: It animates every property (`transition: all`). List the properties instead, with motion.duration and motion.easing, or use a motion.transition composite (decision 0037). Removed in 3.0. */
|
|
858
616
|
--co-semantic-motion-transition-feedback: background-color var(--co-base-duration-fast) var(--co-base-easing-ease-out), color var(--co-base-duration-fast) var(--co-base-easing-ease-out); /** Fill and text colour responding to hover and press: buttons, chips, tabs and rows. */
|
|
859
617
|
--co-semantic-motion-transition-focus: outline var(--co-base-duration-fast) var(--co-base-easing-ease-out), outline-offset var(--co-base-duration-fast) var(--co-base-easing-ease-out); /** How the focus ring appears: outline and outline offset. */
|
|
860
618
|
--co-semantic-motion-transition-press: transform var(--co-base-duration-fast) var(--co-base-easing-ease-out), opacity var(--co-base-duration-fast) var(--co-base-easing-ease-out); /** Small movement or fade in response to input, such as a pressed control shifting. */
|
|
861
|
-
--co-semantic-motion-hover: background-color var(--co-base-duration-fast) var(--co-base-easing-ease-out), color var(--co-base-duration-fast) var(--co-base-easing-ease-out); /** Deprecated: Renamed to semantic.motion.transition.feedback by the semantic grammar (decision 0031, settled in 0037). Removed in 3.0. */
|
|
862
|
-
--co-semantic-motion-focus: outline var(--co-base-duration-fast) var(--co-base-easing-ease-out), outline-offset var(--co-base-duration-fast) var(--co-base-easing-ease-out); /** Deprecated: Renamed to semantic.motion.transition.focus by the semantic grammar (decision 0031, settled in 0037). Removed in 3.0. */
|
|
863
|
-
--co-semantic-motion-interactive: transform var(--co-base-duration-fast) var(--co-base-easing-ease-out), opacity var(--co-base-duration-fast) var(--co-base-easing-ease-out); /** Deprecated: Renamed to semantic.motion.transition.press by the semantic grammar (decision 0031, settled in 0037). Removed in 3.0. */
|
|
864
619
|
--co-semantic-motion-distance-sm: var(--co-base-dimension-2); /** How far a small element travels as it enters, such as a Dropdown menu dropping in. */
|
|
865
620
|
--co-semantic-layer-sticky: var(--co-base-z-index-1); /** Stacking layer for chrome that stays visible while scrolling: sticky headers, navigation bars. */
|
|
866
621
|
--co-semantic-layer-dropdown: var(--co-base-z-index-6); /** Stacking layer for menus anchored to a control: Dropdown and SearchField lists. */
|
|
@@ -902,7 +657,7 @@
|
|
|
902
657
|
--co-component-button-primary-background-color: var(--co-semantic-color-fill-emphasis); /** Primary Button fill at rest. */
|
|
903
658
|
--co-component-button-primary-text-color: var(--co-semantic-color-text-inverse); /** Text and icon colour on the primary Button. */
|
|
904
659
|
--co-component-button-primary-border-radius: var(--co-semantic-radius-sm); /** Corner radius of every Button (visual language: Button uses sm). */
|
|
905
|
-
--co-component-button-primary-
|
|
660
|
+
--co-component-button-primary-font: var(--co-semantic-font-weight-medium) var(--co-semantic-font-size-md)/var(--co-semantic-line-height-normal) var(--co-semantic-font-family-body); /** Button label typography, the same as sizes.large.font. */
|
|
906
661
|
--co-component-button-hover-background-color: color-mix(in srgb, var(--co-semantic-color-fill-emphasis), var(--co-semantic-color-text-inverse) calc(var(--co-semantic-opacity-state-hover) * 100%)); /** Primary Button fill on hover. */
|
|
907
662
|
--co-component-button-active-background-color: color-mix(in srgb, var(--co-semantic-color-fill-emphasis), var(--co-semantic-color-text-inverse) calc(var(--co-semantic-opacity-state-pressed) * 100%)); /** Primary Button fill while pressed. */
|
|
908
663
|
--co-component-button-focus-outline: var(--co-semantic-border-focus); /** Focus ring on every Button. */
|
|
@@ -928,71 +683,30 @@
|
|
|
928
683
|
--co-component-button-variants-danger-text-color: var(--co-semantic-color-text-inverse); /** Text and icon colour on the danger Button. */
|
|
929
684
|
--co-component-button-variants-danger-disabled-background-color: var(--co-semantic-color-fill-disabled); /** Disabled danger Button fill. */
|
|
930
685
|
--co-component-button-variants-danger-disabled-text-color: var(--co-semantic-color-text-disabled); /** Disabled danger Button text and icon colour. */
|
|
931
|
-
--co-component-button-sizes-small-padding: var(--co-semantic-space-inset-sm) var(--co-semantic-space-inset-md); /** Deprecated: No component spacing tokens (decision 0022). Use semantic.spacing.component.sm and .md. Removed in 3.0. */
|
|
932
686
|
--co-component-button-sizes-small-font-weight: var(--co-semantic-font-weight-medium); /** Weight of small Button text, set after the font: medium, as the other sizes. */
|
|
933
|
-
--co-component-button-sizes-medium-padding: var(--co-semantic-space-inset-sm) var(--co-semantic-space-inset-lg); /** Deprecated: No component spacing tokens (decision 0022). Use semantic.spacing.component.sm and .lg. Removed in 3.0. */
|
|
934
687
|
--co-component-button-sizes-medium-font: var(--co-semantic-font-weight-medium) var(--co-semantic-font-size-sm)/var(--co-semantic-line-height-normal) var(--co-semantic-font-family-body); /** Medium Button label typography. */
|
|
935
|
-
--co-component-button-sizes-large-padding: var(--co-semantic-space-inset-md) var(--co-semantic-space-inset-lg); /** Deprecated: No component spacing tokens (decision 0022). Use semantic.spacing.component.md and .lg. Removed in 3.0. */
|
|
936
688
|
--co-component-button-sizes-large-font: var(--co-semantic-font-weight-medium) var(--co-semantic-font-size-md)/var(--co-semantic-line-height-normal) var(--co-semantic-font-family-body); /** Large Button label typography. */
|
|
937
689
|
--co-component-chip-close-button-size: var(--co-semantic-size-500); /** Width and height of a chip's close button, which fits inside the chip with room around it. */
|
|
938
690
|
--co-component-chip-default-background-color: var(--co-semantic-color-fill-muted); /** Default chip fill at rest. */
|
|
939
691
|
--co-component-chip-default-text-color: var(--co-semantic-color-text-default); /** Default chip text and icon colour. */
|
|
940
692
|
--co-component-chip-default-border-radius: var(--co-semantic-radius-lg); /** Corner radius of every chip: rounder than Button, to signal a different job (decision 0016). */
|
|
941
|
-
--co-component-chip-default-padding: 2px var(--co-semantic-space-inset-sm); /** Deprecated: No component spacing tokens (decision 0022). No chip reads it; chips take padding per size. Removed in 3.0. */
|
|
942
|
-
--co-component-chip-hover-background-color: var(--co-semantic-color-fill-default-hover); /** Default chip fill on hover, when it's clickable. */
|
|
943
|
-
--co-component-chip-active-background-color: var(--co-semantic-color-fill-default-pressed); /** Default chip fill while pressed, when it's clickable. */
|
|
944
693
|
--co-component-chip-focus-outline: var(--co-semantic-border-focus); /** Focus ring on every chip and its close button. */
|
|
945
694
|
--co-component-chip-disabled-background-color: var(--co-semantic-color-fill-muted); /** Disabled default chip fill. */
|
|
946
695
|
--co-component-chip-disabled-text-color: var(--co-semantic-color-text-disabled); /** Disabled default chip text and icon colour. */
|
|
947
|
-
--co-component-chip-variants-emphasis-background-color: var(--co-semantic-color-fill-emphasis); /** Emphasis chip fill at rest. */
|
|
948
|
-
--co-component-chip-variants-emphasis-text-color: var(--co-semantic-color-text-inverse); /** Emphasis chip text and icon colour. */
|
|
949
|
-
--co-component-chip-variants-emphasis-hover-background-color: color-mix(in srgb, var(--co-semantic-color-fill-emphasis), var(--co-semantic-color-text-inverse) calc(var(--co-semantic-opacity-state-hover) * 100%)); /** Emphasis chip fill on hover, when it's clickable. */
|
|
950
|
-
--co-component-chip-variants-emphasis-active-background-color: color-mix(in srgb, var(--co-semantic-color-fill-emphasis), var(--co-semantic-color-text-inverse) calc(var(--co-semantic-opacity-state-pressed) * 100%)); /** Emphasis chip fill while pressed, when it's clickable. */
|
|
951
|
-
--co-component-chip-variants-emphasis-disabled-background-color: var(--co-semantic-color-fill-disabled); /** Disabled emphasis chip fill. */
|
|
952
|
-
--co-component-chip-variants-emphasis-disabled-text-color: var(--co-semantic-color-text-disabled); /** Disabled emphasis chip text and icon colour. */
|
|
953
696
|
--co-component-chip-variants-subtle-background-color: var(--co-semantic-surface-raised); /** Subtle chip fill at rest. */
|
|
954
697
|
--co-component-chip-variants-subtle-text-color: var(--co-semantic-color-text-default); /** Subtle chip text and icon colour. */
|
|
955
698
|
--co-component-chip-variants-subtle-hover-background-color: var(--co-semantic-surface-base); /** Subtle chip fill on hover, when it's clickable. */
|
|
956
699
|
--co-component-chip-variants-subtle-active-background-color: var(--co-semantic-color-fill-muted); /** Subtle chip fill while pressed, when it's clickable. */
|
|
957
700
|
--co-component-chip-variants-subtle-disabled-background-color: var(--co-semantic-surface-raised); /** Disabled subtle chip fill. */
|
|
958
701
|
--co-component-chip-variants-subtle-disabled-text-color: var(--co-semantic-color-text-disabled); /** Disabled subtle chip text and icon colour. */
|
|
959
|
-
--co-component-chip-variants-interactive-background-color: var(--co-semantic-color-fill-accent); /** Interactive chip fill at rest. */
|
|
960
|
-
--co-component-chip-variants-interactive-text-color: var(--co-semantic-color-text-inverse); /** Interactive chip text and icon colour. */
|
|
961
|
-
--co-component-chip-variants-interactive-disabled-background-color: var(--co-semantic-color-fill-disabled); /** Disabled interactive chip fill. */
|
|
962
|
-
--co-component-chip-variants-interactive-disabled-text-color: var(--co-semantic-color-text-disabled); /** Disabled interactive chip text and icon colour. */
|
|
963
|
-
--co-component-chip-sizes-small-padding: 2px var(--co-semantic-space-inset-sm); /** Deprecated: Chips take their min-height from semantic.size.label.medium with no vertical padding, and semantic.spacing.component.sm horizontally (decisions 0022, 0034 and 0035). Removed in 3.0. */
|
|
964
|
-
--co-component-chip-sizes-medium-padding: 2px var(--co-semantic-space-inset-sm); /** Deprecated: Chips take their min-height from semantic.size.label.medium with no vertical padding, and semantic.spacing.component.sm horizontally (decisions 0022, 0034 and 0035). Removed in 3.0. */
|
|
965
|
-
--co-component-chip-sizes-large-padding: var(--co-semantic-space-inset-sm) var(--co-semantic-space-inset-md); /** Deprecated: No component spacing tokens (decision 0022). Use semantic.spacing.component.sm and .md. Removed in 3.0. */
|
|
966
|
-
--co-component-icon-button-primary-background-color: var(--co-semantic-color-fill-emphasis); /** Deprecated: IconButton reads component.button.primary.backgroundColor, so its colours match Button's (decision 0027). Removed in 3.0. */
|
|
967
702
|
--co-component-icon-button-primary-border-radius: var(--co-semantic-radius-sm); /** Corner radius of every IconButton, matching Button. */
|
|
968
|
-
--co-component-
|
|
969
|
-
--co-component-icon-button-active-background-color: color-mix(in srgb, var(--co-semantic-color-fill-emphasis), var(--co-semantic-color-text-inverse) calc(var(--co-semantic-opacity-state-pressed) * 100%)); /** Deprecated: IconButton reads component.button.active.backgroundColor, so its colours match Button's (decision 0027). Removed in 3.0. */
|
|
703
|
+
--co-component-input-focus-border-color: var(--co-semantic-color-border-focus); /** Text input border while focused. */
|
|
970
704
|
--co-component-icon-button-focus-outline: var(--co-semantic-border-focus); /** Focus ring on every IconButton. */
|
|
971
|
-
--co-component-icon-button-disabled-background-color: var(--co-semantic-color-fill-disabled); /** Deprecated: IconButton reads component.button.disabled.backgroundColor, so its colours match Button's (decision 0027). Removed in 3.0. */
|
|
972
|
-
--co-component-icon-button-variants-secondary-background-color: var(--co-semantic-color-fill-muted); /** Deprecated: IconButton reads component.button.variants.secondary.backgroundColor, so its colours match Button's (decision 0027). Removed in 3.0. */
|
|
973
|
-
--co-component-icon-button-variants-secondary-hover-background-color: var(--co-semantic-color-fill-default); /** Deprecated: IconButton reads component.button.variants.secondary.hover.backgroundColor, so its colours match Button's (decision 0027). Removed in 3.0. */
|
|
974
|
-
--co-component-icon-button-variants-secondary-active-background-color: var(--co-semantic-surface-base); /** Deprecated: IconButton reads component.button.variants.secondary.active.backgroundColor, so its colours match Button's (decision 0027). Removed in 3.0. */
|
|
975
|
-
--co-component-icon-button-variants-secondary-disabled-background-color: var(--co-semantic-color-fill-disabled); /** Deprecated: IconButton reads component.button.variants.secondary.disabled.backgroundColor, so its colours match Button's (decision 0027). Removed in 3.0. */
|
|
976
|
-
--co-component-icon-button-variants-naked-background-color: var(--co-semantic-color-fill-none); /** Deprecated: IconButton reads component.button.variants.naked.backgroundColor, so its colours match Button's (decision 0027). Removed in 3.0. */
|
|
977
|
-
--co-component-icon-button-variants-naked-hover-background-color: var(--co-semantic-color-fill-muted); /** Deprecated: IconButton reads component.button.variants.naked.hover.backgroundColor, so its colours match Button's (decision 0027). Removed in 3.0. */
|
|
978
|
-
--co-component-icon-button-variants-naked-active-background-color: var(--co-semantic-color-fill-default); /** Deprecated: IconButton reads component.button.variants.naked.active.backgroundColor, so its colours match Button's (decision 0027). Removed in 3.0. */
|
|
979
|
-
--co-component-icon-button-variants-naked-disabled-background-color: var(--co-semantic-color-fill-none); /** Deprecated: IconButton reads component.button.variants.naked.disabled.backgroundColor, so its colours match Button's (decision 0027). Removed in 3.0. */
|
|
980
|
-
--co-component-icon-button-sizes-small-padding: var(--co-semantic-space-inset-xs); /** Deprecated: No component spacing tokens (decision 0022). Use semantic.space.inset.xs. Removed in 3.0. */
|
|
981
|
-
--co-component-icon-button-sizes-medium-padding: var(--co-semantic-space-inset-sm); /** Deprecated: No component spacing tokens (decision 0022). Use semantic.space.inset.sm. Removed in 3.0. */
|
|
982
|
-
--co-component-icon-button-sizes-large-padding: var(--co-semantic-space-inset-md); /** Deprecated: No component spacing tokens (decision 0022). Use semantic.space.inset.md. Removed in 3.0. */
|
|
983
705
|
--co-component-separator-border: var(--co-semantic-border-default); /** Divider line, the same as variants.default.border. */
|
|
984
|
-
--co-component-separator-margin: var(--co-semantic-space-800) 0; /** Deprecated: No component spacing tokens (decision 0022). Use semantic.space.800 (vertical margin). Removed in 3.0. */
|
|
985
706
|
--co-component-separator-variants-default-border: var(--co-semantic-border-default); /** Default Divider line. */
|
|
986
|
-
--co-component-separator-variants-default-margin: var(--co-semantic-space-800) 0; /** Deprecated: No component spacing tokens (decision 0022). Use semantic.space.800 (vertical margin). Removed in 3.0. */
|
|
987
707
|
--co-component-separator-variants-strong-border: var(--co-semantic-border-input-hover); /** Strong Divider line, for a firmer break. */
|
|
988
|
-
--co-component-separator-variants-strong-margin: var(--co-semantic-space-800) 0; /** Deprecated: No component spacing tokens (decision 0022). Use semantic.space.800 (vertical margin). Removed in 3.0. */
|
|
989
708
|
--co-component-separator-variants-minimal-border: var(--co-semantic-border-default); /** Minimal Divider line. */
|
|
990
|
-
--co-component-
|
|
991
|
-
--co-component-separator-sizes-small-margin: var(--co-semantic-space-400) 0; /** Deprecated: No component spacing tokens (decision 0022). Use semantic.space.400 (vertical margin). Removed in 3.0. */
|
|
992
|
-
--co-component-separator-sizes-medium-margin: var(--co-semantic-space-600) 0; /** Deprecated: No component spacing tokens (decision 0022). Use semantic.space.600 (vertical margin). Removed in 3.0. */
|
|
993
|
-
--co-component-separator-sizes-large-margin: var(--co-semantic-space-800) 0; /** Deprecated: No component spacing tokens (decision 0022). Use semantic.space.800 (vertical margin). Removed in 3.0. */
|
|
994
|
-
--co-component-separator-sizes-xlarge-margin: var(--co-semantic-space-1200) 0; /** Deprecated: No component spacing tokens (decision 0022). Use semantic.space.1200 (vertical margin). Removed in 3.0. */
|
|
995
|
-
--co-component-progress-bar-border-radius: var(--co-semantic-radius-sm); /** Deprecated: ProgressBar never read it; its track and fill use semantic.radius.xs. Removed in 3.0. */
|
|
709
|
+
--co-component-progress-bar-background-color: var(--co-semantic-color-fill-default); /** ProgressBar track, behind the filled part. */
|
|
996
710
|
--co-component-progress-bar-sizes-sm-height: var(--co-semantic-size-100); /** Thickness of the small ProgressBar, the thinnest size. */
|
|
997
711
|
--co-component-progress-bar-sizes-md-height: var(--co-semantic-size-200); /** Thickness of the medium ProgressBar, the default. */
|
|
998
712
|
--co-component-progress-bar-sizes-lg-height: var(--co-semantic-size-400); /** Thickness of the large ProgressBar, for prominent progress. */
|
|
@@ -1002,10 +716,8 @@
|
|
|
1002
716
|
--co-component-input-default-border-color: var(--co-semantic-color-border-input); /** Text input, Dropdown and Checkbox border at rest. At least 3:1 on white (decision 0025). */
|
|
1003
717
|
--co-component-input-default-border-radius: var(--co-semantic-radius-sm); /** Corner radius of text inputs and the Checkbox box. */
|
|
1004
718
|
--co-component-input-default-border-width: var(--co-semantic-border-width-thin); /** Border width of text inputs and the Checkbox box. */
|
|
1005
|
-
--co-component-input-default-padding-x: var(--co-semantic-space-inset-lg); /** Deprecated: No component spacing tokens (decision 0022). Use semantic.space.inset.lg. Removed in 3.0. */
|
|
1006
719
|
--co-component-input-placeholder-text-color: var(--co-semantic-color-text-muted); /** Placeholder text in every text input (TextField, PasswordField, NumberInput, SearchField, AgentInput). 8.18:1 on the white input fill: placeholders aren't exempt from the contrast minimum (WCAG 1.4.3), unlike disabled text. */
|
|
1007
720
|
--co-component-input-hover-border-color: var(--co-semantic-color-border-input-hover); /** Text input border on hover. */
|
|
1008
|
-
--co-component-input-focus-border-color: var(--co-semantic-color-border-focus); /** Text input border while focused. */
|
|
1009
721
|
--co-component-input-focus-outline: var(--co-semantic-border-focus); /** Focus ring on text inputs and the Checkbox box. */
|
|
1010
722
|
--co-component-input-error-border-color: var(--co-semantic-color-border-danger); /** Text input border when invalid. */
|
|
1011
723
|
--co-component-input-error-focus-border-color: var(--co-semantic-color-border-danger); /** Invalid text input border while focused. */
|
|
@@ -1018,15 +730,12 @@
|
|
|
1018
730
|
--co-component-badge-dot-size: var(--co-semantic-size-200); /** Width and height of the dot Badge indicator on a button, tab or icon. */
|
|
1019
731
|
--co-component-badge-count-min-width: var(--co-semantic-size-400); /** Minimum width of the count Badge, so a single digit sits in a circle. */
|
|
1020
732
|
--co-component-badge-count-height: var(--co-semantic-size-400); /** Height of the count Badge indicator on a button, tab or icon. */
|
|
1021
|
-
--co-component-badge-count-padding-x: var(--co-semantic-space-inset-xs); /** Deprecated: No component spacing tokens (decision 0022). Use semantic.space.inset.xs. Removed in 3.0. */
|
|
1022
733
|
--co-component-badge-count-line-height: var(--co-semantic-line-height-none); /** Line height of the count text, so the digits centre in the indicator. */
|
|
1023
734
|
--co-component-badge-ring-width: var(--co-semantic-border-width-thick); /** Ring that separates a Badge indicator from the element it sits on. */
|
|
1024
735
|
--co-component-badge-border-radius: var(--co-semantic-radius-full); /** Badge indicators are always fully circular. */
|
|
1025
|
-
--co-component-badge-label-font-weight: var(--co-semantic-font-weight-medium); /** Text weight for the badge-like label family:
|
|
1026
|
-
--co-component-field-gap: var(--co-semantic-space-200); /** Deprecated: No component spacing tokens (decision 0022). Use semantic.space.200. Removed in 3.0. */
|
|
736
|
+
--co-component-badge-label-font-weight: var(--co-semantic-font-weight-medium); /** Text weight for the badge-like label family: StatusLabel, CategoryLabel and Tag (decision 0014). Declare it after the typography shorthand, which would otherwise reset it. */
|
|
1027
737
|
--co-component-field-label-color: var(--co-semantic-color-text-default); /** Field label colour. */
|
|
1028
738
|
--co-component-field-label-color-disabled: var(--co-semantic-color-text-disabled); /** Field label colour when the field is disabled. */
|
|
1029
|
-
--co-component-field-label-gap: var(--co-semantic-space-100); /** Deprecated: No component spacing tokens (decision 0022). Use semantic.space.100. Removed in 3.0. */
|
|
1030
739
|
--co-component-field-required-indicator-color: var(--co-semantic-color-text-danger); /** Colour of the required-field asterisk. */
|
|
1031
740
|
--co-component-field-required-indicator-font-weight: var(--co-semantic-font-weight-bold); /** Weight of the required-field asterisk. */
|
|
1032
741
|
--co-component-field-helper-text-color: var(--co-semantic-color-text-muted); /** Helper text colour. */
|
|
@@ -1047,7 +756,7 @@
|
|
|
1047
756
|
--co-component-alert-appearance-borderless-border-color-warning: var(--co-semantic-color-border-none); /** Borderless warning alert: no visible border, keeping its width so both appearances take the same space (decision 0019). */
|
|
1048
757
|
--co-component-alert-appearance-borderless-border-color-info: var(--co-semantic-color-border-none); /** Borderless info alert: no visible border, keeping its width so both appearances take the same space (decision 0019). */
|
|
1049
758
|
--co-component-alert-appearance-borderless-border-color-success: var(--co-semantic-color-border-none); /** Borderless success alert: no visible border, keeping its width so both appearances take the same space (decision 0019). */
|
|
1050
|
-
--co-component-alert-title-font-weight: var(--co-semantic-font-weight-semibold); /**
|
|
759
|
+
--co-component-alert-title-font-weight: var(--co-semantic-font-weight-semibold); /** Deprecated: h6 is semibold since decision 0050, so the title takes its weight from title.typography. Use semantic.fontWeight.semibold. Removed in 4.0. */
|
|
1051
760
|
--co-component-alert-title-line-height: var(--co-semantic-line-height-tight); /** Alert titles use a tighter line height than h6. */
|
|
1052
761
|
--co-component-alert-message-line-height: var(--co-semantic-line-height-tight); /** Alert messages use a tighter line height than body. */
|
|
1053
762
|
--co-component-tab-bar-badge-font-weight: var(--co-semantic-font-weight-bold); /** Tab count badges are bold, heavier than caption. */
|
|
@@ -1065,6 +774,10 @@
|
|
|
1065
774
|
--co-component-code-block-font-family: var(--co-semantic-font-family-monospace); /** Code font. */
|
|
1066
775
|
--co-component-code-block-font-size: var(--co-semantic-font-size-xs); /** Code text size. */
|
|
1067
776
|
--co-component-code-block-line-height: var(--co-semantic-line-height-tight); /** Code line height. */
|
|
777
|
+
--co-component-sidebar-nav-width-rail: var(--co-semantic-size-1400); /** Width of a collapsed SidebarNav, the icon rail: the tallest dense row (size.row.sm, in comfortable) with an inset on each side. */
|
|
778
|
+
--co-component-sidebar-nav-width-narrow: var(--co-semantic-size-5600); /** Width of an expanded SidebarNav with width="narrow": short labels. */
|
|
779
|
+
--co-component-sidebar-nav-width-default: var(--co-semantic-size-6400); /** Width of an expanded SidebarNav with the default width: labels with a trailing count. */
|
|
780
|
+
--co-component-sidebar-nav-width-wide: var(--co-semantic-size-7500); /** Width of an expanded SidebarNav with width="wide": long titles, such as chat history. */
|
|
1068
781
|
--co-component-slider-thumb-shadow-default: var(--co-semantic-elevation-raised); /** Slider thumb at rest. */
|
|
1069
782
|
--co-component-slider-thumb-shadow-hover: var(--co-semantic-elevation-sticky); /** Slider thumb on hover: one step deeper. */
|
|
1070
783
|
--co-component-slider-thumb-shadow-active: var(--co-semantic-elevation-floating); /** Slider thumb while dragging: deepest. */
|
|
@@ -1083,7 +796,7 @@
|
|
|
1083
796
|
--co-component-empty-state-actions-max-width: var(--co-semantic-size-7500); /** Widest EmptyState's actions area grows, so buttons don't stretch. */
|
|
1084
797
|
--co-component-list-item-expanded-indent-compact: var(--co-semantic-size-1200); /** Indent of a compact ListItem's expanded content, aligning it with the label. */
|
|
1085
798
|
--co-component-list-item-expanded-indent-comfortable: var(--co-semantic-size-1500); /** Left indent of a comfortable ListItem's expanded content. */
|
|
1086
|
-
--co-component-transaction-list-item-min-height: var(--co-semantic-size-1800); /**
|
|
799
|
+
--co-component-transaction-list-item-min-height: var(--co-semantic-size-1800); /** Deprecated: Two-line rows share semantic.size.row.lg, which follows density (decision 0051). Removed in 4.0. */
|
|
1087
800
|
--co-component-status-pending-text: var(--co-semantic-color-text-muted); /** Text and icon of a pending StatusLabel: neutral, because waiting needs no attention (decision 0045). 6.01:1 on white. */
|
|
1088
801
|
--co-component-status-pending-background: var(--co-semantic-color-fill-muted); /** Fill of a pending StatusLabel (decision 0045). */
|
|
1089
802
|
--co-component-status-completed-text: var(--co-semantic-color-text-success); /** Text and icon of a completed StatusLabel, on its completed background. */
|
|
@@ -1096,250 +809,85 @@
|
|
|
1096
809
|
--co-component-status-processing-background: var(--co-semantic-color-fill-accent-muted); /** Fill of a processing StatusLabel (decision 0045). */
|
|
1097
810
|
--co-component-status-scheduled-text: var(--co-semantic-color-text-muted); /** Text and icon of a scheduled StatusLabel: neutral, because a future item needs no attention (decision 0045). 6.01:1 on white. */
|
|
1098
811
|
--co-component-status-scheduled-background: var(--co-semantic-color-fill-muted); /** Fill of a scheduled StatusLabel (decision 0045). */
|
|
1099
|
-
--co-component-transaction-credit: var(--co-semantic-color-data-positive); /** Deprecated: Nothing reads it; the semantic tier now holds this meaning (#224). Removed in 3.0. */
|
|
1100
|
-
--co-component-transaction-credit-hover: var(--co-semantic-color-data-positive); /** Deprecated: Nothing reads it; the semantic tier now holds this meaning (#224). Removed in 3.0. */
|
|
1101
|
-
--co-component-transaction-debit: var(--co-semantic-color-data-negative); /** Deprecated: Nothing reads it; the semantic tier now holds this meaning (#224). Removed in 3.0. */
|
|
1102
|
-
--co-component-transaction-debit-hover: var(--co-semantic-color-data-negative); /** Deprecated: Nothing reads it; the semantic tier now holds this meaning (#224). Removed in 3.0. */
|
|
1103
|
-
--co-component-transaction-pending: var(--co-semantic-color-text-muted); /** Deprecated: Nothing reads it; the semantic tier now holds this meaning (#224). Removed in 3.0. */
|
|
1104
|
-
--co-component-transaction-neutral: var(--co-semantic-color-text-muted); /** Deprecated: Nothing reads it; the semantic tier now holds this meaning (#224). Removed in 3.0. */
|
|
1105
812
|
--co-component-track-background: var(--co-semantic-color-fill-default); /** Unfilled track of ProgressBar and Slider: light, so the fill and thumb show the value (decision 0026). The resting fill step, 1.12:1 on white. */
|
|
1106
|
-
--co-component-tooltip-border: var(--co-semantic-border-default); /** Deprecated: Nothing reads it; the semantic tier now holds this meaning (#224). Removed in 3.0. */
|
|
1107
|
-
--co-semantic-border-subtle: var(--co-semantic-border-default); /** Deprecated: Renamed to semantic.border.emphasis by the semantic grammar (decision 0031). Removed in 3.0. */
|
|
1108
|
-
--co-semantic-border-strong: var(--co-semantic-border-input-hover); /** Deprecated: Renamed to semantic.border.input-hover by the semantic grammar (decision 0031). Removed in 3.0. */
|
|
1109
|
-
--co-semantic-border-tooltip: var(--co-semantic-border-default); /** Deprecated: Moved to the component tier as component.tooltip.border (decision 0031 §6). Removed in 3.0. */
|
|
1110
|
-
--co-semantic-border-emphasis: var(--co-semantic-border-default); /** Deprecated: Dividers have one border (decision 0048). Removed in 3.0. */
|
|
1111
|
-
--co-semantic-color-text-emphasis: var(--co-semantic-color-text-default); /** Deprecated: Emphasis comes from weight and scale, not a darker colour (decision 0048). Removed in 3.0. */
|
|
1112
|
-
--co-semantic-color-text-subdued: var(--co-semantic-color-text-muted); /** Deprecated: Renamed to semantic.color.text.muted by the semantic grammar (decision 0031). Removed in 3.0. */
|
|
1113
|
-
--co-semantic-color-text-interactive: var(--co-semantic-color-text-accent); /** Deprecated: Renamed to semantic.color.text.accent by the semantic grammar (decision 0031). Removed in 3.0. */
|
|
1114
|
-
--co-semantic-color-text-interactive-hover: var(--co-semantic-color-text-accent); /** Deprecated: Renamed to semantic.color.text.accent-hover by the semantic grammar (decision 0031). Removed in 3.0. */
|
|
1115
|
-
--co-semantic-color-text-interactive-active: var(--co-semantic-color-text-accent); /** Deprecated: Renamed to semantic.color.text.accent-pressed by the semantic grammar (decision 0031). Removed in 3.0. */
|
|
1116
|
-
--co-semantic-color-text-error: var(--co-semantic-color-text-danger); /** Deprecated: Renamed to semantic.color.text.danger by the semantic grammar (decision 0031). Removed in 3.0. */
|
|
1117
|
-
--co-semantic-color-text-accent-hover: var(--co-semantic-color-text-accent); /** Deprecated: Accent text keeps one colour in every state; the fill shows hover and pressed (#190). Removed in 3.0. */
|
|
1118
|
-
--co-semantic-color-text-accent-pressed: var(--co-semantic-color-text-accent); /** Deprecated: Accent text keeps one colour in every state; the fill shows hover and pressed (#190). Removed in 3.0. */
|
|
1119
|
-
--co-semantic-color-background-default: var(--co-semantic-surface-base); /** Deprecated: Renamed to semantic.surface.base by the semantic grammar (decision 0031). Removed in 3.0. */
|
|
1120
|
-
--co-semantic-color-background-emphasis: var(--co-semantic-color-fill-emphasis); /** Deprecated: Renamed to semantic.color.fill.emphasis by the semantic grammar (decision 0031). Removed in 3.0. */
|
|
1121
|
-
--co-semantic-color-background-surface: var(--co-semantic-color-fill-muted); /** Deprecated: Renamed to semantic.color.fill.muted by the semantic grammar (decision 0031). Removed in 3.0. */
|
|
1122
|
-
--co-semantic-color-background-inverse: var(--co-semantic-color-fill-inverse); /** Deprecated: Renamed to semantic.color.fill.inverse by the semantic grammar (decision 0031). Removed in 3.0. */
|
|
1123
|
-
--co-semantic-color-background-interactive: var(--co-semantic-color-fill-accent); /** Deprecated: Renamed to semantic.color.fill.accent by the semantic grammar (decision 0031). Removed in 3.0. */
|
|
1124
|
-
--co-semantic-color-background-interactive-subtle: var(--co-semantic-color-fill-accent-muted); /** Deprecated: Renamed to semantic.color.fill.accent-muted by the semantic grammar (decision 0031). Removed in 3.0. */
|
|
1125
|
-
--co-semantic-color-background-interactive-subtle-hover: var(--co-semantic-color-fill-accent-muted-hover); /** Deprecated: Renamed to semantic.color.fill.accent-muted-hover by the semantic grammar (decision 0031). Removed in 3.0. */
|
|
1126
|
-
--co-semantic-color-background-interactive-subtle-active: var(--co-semantic-color-fill-accent-muted-pressed); /** Deprecated: Renamed to semantic.color.fill.accent-muted-pressed by the semantic grammar (decision 0031). Removed in 3.0. */
|
|
1127
|
-
--co-semantic-color-background-error: var(--co-semantic-color-fill-danger); /** Deprecated: Renamed to semantic.color.fill.danger by the semantic grammar (decision 0031). Removed in 3.0. */
|
|
1128
|
-
--co-semantic-color-background-error-subtle: var(--co-semantic-color-fill-danger-muted); /** Deprecated: Renamed to semantic.color.fill.danger-muted by the semantic grammar (decision 0031). Removed in 3.0. */
|
|
1129
|
-
--co-semantic-color-background-success: var(--co-semantic-color-fill-success); /** Deprecated: Renamed to semantic.color.fill.success by the semantic grammar (decision 0031). Removed in 3.0. */
|
|
1130
|
-
--co-semantic-color-background-success-subtle: var(--co-semantic-color-fill-success-muted); /** Deprecated: Renamed to semantic.color.fill.success-muted by the semantic grammar (decision 0031). Removed in 3.0. */
|
|
1131
|
-
--co-semantic-color-background-warning: var(--co-semantic-color-fill-warning); /** Deprecated: Renamed to semantic.color.fill.warning by the semantic grammar (decision 0031). Removed in 3.0. */
|
|
1132
|
-
--co-semantic-color-background-warning-subtle: var(--co-semantic-color-fill-warning-muted); /** Deprecated: Renamed to semantic.color.fill.warning-muted by the semantic grammar (decision 0031). Removed in 3.0. */
|
|
1133
|
-
--co-semantic-color-background-disabled: var(--co-semantic-color-fill-disabled); /** Deprecated: Renamed to semantic.color.fill.disabled by the semantic grammar (decision 0031). Removed in 3.0. */
|
|
1134
|
-
--co-semantic-color-background-neutral: var(--co-semantic-color-fill-default); /** Deprecated: Renamed to semantic.color.fill.default by the semantic grammar (decision 0031). Removed in 3.0. */
|
|
1135
|
-
--co-semantic-color-background-neutral-hover: var(--co-semantic-color-fill-default-hover); /** Deprecated: Renamed to semantic.color.fill.default-hover by the semantic grammar (decision 0031). Removed in 3.0. */
|
|
1136
|
-
--co-semantic-color-background-neutral-active: var(--co-semantic-color-fill-default-pressed); /** Deprecated: Renamed to semantic.color.fill.default-pressed by the semantic grammar (decision 0031). Removed in 3.0. */
|
|
1137
|
-
--co-semantic-color-background-progress-track: var(--co-semantic-color-fill-default); /** Deprecated: Moved to the component tier as component.track.background (decision 0031 §6). Removed in 3.0. */
|
|
1138
|
-
--co-semantic-color-background-page: var(--co-semantic-surface-base); /** Deprecated: Renamed to semantic.surface.base by the semantic grammar (decision 0031). Removed in 3.0. */
|
|
1139
|
-
--co-semantic-color-border-subtle: var(--co-semantic-color-border-default); /** Deprecated: Renamed to semantic.color.border.emphasis by the semantic grammar (decision 0031). Removed in 3.0. */
|
|
1140
|
-
--co-semantic-color-border-control: var(--co-semantic-color-border-input); /** Deprecated: Renamed to semantic.color.border.input by the semantic grammar (decision 0031). Removed in 3.0. */
|
|
1141
|
-
--co-semantic-color-border-interactive: var(--co-semantic-color-border-accent); /** Deprecated: Renamed to semantic.color.border.accent by the semantic grammar (decision 0031). Removed in 3.0. */
|
|
1142
|
-
--co-semantic-color-border-error: var(--co-semantic-color-border-danger); /** Deprecated: Renamed to semantic.color.border.danger by the semantic grammar (decision 0031). Removed in 3.0. */
|
|
1143
|
-
--co-semantic-color-border-emphasis: var(--co-semantic-color-border-default); /** Deprecated: Dividers have one border colour (decision 0048). Removed in 3.0. */
|
|
1144
|
-
--co-semantic-color-icon-emphasis: var(--co-semantic-color-icon-default); /** Deprecated: Emphasis comes from weight and scale, not a darker colour (decision 0048). Removed in 3.0. */
|
|
1145
|
-
--co-semantic-color-icon-subdued: var(--co-semantic-color-icon-muted); /** Deprecated: Renamed to semantic.color.icon.muted by the semantic grammar (decision 0031). Removed in 3.0. */
|
|
1146
|
-
--co-semantic-color-icon-interactive: var(--co-semantic-color-icon-accent); /** Deprecated: Renamed to semantic.color.icon.accent by the semantic grammar (decision 0031). Removed in 3.0. */
|
|
1147
|
-
--co-semantic-color-icon-interactive-hover: var(--co-semantic-color-icon-accent); /** Deprecated: Renamed to semantic.color.icon.accent-hover by the semantic grammar (decision 0031). Removed in 3.0. */
|
|
1148
|
-
--co-semantic-color-icon-interactive-active: var(--co-semantic-color-icon-accent); /** Deprecated: Renamed to semantic.color.icon.accent-pressed by the semantic grammar (decision 0031). Removed in 3.0. */
|
|
1149
|
-
--co-semantic-color-icon-error: var(--co-semantic-color-icon-danger); /** Deprecated: Renamed to semantic.color.icon.danger by the semantic grammar (decision 0031). Removed in 3.0. */
|
|
1150
|
-
--co-semantic-color-icon-accent-hover: var(--co-semantic-color-icon-accent); /** Deprecated: Accent icons keeps one colour in every state; the fill shows hover and pressed (#190). Removed in 3.0. */
|
|
1151
|
-
--co-semantic-color-icon-accent-pressed: var(--co-semantic-color-icon-accent); /** Deprecated: Accent icons keeps one colour in every state; the fill shows hover and pressed (#190). Removed in 3.0. */
|
|
1152
|
-
--co-semantic-color-financial-credit: var(--co-semantic-color-data-positive); /** Deprecated: Moved to the component tier as component.transaction.credit (decision 0031 §6). Removed in 3.0. */
|
|
1153
|
-
--co-semantic-color-financial-credit-hover: var(--co-semantic-color-data-positive); /** Deprecated: Moved to the component tier as component.transaction.credit-hover (decision 0031 §6). Removed in 3.0. */
|
|
1154
|
-
--co-semantic-color-financial-debit: var(--co-semantic-color-data-negative); /** Deprecated: Moved to the component tier as component.transaction.debit (decision 0031 §6). Removed in 3.0. */
|
|
1155
|
-
--co-semantic-color-financial-debit-hover: var(--co-semantic-color-data-negative); /** Deprecated: Moved to the component tier as component.transaction.debit-hover (decision 0031 §6). Removed in 3.0. */
|
|
1156
|
-
--co-semantic-color-financial-pending: var(--co-semantic-color-text-muted); /** Deprecated: Moved to the component tier as component.transaction.pending (decision 0031 §6). Removed in 3.0. */
|
|
1157
|
-
--co-semantic-color-financial-neutral: var(--co-semantic-color-text-muted); /** Deprecated: Moved to the component tier as component.transaction.neutral (decision 0031 §6). Removed in 3.0. */
|
|
1158
|
-
--co-semantic-color-category-blue: var(--co-semantic-color-category-periwinkle); /** Deprecated: Category labels use the display colours, which carry no meaning (decision 0043). Blue is now periwinkle. Removed in 3.0. */
|
|
1159
|
-
--co-semantic-color-category-blue-strong: var(--co-semantic-color-category-periwinkle-strong); /** Deprecated: Category labels use the display colours, which carry no meaning (decision 0043). Blue is now periwinkle. Removed in 3.0. */
|
|
1160
|
-
--co-semantic-color-category-blue-emphasis: var(--co-semantic-color-category-periwinkle-strong); /** Deprecated: "emphasis" means near-black, so use semantic.color.category.blue-strong (decision 0029). Removed in 3.0. */
|
|
1161
|
-
--co-semantic-color-category-blue-subtle: var(--co-semantic-color-category-periwinkle-muted); /** Deprecated: Renamed to semantic.color.category.blue-muted by the semantic grammar (decision 0031). Removed in 3.0. */
|
|
1162
|
-
--co-semantic-color-category-purple: var(--co-semantic-color-category-magenta); /** Deprecated: Category labels use the display colours, which carry no meaning (decision 0043). Purple is now magenta. Removed in 3.0. */
|
|
1163
|
-
--co-semantic-color-category-purple-strong: var(--co-semantic-color-category-magenta-strong); /** Deprecated: Category labels use the display colours, which carry no meaning (decision 0043). Purple is now magenta. Removed in 3.0. */
|
|
1164
|
-
--co-semantic-color-category-purple-emphasis: var(--co-semantic-color-category-magenta-strong); /** Deprecated: "emphasis" means near-black, so use semantic.color.category.purple-strong (decision 0029). Removed in 3.0. */
|
|
1165
|
-
--co-semantic-color-category-purple-subtle: var(--co-semantic-color-category-magenta-muted); /** Deprecated: Renamed to semantic.color.category.purple-muted by the semantic grammar (decision 0031). Removed in 3.0. */
|
|
1166
|
-
--co-semantic-color-category-pink: var(--co-semantic-color-category-rose); /** Deprecated: Category labels use the display colours, which carry no meaning (decision 0043). Pink is now rose. Removed in 3.0. */
|
|
1167
|
-
--co-semantic-color-category-pink-strong: var(--co-semantic-color-category-rose-strong); /** Deprecated: Category labels use the display colours, which carry no meaning (decision 0043). Pink is now rose. Removed in 3.0. */
|
|
1168
|
-
--co-semantic-color-category-pink-emphasis: var(--co-semantic-color-category-rose-strong); /** Deprecated: "emphasis" means near-black, so use semantic.color.category.pink-strong (decision 0029). Removed in 3.0. */
|
|
1169
|
-
--co-semantic-color-category-pink-subtle: var(--co-semantic-color-category-rose-muted); /** Deprecated: Renamed to semantic.color.category.pink-muted by the semantic grammar (decision 0031). Removed in 3.0. */
|
|
1170
|
-
--co-semantic-color-category-yellow: var(--co-semantic-color-category-olive); /** Deprecated: Category labels use the display colours, which carry no meaning (decision 0043). Yellow is now olive. Removed in 3.0. */
|
|
1171
|
-
--co-semantic-color-category-yellow-strong: var(--co-semantic-color-category-olive-strong); /** Deprecated: Category labels use the display colours, which carry no meaning (decision 0043). Yellow is now olive. Removed in 3.0. */
|
|
1172
|
-
--co-semantic-color-category-yellow-emphasis: var(--co-semantic-color-category-olive-strong); /** Deprecated: "emphasis" means near-black, so use semantic.color.category.yellow-strong (decision 0029). Removed in 3.0. */
|
|
1173
|
-
--co-semantic-color-category-yellow-subtle: var(--co-semantic-color-category-olive-muted); /** Deprecated: Renamed to semantic.color.category.yellow-muted by the semantic grammar (decision 0031). Removed in 3.0. */
|
|
1174
|
-
--co-semantic-color-category-green: var(--co-semantic-color-category-olive); /** Deprecated: Category labels use the display colours, which carry no meaning (decision 0043). Green is now olive. Removed in 3.0. */
|
|
1175
|
-
--co-semantic-color-category-green-strong: var(--co-semantic-color-category-olive-strong); /** Deprecated: Category labels use the display colours, which carry no meaning (decision 0043). Green is now olive. Removed in 3.0. */
|
|
1176
|
-
--co-semantic-color-category-green-emphasis: var(--co-semantic-color-category-olive-strong); /** Deprecated: "emphasis" means near-black, so use semantic.color.category.green-strong (decision 0029). Removed in 3.0. */
|
|
1177
|
-
--co-semantic-color-category-green-subtle: var(--co-semantic-color-category-olive-muted); /** Deprecated: Renamed to semantic.color.category.green-muted by the semantic grammar (decision 0031). Removed in 3.0. */
|
|
1178
|
-
--co-semantic-color-category-red: var(--co-semantic-color-category-rose); /** Deprecated: Category labels use the display colours, which carry no meaning (decision 0043). Red is now rose. Removed in 3.0. */
|
|
1179
|
-
--co-semantic-color-category-red-strong: var(--co-semantic-color-category-rose-strong); /** Deprecated: Category labels use the display colours, which carry no meaning (decision 0043). Red is now rose. Removed in 3.0. */
|
|
1180
|
-
--co-semantic-color-category-red-emphasis: var(--co-semantic-color-category-rose-strong); /** Deprecated: "emphasis" means near-black, so use semantic.color.category.red-strong (decision 0029). Removed in 3.0. */
|
|
1181
|
-
--co-semantic-color-category-red-subtle: var(--co-semantic-color-category-rose-muted); /** Deprecated: Renamed to semantic.color.category.red-muted by the semantic grammar (decision 0031). Removed in 3.0. */
|
|
1182
|
-
--co-semantic-color-category-orange: var(--co-semantic-color-category-rose); /** Deprecated: Category labels use the display colours, which carry no meaning (decision 0043). Orange is now rose. Removed in 3.0. */
|
|
1183
|
-
--co-semantic-color-category-orange-strong: var(--co-semantic-color-category-rose-strong); /** Deprecated: Category labels use the display colours, which carry no meaning (decision 0043). Orange is now rose. Removed in 3.0. */
|
|
1184
|
-
--co-semantic-color-category-orange-emphasis: var(--co-semantic-color-category-rose-strong); /** Deprecated: "emphasis" means near-black, so use semantic.color.category.orange-strong (decision 0029). Removed in 3.0. */
|
|
1185
|
-
--co-semantic-color-category-orange-subtle: var(--co-semantic-color-category-rose-muted); /** Deprecated: Renamed to semantic.color.category.orange-muted by the semantic grammar (decision 0031). Removed in 3.0. */
|
|
1186
|
-
--co-semantic-color-category-gray-emphasis: var(--co-semantic-color-category-gray-strong); /** Deprecated: "emphasis" means near-black, so use semantic.color.category.gray-strong (decision 0029). Removed in 3.0. */
|
|
1187
|
-
--co-semantic-color-category-gray-subtle: var(--co-semantic-color-category-gray-muted); /** Deprecated: Renamed to semantic.color.category.gray-muted by the semantic grammar (decision 0031). Removed in 3.0. */
|
|
1188
|
-
--co-semantic-color-category-blue-text: var(--co-semantic-color-category-periwinkle-text); /** Deprecated: Category labels use the display colours, which carry no meaning (decision 0043). Blue is now periwinkle. Removed in 3.0. */
|
|
1189
|
-
--co-semantic-color-category-purple-text: var(--co-semantic-color-category-magenta-text); /** Deprecated: Category labels use the display colours, which carry no meaning (decision 0043). Purple is now magenta. Removed in 3.0. */
|
|
1190
|
-
--co-semantic-color-category-pink-text: var(--co-semantic-color-category-rose-text); /** Deprecated: Category labels use the display colours, which carry no meaning (decision 0043). Pink is now rose. Removed in 3.0. */
|
|
1191
|
-
--co-semantic-color-category-yellow-text: var(--co-semantic-color-category-olive-text); /** Deprecated: Category labels use the display colours, which carry no meaning (decision 0043). Yellow is now olive. Removed in 3.0. */
|
|
1192
|
-
--co-semantic-color-category-green-text: var(--co-semantic-color-category-olive-text); /** Deprecated: Category labels use the display colours, which carry no meaning (decision 0043). Green is now olive. Removed in 3.0. */
|
|
1193
|
-
--co-semantic-color-category-red-text: var(--co-semantic-color-category-rose-text); /** Deprecated: Category labels use the display colours, which carry no meaning (decision 0043). Red is now rose. Removed in 3.0. */
|
|
1194
|
-
--co-semantic-color-category-orange-text: var(--co-semantic-color-category-rose-text); /** Deprecated: Category labels use the display colours, which carry no meaning (decision 0043). Orange is now rose. Removed in 3.0. */
|
|
1195
|
-
--co-semantic-color-category-blue-muted: var(--co-semantic-color-category-periwinkle-muted); /** Deprecated: Category labels use the display colours, which carry no meaning (decision 0043). Blue is now periwinkle. Removed in 3.0. */
|
|
1196
|
-
--co-semantic-color-category-purple-muted: var(--co-semantic-color-category-magenta-muted); /** Deprecated: Category labels use the display colours, which carry no meaning (decision 0043). Purple is now magenta. Removed in 3.0. */
|
|
1197
|
-
--co-semantic-color-category-pink-muted: var(--co-semantic-color-category-rose-muted); /** Deprecated: Category labels use the display colours, which carry no meaning (decision 0043). Pink is now rose. Removed in 3.0. */
|
|
1198
|
-
--co-semantic-color-category-yellow-muted: var(--co-semantic-color-category-olive-muted); /** Deprecated: Category labels use the display colours, which carry no meaning (decision 0043). Yellow is now olive. Removed in 3.0. */
|
|
1199
|
-
--co-semantic-color-category-green-muted: var(--co-semantic-color-category-olive-muted); /** Deprecated: Category labels use the display colours, which carry no meaning (decision 0043). Green is now olive. Removed in 3.0. */
|
|
1200
|
-
--co-semantic-color-category-red-muted: var(--co-semantic-color-category-rose-muted); /** Deprecated: Category labels use the display colours, which carry no meaning (decision 0043). Red is now rose. Removed in 3.0. */
|
|
1201
|
-
--co-semantic-color-category-orange-muted: var(--co-semantic-color-category-rose-muted); /** Deprecated: Category labels use the display colours, which carry no meaning (decision 0043). Orange is now rose. Removed in 3.0. */
|
|
1202
|
-
--co-semantic-color-status-pending: var(--co-semantic-color-text-muted); /** Deprecated: Moved to the component tier as component.status.pending.text (decision 0031 §6). Removed in 3.0. */
|
|
1203
|
-
--co-semantic-color-status-pending-bg: var(--co-semantic-color-fill-muted); /** Deprecated: Moved to the component tier as component.status.pending.background (decision 0031 §6). Removed in 3.0. */
|
|
1204
|
-
--co-semantic-color-status-completed: var(--co-semantic-color-text-success); /** Deprecated: Moved to the component tier as component.status.completed.text (decision 0031 §6). Removed in 3.0. */
|
|
1205
|
-
--co-semantic-color-status-completed-bg: var(--co-semantic-color-fill-success-muted); /** Deprecated: Moved to the component tier as component.status.completed.background (decision 0031 §6). Removed in 3.0. */
|
|
1206
|
-
--co-semantic-color-status-failed: var(--co-semantic-color-text-danger); /** Deprecated: Moved to the component tier as component.status.failed.text (decision 0031 §6). Removed in 3.0. */
|
|
1207
|
-
--co-semantic-color-status-failed-bg: var(--co-semantic-color-fill-danger-muted); /** Deprecated: Moved to the component tier as component.status.failed.background (decision 0031 §6). Removed in 3.0. */
|
|
1208
|
-
--co-semantic-color-status-cancelled: var(--co-semantic-color-text-muted); /** Deprecated: Moved to the component tier as component.status.cancelled.text (decision 0031 §6). Removed in 3.0. */
|
|
1209
|
-
--co-semantic-color-status-cancelled-bg: var(--co-semantic-color-fill-muted); /** Deprecated: Moved to the component tier as component.status.cancelled.background (decision 0031 §6). Removed in 3.0. */
|
|
1210
|
-
--co-semantic-color-status-processing: var(--co-semantic-color-text-accent); /** Deprecated: Moved to the component tier as component.status.processing.text (decision 0031 §6). Removed in 3.0. */
|
|
1211
|
-
--co-semantic-color-status-processing-bg: var(--co-semantic-color-fill-accent-muted); /** Deprecated: Moved to the component tier as component.status.processing.background (decision 0031 §6). Removed in 3.0. */
|
|
1212
|
-
--co-semantic-color-status-scheduled: var(--co-semantic-color-text-muted); /** Deprecated: Moved to the component tier as component.status.scheduled.text (decision 0031 §6). Removed in 3.0. */
|
|
1213
|
-
--co-semantic-color-status-scheduled-bg: var(--co-semantic-color-fill-muted); /** Deprecated: Moved to the component tier as component.status.scheduled.background (decision 0031 §6). Removed in 3.0. */
|
|
1214
813
|
--co-semantic-color-fill-accent-hover: color-mix(in srgb, var(--co-semantic-color-fill-accent), var(--co-semantic-color-text-inverse) calc(var(--co-semantic-opacity-state-hover) * 100%)); /** Blue fill of a hovered accent control: fill.accent with text.inverse mixed in at opacity.state.hover (decision 0048). */
|
|
1215
814
|
--co-semantic-color-fill-accent-pressed: color-mix(in srgb, var(--co-semantic-color-fill-accent), var(--co-semantic-color-text-inverse) calc(var(--co-semantic-opacity-state-pressed) * 100%)); /** Blue fill of a pressed accent control: fill.accent with text.inverse mixed in at opacity.state.pressed (decision 0048). */
|
|
1216
815
|
--co-semantic-color-fill-danger-hover: color-mix(in srgb, var(--co-semantic-color-fill-danger), var(--co-semantic-color-text-inverse) calc(var(--co-semantic-opacity-state-hover) * 100%)); /** Fill of a hovered destructive control: fill.danger with text.inverse mixed in at opacity.state.hover (decision 0048). */
|
|
1217
816
|
--co-semantic-color-fill-danger-pressed: color-mix(in srgb, var(--co-semantic-color-fill-danger), var(--co-semantic-color-text-inverse) calc(var(--co-semantic-opacity-state-pressed) * 100%)); /** Fill of a pressed destructive control: fill.danger with text.inverse mixed in at opacity.state.pressed (decision 0048). */
|
|
1218
817
|
--co-semantic-typography-display: var(--co-semantic-font-weight-bold) var(--co-base-font-size-10)/var(--co-base-line-height-10) var(--co-base-font-family-heading); /** The largest heading, for hero titles. */
|
|
1219
|
-
--co-semantic-typography-h1: var(--co-semantic-font-weight-
|
|
1220
|
-
--co-semantic-typography-h2: var(--co-semantic-font-weight-
|
|
1221
|
-
--co-semantic-typography-h3: var(--co-semantic-font-weight-
|
|
1222
|
-
--co-semantic-typography-h4: var(--co-semantic-font-weight-
|
|
1223
|
-
--co-semantic-typography-h5: var(--co-semantic-font-weight-
|
|
1224
|
-
--co-semantic-typography-h6: var(--co-semantic-font-weight-
|
|
818
|
+
--co-semantic-typography-h1: var(--co-semantic-font-weight-semibold) var(--co-base-font-size-9)/var(--co-base-line-height-9) var(--co-base-font-family-heading); /** Heading 1: the page title, one per page. */
|
|
819
|
+
--co-semantic-typography-h2: var(--co-semantic-font-weight-semibold) var(--co-base-font-size-8)/var(--co-base-line-height-8) var(--co-base-font-family-heading); /** Heading 2: major sections of a page. */
|
|
820
|
+
--co-semantic-typography-h3: var(--co-semantic-font-weight-semibold) var(--co-base-font-size-7)/var(--co-base-line-height-7) var(--co-base-font-family-heading); /** Heading 3: the third heading level in a page outline. */
|
|
821
|
+
--co-semantic-typography-h4: var(--co-semantic-font-weight-semibold) var(--co-base-font-size-6)/var(--co-base-line-height-6) var(--co-base-font-family-heading); /** Heading 4: the fourth heading level in a page outline. */
|
|
822
|
+
--co-semantic-typography-h5: var(--co-semantic-font-weight-semibold) var(--co-base-font-size-5)/var(--co-base-line-height-5) var(--co-base-font-family-heading); /** Heading 5: the fifth heading level in a page outline. */
|
|
823
|
+
--co-semantic-typography-h6: var(--co-semantic-font-weight-semibold) var(--co-base-font-size-4)/var(--co-base-line-height-4) var(--co-base-font-family-heading); /** The smallest heading; Alert's title builds on it. */
|
|
1225
824
|
--co-semantic-typography-subtitle: var(--co-semantic-font-weight-medium) var(--co-base-font-size-3)/var(--co-base-line-height-4) var(--co-base-font-family-body); /** Subtitle: a short line under a heading. */
|
|
1226
825
|
--co-semantic-typography-body: var(--co-semantic-font-weight-regular) var(--co-base-font-size-3)/var(--co-base-line-height-4) var(--co-base-font-family-body); /** Body text: paragraphs and input values. The default text style. */
|
|
1227
826
|
--co-semantic-typography-small: var(--co-semantic-font-weight-regular) var(--co-base-font-size-2)/var(--co-base-line-height-3) var(--co-base-font-family-body); /** Small text: secondary copy and compact controls. */
|
|
1228
827
|
--co-semantic-typography-overline: var(--co-semantic-font-weight-bold) var(--co-base-font-size-1)/var(--co-base-line-height-1) var(--co-base-font-family-body); /** A short uppercase label above a heading. */
|
|
1229
828
|
--co-semantic-typography-caption: var(--co-semantic-font-weight-regular) var(--co-base-font-size-1)/var(--co-base-line-height-1) var(--co-base-font-family-body); /** Captions: helper text, metadata and image captions. */
|
|
1230
|
-
--co-semantic-typography-button1: var(--co-semantic-font-weight-medium) var(--co-semantic-font-size-md)/var(--co-semantic-line-height-normal) var(--co-semantic-font-family-body); /** Deprecated: Moved to the component tier as component.button.sizes.large.font (decision 0031 §6). Removed in 3.0. */
|
|
1231
|
-
--co-semantic-typography-button2: var(--co-semantic-font-weight-medium) var(--co-semantic-font-size-sm)/var(--co-semantic-line-height-normal) var(--co-semantic-font-family-body); /** Deprecated: Moved to the component tier as component.button.sizes.medium.font (decision 0031 §6). Removed in 3.0. */
|
|
1232
829
|
--co-semantic-typography-label: var(--co-semantic-font-weight-semibold) var(--co-base-font-size-2)/var(--co-base-line-height-3) var(--co-base-font-family-body); /** Form labels for fields such as TextField and Slider. */
|
|
1233
|
-
--co-component-button-primary-font: var(--co-semantic-typography-button1); /** Button label typography, the same as sizes.large.font. */
|
|
1234
830
|
--co-component-button-variants-accent-hover-background-color: var(--co-semantic-color-fill-accent-hover); /** Accent Button fill on hover. */
|
|
1235
831
|
--co-component-button-variants-accent-active-background-color: var(--co-semantic-color-fill-accent-pressed); /** Accent Button fill while pressed. */
|
|
1236
|
-
--co-component-button-variants-emphasis-background-color: var(--co-component-button-variants-accent-background-color); /** Deprecated: Use component.button.variants.accent.backgroundColor. Alias kept until 3.0 (decision 0016). */
|
|
1237
|
-
--co-component-button-variants-emphasis-text-color: var(--co-component-button-variants-accent-text-color); /** Deprecated: Use component.button.variants.accent.textColor. Alias kept until 3.0 (decision 0016). */
|
|
1238
|
-
--co-component-button-variants-emphasis-disabled-background-color: var(--co-component-button-variants-accent-disabled-background-color); /** Deprecated: Use component.button.variants.accent.disabled.backgroundColor. Alias kept until 3.0 (decision 0016). */
|
|
1239
|
-
--co-component-button-variants-emphasis-disabled-text-color: var(--co-component-button-variants-accent-disabled-text-color); /** Deprecated: Use component.button.variants.accent.disabled.textColor. Alias kept until 3.0 (decision 0016). */
|
|
1240
832
|
--co-component-button-variants-danger-hover-background-color: var(--co-semantic-color-fill-danger-hover); /** Danger Button fill on hover. */
|
|
1241
833
|
--co-component-button-variants-danger-active-background-color: var(--co-semantic-color-fill-danger-pressed); /** Danger Button fill while pressed. */
|
|
1242
834
|
--co-component-button-sizes-small-font: var(--co-semantic-typography-caption); /** Small Button text: the caption style, with button.sizes.small.fontWeight after it. */
|
|
1243
835
|
--co-component-chip-default-font: var(--co-semantic-typography-body); /** Chip label typography, the same as sizes.large.font. */
|
|
1244
|
-
--co-component-chip-variants-interactive-hover-background-color: var(--co-semantic-color-fill-accent-hover); /** Interactive chip fill on hover, when it's clickable. */
|
|
1245
|
-
--co-component-chip-variants-interactive-active-background-color: var(--co-semantic-color-fill-accent-pressed); /** Interactive chip fill while pressed, when it's clickable. */
|
|
1246
|
-
--co-component-chip-sizes-small-font: var(--co-semantic-typography-caption); /** Deprecated: Chips have one size (decision 0035). Use component.chip.sizes.medium.font. Removed in 3.0. */
|
|
1247
836
|
--co-component-chip-sizes-medium-font: var(--co-semantic-typography-small); /** Chip label typography. Every chip uses it: chips have one size (decision 0035). */
|
|
1248
|
-
--co-component-chip-sizes-large-font: var(--co-semantic-typography-body); /** Deprecated: Chips have one size (decision 0035). Use component.chip.sizes.medium.font. Removed in 3.0. */
|
|
1249
|
-
--co-component-progress-bar-background-color: var(--co-semantic-color-background-progress-track); /** ProgressBar track, behind the filled part. */
|
|
1250
837
|
--co-component-input-default-font: var(--co-semantic-typography-body); /** Text input value typography. */
|
|
1251
|
-
--co-component-badge-label-typography-small: var(--co-semantic-typography-caption); /** Typography for small labels in the badge-like family (
|
|
1252
|
-
--co-component-badge-label-typography-medium: var(--co-semantic-typography-small); /** Typography for medium labels in the badge-like family (
|
|
838
|
+
--co-component-badge-label-typography-small: var(--co-semantic-typography-caption); /** Typography for small labels in the badge-like family (StatusLabel small, CategoryLabel medium, Tag). Combine with label.fontWeight. */
|
|
839
|
+
--co-component-badge-label-typography-medium: var(--co-semantic-typography-small); /** Typography for medium labels in the badge-like family (StatusLabel medium, CategoryLabel large). Combine with label.fontWeight. */
|
|
1253
840
|
--co-component-field-label-typography: var(--co-semantic-typography-label); /** Field label text. */
|
|
1254
841
|
--co-component-field-helper-text-typography: var(--co-semantic-typography-caption); /** Helper and error text under a field (TextField, PasswordField, NumberInput, Dropdown, Checkbox). One step below the label. */
|
|
1255
|
-
--co-component-alert-title-typography: var(--co-semantic-typography-h6); /** Alert title style (h6), adjusted by title.
|
|
842
|
+
--co-component-alert-title-typography: var(--co-semantic-typography-h6); /** Alert title style (h6), adjusted by title.lineHeight. */
|
|
1256
843
|
--co-component-alert-message-typography: var(--co-semantic-typography-body); /** Alert message style (body), adjusted by message.lineHeight. */
|
|
1257
844
|
--co-component-tab-bar-badge-typography: var(--co-semantic-typography-caption); /** Tab count badge text. */
|
|
1258
845
|
--co-component-search-field-section-header-typography: var(--co-semantic-typography-caption); /** Suggestion-list section header text (shown uppercase). */
|
|
1259
|
-
--co-component-breadcrumbs-font: var(--co-semantic-typography-caption); /** Deprecated: Nothing reads it; the semantic tier now holds this meaning (#224). Removed in 3.0. */
|
|
1260
|
-
--co-semantic-color-background-interactive-hover: var(--co-semantic-color-fill-accent-hover); /** Deprecated: Renamed to semantic.color.fill.accent-hover by the semantic grammar (decision 0031). Removed in 3.0. */
|
|
1261
|
-
--co-semantic-color-background-interactive-active: var(--co-semantic-color-fill-accent-pressed); /** Deprecated: Renamed to semantic.color.fill.accent-pressed by the semantic grammar (decision 0031). Removed in 3.0. */
|
|
1262
|
-
--co-semantic-color-background-error-hover: var(--co-semantic-color-fill-danger-hover); /** Deprecated: Renamed to semantic.color.fill.danger-hover by the semantic grammar (decision 0031). Removed in 3.0. */
|
|
1263
|
-
--co-semantic-color-background-error-active: var(--co-semantic-color-fill-danger-pressed); /** Deprecated: Renamed to semantic.color.fill.danger-pressed by the semantic grammar (decision 0031). Removed in 3.0. */
|
|
1264
|
-
--co-semantic-typography-button3: var(--co-semantic-typography-caption); /** Deprecated: Moved to the component tier as component.button.sizes.small.font (decision 0031 §6). Removed in 3.0. */
|
|
1265
|
-
--co-semantic-typography-breadcrumb: var(--co-semantic-typography-caption); /** Deprecated: Moved to the component tier as component.breadcrumbs.font (decision 0031 §6). Removed in 3.0. */
|
|
1266
|
-
--co-component-button-variants-emphasis-hover-background-color: var(--co-component-button-variants-accent-hover-background-color); /** Deprecated: Use component.button.variants.accent.hover.backgroundColor. Alias kept until 3.0 (decision 0016). */
|
|
1267
|
-
--co-component-button-variants-emphasis-active-background-color: var(--co-component-button-variants-accent-active-background-color); /** Deprecated: Use component.button.variants.accent.active.backgroundColor. Alias kept until 3.0 (decision 0016). */
|
|
1268
846
|
}
|
|
1269
847
|
|
|
1270
|
-
/* Mode: density (decision 0032). Control heights
|
|
848
|
+
/* Mode: density (decision 0032). Control heights, control insets and row heights for a region, set with data-co-density on any element (decisions 0032, 0034 and 0051). Layout spacing doesn't change. */
|
|
1271
849
|
|
|
1272
850
|
[data-co-density="default"] {
|
|
1273
851
|
--co-semantic-size-control-sm: var(--co-base-dimension-8); /** Minimum height of small controls: small Buttons and IconButtons, buttons inside fields (decision 0034). */
|
|
1274
852
|
--co-semantic-size-control-md: var(--co-base-dimension-10); /** Minimum height of medium controls: the default IconButton, medium Buttons (decision 0034). */
|
|
1275
853
|
--co-semantic-size-control-lg: var(--co-base-dimension-12); /** Minimum height of large controls: text fields, Dropdown, SearchField, the default Button (decision 0034). */
|
|
854
|
+
--co-semantic-size-row-sm: var(--co-base-dimension-8); /** Minimum height of dense single-line rows: navigation items, menu items, dense table rows. Follows density down to the minimum pointer target (decision 0051). */
|
|
855
|
+
--co-semantic-size-row-md: var(--co-base-dimension-12); /** Minimum height of single-line list rows: ListItem and the rows built on it, such as ActionSheet actions and SearchField suggestions. Follows density (decision 0051). */
|
|
856
|
+
--co-semantic-size-row-lg: var(--co-base-dimension-18); /** Minimum height of two-line rows: TransactionListItem. Follows density (decision 0051). */
|
|
1276
857
|
--co-semantic-space-inset-xs: var(--co-base-dimension-1); /** Tightest padding inside a component, such as around an icon in a small control. */
|
|
1277
858
|
--co-semantic-space-inset-sm: var(--co-base-dimension-2); /** Small padding inside a component: chip sides, icon-to-label gaps, compact buttons. */
|
|
1278
859
|
--co-semantic-space-inset-md: var(--co-base-dimension-3); /** Medium padding inside a component: form field insides, medium IconButtons. */
|
|
1279
860
|
--co-semantic-space-inset-lg: var(--co-base-dimension-4); /** Large padding inside a component: button and input sides, card insides. */
|
|
1280
861
|
--co-semantic-space-inset-xl: var(--co-base-dimension-5); /** Generous padding inside a component, such as a prominent call to action. */
|
|
1281
862
|
--co-semantic-space-inset-2xl: var(--co-base-dimension-6); /** Largest padding inside a component: large cards, spacious form sections. */
|
|
1282
|
-
--co-component-button-primary-padding: var(--co-semantic-space-inset-md) var(--co-semantic-space-inset-lg); /** Deprecated: No component spacing tokens (decision 0022). Use semantic.spacing.component.md and .lg. Removed in 3.0. */
|
|
1283
|
-
--co-component-button-sizes-small-padding: var(--co-semantic-space-inset-sm) var(--co-semantic-space-inset-md); /** Deprecated: No component spacing tokens (decision 0022). Use semantic.spacing.component.sm and .md. Removed in 3.0. */
|
|
1284
|
-
--co-component-button-sizes-medium-padding: var(--co-semantic-space-inset-sm) var(--co-semantic-space-inset-lg); /** Deprecated: No component spacing tokens (decision 0022). Use semantic.spacing.component.sm and .lg. Removed in 3.0. */
|
|
1285
|
-
--co-component-button-sizes-large-padding: var(--co-semantic-space-inset-md) var(--co-semantic-space-inset-lg); /** Deprecated: No component spacing tokens (decision 0022). Use semantic.spacing.component.md and .lg. Removed in 3.0. */
|
|
1286
|
-
--co-component-chip-default-padding: 2px var(--co-semantic-space-inset-sm); /** Deprecated: No component spacing tokens (decision 0022). No chip reads it; chips take padding per size. Removed in 3.0. */
|
|
1287
|
-
--co-component-chip-sizes-small-padding: 2px var(--co-semantic-space-inset-sm); /** Deprecated: Chips take their min-height from semantic.size.label.medium with no vertical padding, and semantic.spacing.component.sm horizontally (decisions 0022, 0034 and 0035). Removed in 3.0. */
|
|
1288
|
-
--co-component-chip-sizes-medium-padding: 2px var(--co-semantic-space-inset-sm); /** Deprecated: Chips take their min-height from semantic.size.label.medium with no vertical padding, and semantic.spacing.component.sm horizontally (decisions 0022, 0034 and 0035). Removed in 3.0. */
|
|
1289
|
-
--co-component-chip-sizes-large-padding: var(--co-semantic-space-inset-sm) var(--co-semantic-space-inset-md); /** Deprecated: No component spacing tokens (decision 0022). Use semantic.spacing.component.sm and .md. Removed in 3.0. */
|
|
1290
|
-
--co-component-icon-button-sizes-small-padding: var(--co-semantic-space-inset-xs); /** Deprecated: No component spacing tokens (decision 0022). Use semantic.space.inset.xs. Removed in 3.0. */
|
|
1291
|
-
--co-component-icon-button-sizes-medium-padding: var(--co-semantic-space-inset-sm); /** Deprecated: No component spacing tokens (decision 0022). Use semantic.space.inset.sm. Removed in 3.0. */
|
|
1292
|
-
--co-component-icon-button-sizes-large-padding: var(--co-semantic-space-inset-md); /** Deprecated: No component spacing tokens (decision 0022). Use semantic.space.inset.md. Removed in 3.0. */
|
|
1293
|
-
--co-component-input-default-padding-x: var(--co-semantic-space-inset-lg); /** Deprecated: No component spacing tokens (decision 0022). Use semantic.space.inset.lg. Removed in 3.0. */
|
|
1294
|
-
--co-component-badge-count-padding-x: var(--co-semantic-space-inset-xs); /** Deprecated: No component spacing tokens (decision 0022). Use semantic.space.inset.xs. Removed in 3.0. */
|
|
1295
863
|
}
|
|
1296
864
|
|
|
1297
865
|
[data-co-density="compact"] {
|
|
1298
866
|
--co-semantic-size-control-sm: var(--co-base-dimension-6); /** Minimum height of small controls: small Buttons and IconButtons, buttons inside fields (decision 0034). */
|
|
1299
867
|
--co-semantic-size-control-md: var(--co-base-dimension-8); /** Minimum height of medium controls: the default IconButton, medium Buttons (decision 0034). */
|
|
1300
868
|
--co-semantic-size-control-lg: var(--co-base-dimension-10); /** Minimum height of large controls: text fields, Dropdown, SearchField, the default Button (decision 0034). */
|
|
869
|
+
--co-semantic-size-row-sm: var(--co-base-dimension-6); /** Minimum height of dense single-line rows: navigation items, menu items, dense table rows. Follows density down to the minimum pointer target (decision 0051). */
|
|
870
|
+
--co-semantic-size-row-md: var(--co-base-dimension-10); /** Minimum height of single-line list rows: ListItem and the rows built on it, such as ActionSheet actions and SearchField suggestions. Follows density (decision 0051). */
|
|
871
|
+
--co-semantic-size-row-lg: var(--co-base-dimension-16); /** Minimum height of two-line rows: TransactionListItem. Follows density (decision 0051). */
|
|
1301
872
|
--co-semantic-space-inset-xs: var(--co-base-dimension-1); /** Tightest padding inside a component, such as around an icon in a small control. */
|
|
1302
873
|
--co-semantic-space-inset-sm: var(--co-base-dimension-1); /** Small padding inside a component: chip sides, icon-to-label gaps, compact buttons. */
|
|
1303
874
|
--co-semantic-space-inset-md: var(--co-base-dimension-2); /** Medium padding inside a component: form field insides, medium IconButtons. */
|
|
1304
875
|
--co-semantic-space-inset-lg: var(--co-base-dimension-3); /** Large padding inside a component: button and input sides, card insides. */
|
|
1305
876
|
--co-semantic-space-inset-xl: var(--co-base-dimension-4); /** Generous padding inside a component, such as a prominent call to action. */
|
|
1306
877
|
--co-semantic-space-inset-2xl: var(--co-base-dimension-5); /** Largest padding inside a component: large cards, spacious form sections. */
|
|
1307
|
-
--co-component-button-primary-padding: var(--co-semantic-space-inset-md) var(--co-semantic-space-inset-lg); /** Deprecated: No component spacing tokens (decision 0022). Use semantic.spacing.component.md and .lg. Removed in 3.0. */
|
|
1308
|
-
--co-component-button-sizes-small-padding: var(--co-semantic-space-inset-sm) var(--co-semantic-space-inset-md); /** Deprecated: No component spacing tokens (decision 0022). Use semantic.spacing.component.sm and .md. Removed in 3.0. */
|
|
1309
|
-
--co-component-button-sizes-medium-padding: var(--co-semantic-space-inset-sm) var(--co-semantic-space-inset-lg); /** Deprecated: No component spacing tokens (decision 0022). Use semantic.spacing.component.sm and .lg. Removed in 3.0. */
|
|
1310
|
-
--co-component-button-sizes-large-padding: var(--co-semantic-space-inset-md) var(--co-semantic-space-inset-lg); /** Deprecated: No component spacing tokens (decision 0022). Use semantic.spacing.component.md and .lg. Removed in 3.0. */
|
|
1311
|
-
--co-component-chip-default-padding: 2px var(--co-semantic-space-inset-sm); /** Deprecated: No component spacing tokens (decision 0022). No chip reads it; chips take padding per size. Removed in 3.0. */
|
|
1312
|
-
--co-component-chip-sizes-small-padding: 2px var(--co-semantic-space-inset-sm); /** Deprecated: Chips take their min-height from semantic.size.label.medium with no vertical padding, and semantic.spacing.component.sm horizontally (decisions 0022, 0034 and 0035). Removed in 3.0. */
|
|
1313
|
-
--co-component-chip-sizes-medium-padding: 2px var(--co-semantic-space-inset-sm); /** Deprecated: Chips take their min-height from semantic.size.label.medium with no vertical padding, and semantic.spacing.component.sm horizontally (decisions 0022, 0034 and 0035). Removed in 3.0. */
|
|
1314
|
-
--co-component-chip-sizes-large-padding: var(--co-semantic-space-inset-sm) var(--co-semantic-space-inset-md); /** Deprecated: No component spacing tokens (decision 0022). Use semantic.spacing.component.sm and .md. Removed in 3.0. */
|
|
1315
|
-
--co-component-icon-button-sizes-small-padding: var(--co-semantic-space-inset-xs); /** Deprecated: No component spacing tokens (decision 0022). Use semantic.space.inset.xs. Removed in 3.0. */
|
|
1316
|
-
--co-component-icon-button-sizes-medium-padding: var(--co-semantic-space-inset-sm); /** Deprecated: No component spacing tokens (decision 0022). Use semantic.space.inset.sm. Removed in 3.0. */
|
|
1317
|
-
--co-component-icon-button-sizes-large-padding: var(--co-semantic-space-inset-md); /** Deprecated: No component spacing tokens (decision 0022). Use semantic.space.inset.md. Removed in 3.0. */
|
|
1318
|
-
--co-component-input-default-padding-x: var(--co-semantic-space-inset-lg); /** Deprecated: No component spacing tokens (decision 0022). Use semantic.space.inset.lg. Removed in 3.0. */
|
|
1319
|
-
--co-component-badge-count-padding-x: var(--co-semantic-space-inset-xs); /** Deprecated: No component spacing tokens (decision 0022). Use semantic.space.inset.xs. Removed in 3.0. */
|
|
1320
878
|
}
|
|
1321
879
|
|
|
1322
880
|
[data-co-density="comfortable"] {
|
|
1323
881
|
--co-semantic-size-control-sm: var(--co-base-dimension-10); /** Minimum height of small controls: small Buttons and IconButtons, buttons inside fields (decision 0034). */
|
|
1324
882
|
--co-semantic-size-control-md: var(--co-base-dimension-12); /** Minimum height of medium controls: the default IconButton, medium Buttons (decision 0034). */
|
|
1325
883
|
--co-semantic-size-control-lg: var(--co-base-dimension-14); /** Minimum height of large controls: text fields, Dropdown, SearchField, the default Button (decision 0034). */
|
|
884
|
+
--co-semantic-size-row-sm: var(--co-base-dimension-10); /** Minimum height of dense single-line rows: navigation items, menu items, dense table rows. Follows density down to the minimum pointer target (decision 0051). */
|
|
885
|
+
--co-semantic-size-row-md: var(--co-base-dimension-14); /** Minimum height of single-line list rows: ListItem and the rows built on it, such as ActionSheet actions and SearchField suggestions. Follows density (decision 0051). */
|
|
886
|
+
--co-semantic-size-row-lg: var(--co-base-dimension-20); /** Minimum height of two-line rows: TransactionListItem. Follows density (decision 0051). */
|
|
1326
887
|
--co-semantic-space-inset-xs: var(--co-base-dimension-2); /** Tightest padding inside a component, such as around an icon in a small control. */
|
|
1327
888
|
--co-semantic-space-inset-sm: var(--co-base-dimension-3); /** Small padding inside a component: chip sides, icon-to-label gaps, compact buttons. */
|
|
1328
889
|
--co-semantic-space-inset-md: var(--co-base-dimension-4); /** Medium padding inside a component: form field insides, medium IconButtons. */
|
|
1329
890
|
--co-semantic-space-inset-lg: var(--co-base-dimension-5); /** Large padding inside a component: button and input sides, card insides. */
|
|
1330
891
|
--co-semantic-space-inset-xl: var(--co-base-dimension-6); /** Generous padding inside a component, such as a prominent call to action. */
|
|
1331
892
|
--co-semantic-space-inset-2xl: var(--co-base-dimension-7); /** Largest padding inside a component: large cards, spacious form sections. */
|
|
1332
|
-
--co-component-button-primary-padding: var(--co-semantic-space-inset-md) var(--co-semantic-space-inset-lg); /** Deprecated: No component spacing tokens (decision 0022). Use semantic.spacing.component.md and .lg. Removed in 3.0. */
|
|
1333
|
-
--co-component-button-sizes-small-padding: var(--co-semantic-space-inset-sm) var(--co-semantic-space-inset-md); /** Deprecated: No component spacing tokens (decision 0022). Use semantic.spacing.component.sm and .md. Removed in 3.0. */
|
|
1334
|
-
--co-component-button-sizes-medium-padding: var(--co-semantic-space-inset-sm) var(--co-semantic-space-inset-lg); /** Deprecated: No component spacing tokens (decision 0022). Use semantic.spacing.component.sm and .lg. Removed in 3.0. */
|
|
1335
|
-
--co-component-button-sizes-large-padding: var(--co-semantic-space-inset-md) var(--co-semantic-space-inset-lg); /** Deprecated: No component spacing tokens (decision 0022). Use semantic.spacing.component.md and .lg. Removed in 3.0. */
|
|
1336
|
-
--co-component-chip-default-padding: 2px var(--co-semantic-space-inset-sm); /** Deprecated: No component spacing tokens (decision 0022). No chip reads it; chips take padding per size. Removed in 3.0. */
|
|
1337
|
-
--co-component-chip-sizes-small-padding: 2px var(--co-semantic-space-inset-sm); /** Deprecated: Chips take their min-height from semantic.size.label.medium with no vertical padding, and semantic.spacing.component.sm horizontally (decisions 0022, 0034 and 0035). Removed in 3.0. */
|
|
1338
|
-
--co-component-chip-sizes-medium-padding: 2px var(--co-semantic-space-inset-sm); /** Deprecated: Chips take their min-height from semantic.size.label.medium with no vertical padding, and semantic.spacing.component.sm horizontally (decisions 0022, 0034 and 0035). Removed in 3.0. */
|
|
1339
|
-
--co-component-chip-sizes-large-padding: var(--co-semantic-space-inset-sm) var(--co-semantic-space-inset-md); /** Deprecated: No component spacing tokens (decision 0022). Use semantic.spacing.component.sm and .md. Removed in 3.0. */
|
|
1340
|
-
--co-component-icon-button-sizes-small-padding: var(--co-semantic-space-inset-xs); /** Deprecated: No component spacing tokens (decision 0022). Use semantic.space.inset.xs. Removed in 3.0. */
|
|
1341
|
-
--co-component-icon-button-sizes-medium-padding: var(--co-semantic-space-inset-sm); /** Deprecated: No component spacing tokens (decision 0022). Use semantic.space.inset.sm. Removed in 3.0. */
|
|
1342
|
-
--co-component-icon-button-sizes-large-padding: var(--co-semantic-space-inset-md); /** Deprecated: No component spacing tokens (decision 0022). Use semantic.space.inset.md. Removed in 3.0. */
|
|
1343
|
-
--co-component-input-default-padding-x: var(--co-semantic-space-inset-lg); /** Deprecated: No component spacing tokens (decision 0022). Use semantic.space.inset.lg. Removed in 3.0. */
|
|
1344
|
-
--co-component-badge-count-padding-x: var(--co-semantic-space-inset-xs); /** Deprecated: No component spacing tokens (decision 0022). Use semantic.space.inset.xs. Removed in 3.0. */
|
|
1345
893
|
}
|