Skip to content
Commits on Source (4)
Expand all Hide whitespace changes
Inline Side-by-side
CHANGELOG.md
View file @ 939910bd
# [88.4.0](https://gitlab.com/gitlab-org/gitlab-ui/compare/v88.3.0...v88.4.0) (2024-08-08)
### Features
* Add missing badge design tokens ([d36a5f8](https://gitlab.com/gitlab-org/gitlab-ui/commit/d36a5f85d35a211bdb264ee4926c07852bffa73e))
# [88.3.0](https://gitlab.com/gitlab-org/gitlab-ui/compare/v88.2.1...v88.3.0) (2024-08-07)
......
package.json
View file @ 939910bd
{
"name": "@gitlab/ui",
"version": "88.3.0",
"version": "88.4.0",
"description": "GitLab UI Components",
"license": "MIT",
"main": "dist/index.js",
......
src/tokens/build/css/tokens.css
View file @ 939910bd
This diff is collapsed.
src/tokens/build/css/tokens.dark.css
View file @ 939910bd
This diff is collapsed.
src/tokens/build/js/tokens.dark.js
View file @ 939910bd
......@@ -284,20 +284,30 @@ export const GL_AVATAR_FALLBACK_BACKGROUND_COLOR_BLUE = '#002850'; // Blue backg
export const GL_AVATAR_FALLBACK_BACKGROUND_COLOR_GREEN = '#072b15'; // Green background for avatar fallback with no particular meaning.
export const GL_AVATAR_FALLBACK_BACKGROUND_COLOR_ORANGE = '#421f00'; // Orange background for avatar fallback with no particular meaning.
export const GL_AVATAR_FALLBACK_BACKGROUND_COLOR_NEUTRAL = '#28272d'; // Neutral background for avatar fallback with no particular meaning.
export const GL_BADGE_MUTED_BACKGROUND_COLOR_DEFAULT = '#28272d'; // Used for the background of a subtle neutral badge when static or the default state when linked.
export const GL_BADGE_MUTED_BACKGROUND_COLOR_ACTIVE = '#3a383f'; // Used for the background of a subtle neutral badge in the active state.
export const GL_BADGE_MUTED_BORDER_COLOR_HOVER = '#4c4b51'; // Used for the border of a subtle neutral badge in the hover state.
export const GL_BADGE_MUTED_TEXT_COLOR_DEFAULT = '#a4a3a8'; // Used for the text of a subtle neutral badge when static or the default state when linked.
export const GL_BADGE_MUTED_TEXT_COLOR_HOVER = '#bfbfc3'; // Used for the text of a subtle neutral badge in the hover state.
export const GL_BADGE_MUTED_TEXT_COLOR_FOCUS = '#bfbfc3'; // Used for the text of a subtle neutral badge in the focus state.
export const GL_BADGE_MUTED_TEXT_COLOR_ACTIVE = '#dcdcde'; // Used for the text of a subtle neutral badge in the active state.
export const GL_BADGE_MUTED_ICON_COLOR_DEFAULT = '#89888d'; // Used for the icon of a subtle neutral badge when static or the default state when linked.
export const GL_BADGE_MUTED_ICON_COLOR_HOVER = '#a4a3a8'; // Used for the icon of a subtle neutral badge in the hover state.
export const GL_BADGE_MUTED_ICON_COLOR_FOCUS = '#a4a3a8'; // Used for the icon of a subtle neutral badge in the focus state.
export const GL_BADGE_MUTED_ICON_COLOR_ACTIVE = '#bfbfc3'; // Used for the icon of a subtle neutral badge in the active state.
export const GL_BADGE_MUTED_BACKGROUND_COLOR_DEFAULT = '#28272d'; // Used for the background of a muted badge when static or the default state when linked.
export const GL_BADGE_MUTED_BACKGROUND_COLOR_HOVER = '#28272d'; // Used for the background of a muted badge in the hover state.
export const GL_BADGE_MUTED_BACKGROUND_COLOR_FOCUS = '#28272d'; // Used for the background of a muted badge in the focus state.
export const GL_BADGE_MUTED_BACKGROUND_COLOR_ACTIVE = '#3a383f'; // Used for the background of a muted badge in the active state.
export const GL_BADGE_MUTED_BORDER_COLOR_DEFAULT = 'transparent'; // Used for the border of a muted badge when static or the default state when linked.
export const GL_BADGE_MUTED_BORDER_COLOR_HOVER = '#4c4b51'; // Used for the border of a muted badge in the hover state.
export const GL_BADGE_MUTED_BORDER_COLOR_FOCUS = 'transparent'; // Used for the border of a muted badge in the focus state.
export const GL_BADGE_MUTED_BORDER_COLOR_ACTIVE = 'transparent'; // Used for the border of a muted badge in the active state.
export const GL_BADGE_MUTED_TEXT_COLOR_DEFAULT = '#a4a3a8'; // Used for the text of a muted badge when static or the default state when linked.
export const GL_BADGE_MUTED_TEXT_COLOR_HOVER = '#bfbfc3'; // Used for the text of a muted badge in the hover state.
export const GL_BADGE_MUTED_TEXT_COLOR_FOCUS = '#bfbfc3'; // Used for the text of a muted badge in the focus state.
export const GL_BADGE_MUTED_TEXT_COLOR_ACTIVE = '#dcdcde'; // Used for the text of a muted badge in the active state.
export const GL_BADGE_MUTED_ICON_COLOR_DEFAULT = '#89888d'; // Used for the icon of a muted badge when static or the default state when linked.
export const GL_BADGE_MUTED_ICON_COLOR_HOVER = '#a4a3a8'; // Used for the icon of a muted badge in the hover state.
export const GL_BADGE_MUTED_ICON_COLOR_FOCUS = '#a4a3a8'; // Used for the icon of a muted badge in the focus state.
export const GL_BADGE_MUTED_ICON_COLOR_ACTIVE = '#bfbfc3'; // Used for the icon of a muted badge in the active state.
export const GL_BADGE_NEUTRAL_BACKGROUND_COLOR_DEFAULT = '#3a383f'; // Used for the background of a neutral badge when static or the default state when linked.
export const GL_BADGE_NEUTRAL_BACKGROUND_COLOR_HOVER = '#3a383f'; // Used for the background of a neutral badge in the hover state.
export const GL_BADGE_NEUTRAL_BACKGROUND_COLOR_FOCUS = '#3a383f'; // Used for the background of a neutral badge in the focus state.
export const GL_BADGE_NEUTRAL_BACKGROUND_COLOR_ACTIVE = '#4c4b51'; // Used for the background of a neutral badge in the active state.
export const GL_BADGE_NEUTRAL_BORDER_COLOR_DEFAULT = 'transparent'; // Used for the border of a neutral badge when static or the default state when linked.
export const GL_BADGE_NEUTRAL_BORDER_COLOR_HOVER = '#4c4b51'; // Used for the border of a neutral badge in the hover state.
export const GL_BADGE_NEUTRAL_BORDER_COLOR_FOCUS = 'transparent'; // Used for the border of a neutral badge in the focus state.
export const GL_BADGE_NEUTRAL_BORDER_COLOR_ACTIVE = 'transparent'; // Used for the border of a neutral badge in the active state.
export const GL_BADGE_NEUTRAL_TEXT_COLOR_DEFAULT = '#bfbfc3'; // Used for the text of a neutral badge when static or the default state when linked.
export const GL_BADGE_NEUTRAL_TEXT_COLOR_HOVER = '#dcdcde'; // Used for the text of a neutral badge in the hover state.
export const GL_BADGE_NEUTRAL_TEXT_COLOR_FOCUS = '#dcdcde'; // Used for the text of a neutral badge in the focus state.
......@@ -307,8 +317,13 @@ export const GL_BADGE_NEUTRAL_ICON_COLOR_HOVER = '#a4a3a8'; // Used for the icon
export const GL_BADGE_NEUTRAL_ICON_COLOR_FOCUS = '#a4a3a8'; // Used for the icon of a neutral badge in the focus state.
export const GL_BADGE_NEUTRAL_ICON_COLOR_ACTIVE = '#bfbfc3'; // Used for the icon of a neutral badge in the active state.
export const GL_BADGE_INFO_BACKGROUND_COLOR_DEFAULT = '#064787'; // Used for the background of an informational badge when static or the default state when linked.
export const GL_BADGE_INFO_BACKGROUND_COLOR_HOVER = '#064787'; // Used for the background of an informational badge in the hover state.
export const GL_BADGE_INFO_BACKGROUND_COLOR_FOCUS = '#064787'; // Used for the background of an informational badge in the focus state.
export const GL_BADGE_INFO_BACKGROUND_COLOR_ACTIVE = '#0b5cad'; // Used for the background of an informational badge in the active state.
export const GL_BADGE_INFO_BORDER_COLOR_DEFAULT = 'transparent'; // Used for the border of an informational badge when static or the default state when linked.
export const GL_BADGE_INFO_BORDER_COLOR_HOVER = '#0b5cad'; // Used for the border of an informational badge in the hover state.
export const GL_BADGE_INFO_BORDER_COLOR_FOCUS = 'transparent'; // Used for the border of an informational badge in the focus state.
export const GL_BADGE_INFO_BORDER_COLOR_ACTIVE = 'transparent'; // Used for the border of an informational badge in the active state.
export const GL_BADGE_INFO_TEXT_COLOR_DEFAULT = '#9dc7f1'; // Used for the text of an informational badge when static or the default state when linked.
export const GL_BADGE_INFO_TEXT_COLOR_HOVER = '#cbe2f9'; // Used for the text of an informational badge in the hover state.
export const GL_BADGE_INFO_TEXT_COLOR_FOCUS = '#cbe2f9'; // Used for the text of an informational badge in the focus state.
......@@ -318,8 +333,13 @@ export const GL_BADGE_INFO_ICON_COLOR_HOVER = '#63a6e9'; // Used for the icon of
export const GL_BADGE_INFO_ICON_COLOR_FOCUS = '#63a6e9'; // Used for the icon of an informational badge in the focus state.
export const GL_BADGE_INFO_ICON_COLOR_ACTIVE = '#9dc7f1'; // Used for the icon of an informational badge in the active state.
export const GL_BADGE_SUCCESS_BACKGROUND_COLOR_DEFAULT = '#0d532a'; // Used for the background of a success badge when static or the default state when linked.
export const GL_BADGE_SUCCESS_BACKGROUND_COLOR_HOVER = '#0d532a'; // Used for the background of a success badge in the hover state.
export const GL_BADGE_SUCCESS_BACKGROUND_COLOR_FOCUS = '#0d532a'; // Used for the background of a success badge in the focus state.
export const GL_BADGE_SUCCESS_BACKGROUND_COLOR_ACTIVE = '#24663b'; // Used for the background of a success badge in the active state.
export const GL_BADGE_SUCCESS_BORDER_COLOR_DEFAULT = 'transparent'; // Used for the border of a success badge when static or the default state when linked.
export const GL_BADGE_SUCCESS_BORDER_COLOR_HOVER = '#24663b'; // Used for the border of a success badge in the hover state.
export const GL_BADGE_SUCCESS_BORDER_COLOR_FOCUS = 'transparent'; // Used for the border of a success badge in the focus state.
export const GL_BADGE_SUCCESS_BORDER_COLOR_ACTIVE = 'transparent'; // Used for the border of a success badge in the active state.
export const GL_BADGE_SUCCESS_TEXT_COLOR_DEFAULT = '#91d4a8'; // Used for the text of a success badge when static or the default state when linked.
export const GL_BADGE_SUCCESS_TEXT_COLOR_HOVER = '#c3e6cd'; // Used for the text of a success badge in the hover state.
export const GL_BADGE_SUCCESS_TEXT_COLOR_FOCUS = '#c3e6cd'; // Used for the text of a success badge in the focus state.
......@@ -328,31 +348,46 @@ export const GL_BADGE_SUCCESS_ICON_COLOR_DEFAULT = '#2da160'; // Used for the ic
export const GL_BADGE_SUCCESS_ICON_COLOR_HOVER = '#52b87a'; // Used for the icon of a success badge in the hover state.
export const GL_BADGE_SUCCESS_ICON_COLOR_FOCUS = '#52b87a'; // Used for the icon of a success badge in the focus state.
export const GL_BADGE_SUCCESS_ICON_COLOR_ACTIVE = '#91d4a8'; // Used for the icon of a success badge in the active state.
export const GL_BADGE_WARNING_BACKGROUND_COLOR_DEFAULT = '#703800'; // Used for the background of a warning status or confidential item when static or the default state when linked.
export const GL_BADGE_WARNING_BACKGROUND_COLOR_ACTIVE = '#8f4700'; // Used for the background of a warning status or confidential item in the active state.
export const GL_BADGE_WARNING_BORDER_COLOR_HOVER = '#8f4700'; // Used for the border of a warning status or confidential item in the hover state.
export const GL_BADGE_WARNING_TEXT_COLOR_DEFAULT = '#e9be74'; // Used for the text of a warning status or confidential item when static or the default state when linked.
export const GL_BADGE_WARNING_TEXT_COLOR_HOVER = '#f5d9a8'; // Used for the text of a warning status or confidential item in the hover state.
export const GL_BADGE_WARNING_TEXT_COLOR_FOCUS = '#f5d9a8'; // Used for the text of a warning status or confidential item in the focus state.
export const GL_BADGE_WARNING_TEXT_COLOR_ACTIVE = '#fdf1dd'; // Used for the text of a warning status or confidential item in the active state.N
export const GL_BADGE_WARNING_ICON_COLOR_DEFAULT = '#c17d10'; // Used for the icon of a warning status or confidential item when static or the default state when linked.
export const GL_BADGE_WARNING_ICON_COLOR_HOVER = '#d99530'; // Used for the icon of a warning status or confidential item in the hover state.
export const GL_BADGE_WARNING_ICON_COLOR_FOCUS = '#d99530'; // Used for the icon of a warning status or confidential item in the focus state.
export const GL_BADGE_WARNING_ICON_COLOR_ACTIVE = '#e9be74'; // Used for the icon of a warning status or confidential item in the active state.
export const GL_BADGE_DANGER_BACKGROUND_COLOR_DEFAULT = '#8d1300'; // Used for the background of a danger (critical) badge when static or the default state when linked.
export const GL_BADGE_DANGER_BACKGROUND_COLOR_ACTIVE = '#ae1800'; // Used for the background of a danger (critical) badge in the active state.
export const GL_BADGE_DANGER_BORDER_COLOR_HOVER = '#ae1800'; // Used for the border of a danger (critical) badge in the hover state.
export const GL_BADGE_DANGER_TEXT_COLOR_DEFAULT = '#fcb5aa'; // Used for the text of a danger (critical) badge when static or the default state when linked.
export const GL_BADGE_DANGER_TEXT_COLOR_HOVER = '#fdd4cd'; // Used for the text of a danger (critical) badge in the hover state.
export const GL_BADGE_DANGER_TEXT_COLOR_FOCUS = '#fdd4cd'; // Used for the text of a danger (critical) badge in the focus state.
export const GL_BADGE_DANGER_TEXT_COLOR_ACTIVE = '#fcf1ef'; // Used for the text of a danger (critical) badge in the active state.
export const GL_BADGE_DANGER_ICON_COLOR_DEFAULT = '#ec5941'; // Used for the icon of a danger (critical) badge when static or the default state when linked.
export const GL_BADGE_DANGER_ICON_COLOR_HOVER = '#f57f6c'; // Used for the icon of a danger (critical) badge in the hover state.
export const GL_BADGE_DANGER_ICON_COLOR_FOCUS = '#f57f6c'; // Used for the icon of a danger (critical) badge in the focus state.
export const GL_BADGE_DANGER_ICON_COLOR_ACTIVE = '#fcb5aa'; // Used for the icon of a danger (critical) badge in the active state.
export const GL_BADGE_WARNING_BACKGROUND_COLOR_DEFAULT = '#703800'; // Used for the background of a warning badge when static or the default state when linked.
export const GL_BADGE_WARNING_BACKGROUND_COLOR_HOVER = '#703800'; // Used for the background of a warning badge in the hover state.
export const GL_BADGE_WARNING_BACKGROUND_COLOR_FOCUS = '#703800'; // Used for the background of a warning badge in the focus state.
export const GL_BADGE_WARNING_BACKGROUND_COLOR_ACTIVE = '#8f4700'; // Used for the background of a warning badge in the active state.
export const GL_BADGE_WARNING_BORDER_COLOR_DEFAULT = 'transparent'; // Used for the border of a warning badge when static or the default state when linked.
export const GL_BADGE_WARNING_BORDER_COLOR_HOVER = '#8f4700'; // Used for the border of a warning badge in the hover state.
export const GL_BADGE_WARNING_BORDER_COLOR_FOCUS = 'transparent'; // Used for the border of a warning badge in the focus state.
export const GL_BADGE_WARNING_BORDER_COLOR_ACTIVE = 'transparent'; // Used for the border of a warning badge in the active state.
export const GL_BADGE_WARNING_TEXT_COLOR_DEFAULT = '#e9be74'; // Used for the text of a warning badge when static or the default state when linked.
export const GL_BADGE_WARNING_TEXT_COLOR_HOVER = '#f5d9a8'; // Used for the text of a warning badge in the hover state.
export const GL_BADGE_WARNING_TEXT_COLOR_FOCUS = '#f5d9a8'; // Used for the text of a warning badge in the focus state.
export const GL_BADGE_WARNING_TEXT_COLOR_ACTIVE = '#fdf1dd'; // Used for the text of a warning badge in the active state.
export const GL_BADGE_WARNING_ICON_COLOR_DEFAULT = '#c17d10'; // Used for the icon of a warning badge when static or the default state when linked.
export const GL_BADGE_WARNING_ICON_COLOR_HOVER = '#d99530'; // Used for the icon of a warning badge in the hover state.
export const GL_BADGE_WARNING_ICON_COLOR_FOCUS = '#d99530'; // Used for the icon of a warning badge in the focus state.
export const GL_BADGE_WARNING_ICON_COLOR_ACTIVE = '#e9be74'; // Used for the icon of a warning badge in the active state.
export const GL_BADGE_DANGER_BACKGROUND_COLOR_DEFAULT = '#8d1300'; // Used for the background of a danger badge when static or the default state when linked.
export const GL_BADGE_DANGER_BACKGROUND_COLOR_HOVER = '#8d1300'; // Used for the background of a danger badge in the hover state.
export const GL_BADGE_DANGER_BACKGROUND_COLOR_FOCUS = '#8d1300'; // Used for the background of a danger badge in the focus state.
export const GL_BADGE_DANGER_BACKGROUND_COLOR_ACTIVE = '#ae1800'; // Used for the background of a danger badge in the active state.
export const GL_BADGE_DANGER_BORDER_COLOR_DEFAULT = 'transparent'; // Used for the border of a danger badge when static or the default state when linked.
export const GL_BADGE_DANGER_BORDER_COLOR_HOVER = '#ae1800'; // Used for the border of a danger badge in the hover state.
export const GL_BADGE_DANGER_BORDER_COLOR_FOCUS = 'transparent'; // Used for the border of a danger badge in the focus state.
export const GL_BADGE_DANGER_BORDER_COLOR_ACTIVE = 'transparent'; // Used for the border of a danger badge in the active state.
export const GL_BADGE_DANGER_TEXT_COLOR_DEFAULT = '#fcb5aa'; // Used for the text of a danger badge when static or the default state when linked.
export const GL_BADGE_DANGER_TEXT_COLOR_HOVER = '#fdd4cd'; // Used for the text of a danger badge in the hover state.
export const GL_BADGE_DANGER_TEXT_COLOR_FOCUS = '#fdd4cd'; // Used for the text of a danger badge in the focus state.
export const GL_BADGE_DANGER_TEXT_COLOR_ACTIVE = '#fcf1ef'; // Used for the text of a danger badge in the active state.
export const GL_BADGE_DANGER_ICON_COLOR_DEFAULT = '#ec5941'; // Used for the icon of a danger badge when static or the default state when linked.
export const GL_BADGE_DANGER_ICON_COLOR_HOVER = '#f57f6c'; // Used for the icon of a danger badge in the hover state.
export const GL_BADGE_DANGER_ICON_COLOR_FOCUS = '#f57f6c'; // Used for the icon of a danger badge in the focus state.
export const GL_BADGE_DANGER_ICON_COLOR_ACTIVE = '#fcb5aa'; // Used for the icon of a danger badge in the active state.
export const GL_BADGE_TIER_BACKGROUND_COLOR_DEFAULT = '#2f2a6b'; // Used for the background of a tier related badge when static or the default state when linked.
export const GL_BADGE_TIER_BACKGROUND_COLOR_HOVER = '#2f2a6b'; // Used for the background of a tier related badge in the hover state.
export const GL_BADGE_TIER_BACKGROUND_COLOR_FOCUS = '#2f2a6b'; // Used for the background of a tier related badge in the focus state.
export const GL_BADGE_TIER_BACKGROUND_COLOR_ACTIVE = '#453894'; // Used for the background of a tier related badge in the active state.
export const GL_BADGE_TIER_BORDER_COLOR_DEFAULT = 'transparent'; // Used for the border of a tier related badge when static or the default state when linked.
export const GL_BADGE_TIER_BORDER_COLOR_HOVER = '#453894'; // Used for the border of a tier related badge in the hover state.
export const GL_BADGE_TIER_BORDER_COLOR_FOCUS = 'transparent'; // Used for the border of a tier related badge in the focus state.
export const GL_BADGE_TIER_BORDER_COLOR_ACTIVE = 'transparent'; // Used for the border of a tier related badge in the active state.
export const GL_BADGE_TIER_TEXT_COLOR_DEFAULT = '#ac93e6'; // Used for the text of a tier related badge when static or the default state when linked.
export const GL_BADGE_TIER_TEXT_COLOR_HOVER = '#cbbbf2'; // Used for the text of a tier related badge in the hover state.
export const GL_BADGE_TIER_TEXT_COLOR_FOCUS = '#cbbbf2'; // Used for the text of a tier related badge in the focus state.
......
src/tokens/build/js/tokens.js
View file @ 939910bd
......@@ -284,20 +284,30 @@ export const GL_AVATAR_FALLBACK_BACKGROUND_COLOR_BLUE = '#e9f3fc'; // Blue backg
export const GL_AVATAR_FALLBACK_BACKGROUND_COLOR_GREEN = '#ecf4ee'; // Green background for avatar fallback with no particular meaning.
export const GL_AVATAR_FALLBACK_BACKGROUND_COLOR_ORANGE = '#fdf1dd'; // Orange background for avatar fallback with no particular meaning.
export const GL_AVATAR_FALLBACK_BACKGROUND_COLOR_NEUTRAL = '#ececef'; // Neutral background for avatar fallback with no particular meaning.
export const GL_BADGE_MUTED_BACKGROUND_COLOR_DEFAULT = '#ececef'; // Used for the background of a subtle neutral badge when static or the default state when linked.
export const GL_BADGE_MUTED_BACKGROUND_COLOR_ACTIVE = '#dcdcde'; // Used for the background of a subtle neutral badge in the active state.
export const GL_BADGE_MUTED_BORDER_COLOR_HOVER = '#bfbfc3'; // Used for the border of a subtle neutral badge in the hover state.
export const GL_BADGE_MUTED_TEXT_COLOR_DEFAULT = '#626168'; // Used for the text of a subtle neutral badge when static or the default state when linked.
export const GL_BADGE_MUTED_TEXT_COLOR_HOVER = '#4c4b51'; // Used for the text of a subtle neutral badge in the hover state.
export const GL_BADGE_MUTED_TEXT_COLOR_FOCUS = '#4c4b51'; // Used for the text of a subtle neutral badge in the focus state.
export const GL_BADGE_MUTED_TEXT_COLOR_ACTIVE = '#3a383f'; // Used for the text of a subtle neutral badge in the active state.
export const GL_BADGE_MUTED_ICON_COLOR_DEFAULT = '#737278'; // Used for the icon of a subtle neutral badge when static or the default state when linked.
export const GL_BADGE_MUTED_ICON_COLOR_HOVER = '#626168'; // Used for the icon of a subtle neutral badge in the hover state.
export const GL_BADGE_MUTED_ICON_COLOR_FOCUS = '#626168'; // Used for the icon of a subtle neutral badge in the focus state.
export const GL_BADGE_MUTED_ICON_COLOR_ACTIVE = '#4c4b51'; // Used for the icon of a subtle neutral badge in the active state.
export const GL_BADGE_MUTED_BACKGROUND_COLOR_DEFAULT = '#ececef'; // Used for the background of a muted badge when static or the default state when linked.
export const GL_BADGE_MUTED_BACKGROUND_COLOR_HOVER = '#ececef'; // Used for the background of a muted badge in the hover state.
export const GL_BADGE_MUTED_BACKGROUND_COLOR_FOCUS = '#ececef'; // Used for the background of a muted badge in the focus state.
export const GL_BADGE_MUTED_BACKGROUND_COLOR_ACTIVE = '#dcdcde'; // Used for the background of a muted badge in the active state.
export const GL_BADGE_MUTED_BORDER_COLOR_DEFAULT = 'transparent'; // Used for the border of a muted badge when static or the default state when linked.
export const GL_BADGE_MUTED_BORDER_COLOR_HOVER = '#bfbfc3'; // Used for the border of a muted badge in the hover state.
export const GL_BADGE_MUTED_BORDER_COLOR_FOCUS = 'transparent'; // Used for the border of a muted badge in the focus state.
export const GL_BADGE_MUTED_BORDER_COLOR_ACTIVE = 'transparent'; // Used for the border of a muted badge in the active state.
export const GL_BADGE_MUTED_TEXT_COLOR_DEFAULT = '#626168'; // Used for the text of a muted badge when static or the default state when linked.
export const GL_BADGE_MUTED_TEXT_COLOR_HOVER = '#4c4b51'; // Used for the text of a muted badge in the hover state.
export const GL_BADGE_MUTED_TEXT_COLOR_FOCUS = '#4c4b51'; // Used for the text of a muted badge in the focus state.
export const GL_BADGE_MUTED_TEXT_COLOR_ACTIVE = '#3a383f'; // Used for the text of a muted badge in the active state.
export const GL_BADGE_MUTED_ICON_COLOR_DEFAULT = '#737278'; // Used for the icon of a muted badge when static or the default state when linked.
export const GL_BADGE_MUTED_ICON_COLOR_HOVER = '#626168'; // Used for the icon of a muted badge in the hover state.
export const GL_BADGE_MUTED_ICON_COLOR_FOCUS = '#626168'; // Used for the icon of a muted badge in the focus state.
export const GL_BADGE_MUTED_ICON_COLOR_ACTIVE = '#4c4b51'; // Used for the icon of a muted badge in the active state.
export const GL_BADGE_NEUTRAL_BACKGROUND_COLOR_DEFAULT = '#dcdcde'; // Used for the background of a neutral badge when static or the default state when linked.
export const GL_BADGE_NEUTRAL_BACKGROUND_COLOR_HOVER = '#dcdcde'; // Used for the background of a neutral badge in the hover state.
export const GL_BADGE_NEUTRAL_BACKGROUND_COLOR_FOCUS = '#dcdcde'; // Used for the background of a neutral badge in the focus state.
export const GL_BADGE_NEUTRAL_BACKGROUND_COLOR_ACTIVE = '#bfbfc3'; // Used for the background of a neutral badge in the active state.
export const GL_BADGE_NEUTRAL_BORDER_COLOR_DEFAULT = 'transparent'; // Used for the border of a neutral badge when static or the default state when linked.
export const GL_BADGE_NEUTRAL_BORDER_COLOR_HOVER = '#bfbfc3'; // Used for the border of a neutral badge in the hover state.
export const GL_BADGE_NEUTRAL_BORDER_COLOR_FOCUS = 'transparent'; // Used for the border of a neutral badge in the focus state.
export const GL_BADGE_NEUTRAL_BORDER_COLOR_ACTIVE = 'transparent'; // Used for the border of a neutral badge in the active state.
export const GL_BADGE_NEUTRAL_TEXT_COLOR_DEFAULT = '#4c4b51'; // Used for the text of a neutral badge when static or the default state when linked.
export const GL_BADGE_NEUTRAL_TEXT_COLOR_HOVER = '#3a383f'; // Used for the text of a neutral badge in the hover state.
export const GL_BADGE_NEUTRAL_TEXT_COLOR_FOCUS = '#3a383f'; // Used for the text of a neutral badge in the focus state.
......@@ -307,8 +317,13 @@ export const GL_BADGE_NEUTRAL_ICON_COLOR_HOVER = '#626168'; // Used for the icon
export const GL_BADGE_NEUTRAL_ICON_COLOR_FOCUS = '#626168'; // Used for the icon of a neutral badge in the focus state.
export const GL_BADGE_NEUTRAL_ICON_COLOR_ACTIVE = '#4c4b51'; // Used for the icon of a neutral badge in the active state.
export const GL_BADGE_INFO_BACKGROUND_COLOR_DEFAULT = '#cbe2f9'; // Used for the background of an informational badge when static or the default state when linked.
export const GL_BADGE_INFO_BACKGROUND_COLOR_HOVER = '#cbe2f9'; // Used for the background of an informational badge in the hover state.
export const GL_BADGE_INFO_BACKGROUND_COLOR_FOCUS = '#cbe2f9'; // Used for the background of an informational badge in the focus state.
export const GL_BADGE_INFO_BACKGROUND_COLOR_ACTIVE = '#9dc7f1'; // Used for the background of an informational badge in the active state.
export const GL_BADGE_INFO_BORDER_COLOR_DEFAULT = 'transparent'; // Used for the border of an informational badge when static or the default state when linked.
export const GL_BADGE_INFO_BORDER_COLOR_HOVER = '#9dc7f1'; // Used for the border of an informational badge in the hover state.
export const GL_BADGE_INFO_BORDER_COLOR_FOCUS = 'transparent'; // Used for the border of an informational badge in the focus state.
export const GL_BADGE_INFO_BORDER_COLOR_ACTIVE = 'transparent'; // Used for the border of an informational badge in the active state.
export const GL_BADGE_INFO_TEXT_COLOR_DEFAULT = '#0b5cad'; // Used for the text of an informational badge when static or the default state when linked.
export const GL_BADGE_INFO_TEXT_COLOR_HOVER = '#064787'; // Used for the text of an informational badge in the hover state.
export const GL_BADGE_INFO_TEXT_COLOR_FOCUS = '#064787'; // Used for the text of an informational badge in the focus state.
......@@ -318,8 +333,13 @@ export const GL_BADGE_INFO_ICON_COLOR_HOVER = '#1068bf'; // Used for the icon of
export const GL_BADGE_INFO_ICON_COLOR_FOCUS = '#1068bf'; // Used for the icon of an informational badge in the focus state.
export const GL_BADGE_INFO_ICON_COLOR_ACTIVE = '#0b5cad'; // Used for the icon of an informational badge in the active state.
export const GL_BADGE_SUCCESS_BACKGROUND_COLOR_DEFAULT = '#c3e6cd'; // Used for the background of a success badge when static or the default state when linked.
export const GL_BADGE_SUCCESS_BACKGROUND_COLOR_HOVER = '#c3e6cd'; // Used for the background of a success badge in the hover state.
export const GL_BADGE_SUCCESS_BACKGROUND_COLOR_FOCUS = '#c3e6cd'; // Used for the background of a success badge in the focus state.
export const GL_BADGE_SUCCESS_BACKGROUND_COLOR_ACTIVE = '#91d4a8'; // Used for the background of a success badge in the active state.
export const GL_BADGE_SUCCESS_BORDER_COLOR_DEFAULT = 'transparent'; // Used for the border of a success badge when static or the default state when linked.
export const GL_BADGE_SUCCESS_BORDER_COLOR_HOVER = '#91d4a8'; // Used for the border of a success badge in the hover state.
export const GL_BADGE_SUCCESS_BORDER_COLOR_FOCUS = 'transparent'; // Used for the border of a success badge in the focus state.
export const GL_BADGE_SUCCESS_BORDER_COLOR_ACTIVE = 'transparent'; // Used for the border of a success badge in the active state.
export const GL_BADGE_SUCCESS_TEXT_COLOR_DEFAULT = '#24663b'; // Used for the text of a success badge when static or the default state when linked.
export const GL_BADGE_SUCCESS_TEXT_COLOR_HOVER = '#0d532a'; // Used for the text of a success badge in the hover state.
export const GL_BADGE_SUCCESS_TEXT_COLOR_FOCUS = '#0d532a'; // Used for the text of a success badge in the focus state.
......@@ -328,31 +348,46 @@ export const GL_BADGE_SUCCESS_ICON_COLOR_DEFAULT = '#108548'; // Used for the ic
export const GL_BADGE_SUCCESS_ICON_COLOR_HOVER = '#217645'; // Used for the icon of a success badge in the hover state.
export const GL_BADGE_SUCCESS_ICON_COLOR_FOCUS = '#217645'; // Used for the icon of a success badge in the focus state.
export const GL_BADGE_SUCCESS_ICON_COLOR_ACTIVE = '#24663b'; // Used for the icon of a success badge in the active state.
export const GL_BADGE_WARNING_BACKGROUND_COLOR_DEFAULT = '#f5d9a8'; // Used for the background of a warning status or confidential item when static or the default state when linked.
export const GL_BADGE_WARNING_BACKGROUND_COLOR_ACTIVE = '#e9be74'; // Used for the background of a warning status or confidential item in the active state.
export const GL_BADGE_WARNING_BORDER_COLOR_HOVER = '#e9be74'; // Used for the border of a warning status or confidential item in the hover state.
export const GL_BADGE_WARNING_TEXT_COLOR_DEFAULT = '#8f4700'; // Used for the text of a warning status or confidential item when static or the default state when linked.
export const GL_BADGE_WARNING_TEXT_COLOR_HOVER = '#703800'; // Used for the text of a warning status or confidential item in the hover state.
export const GL_BADGE_WARNING_TEXT_COLOR_FOCUS = '#703800'; // Used for the text of a warning status or confidential item in the focus state.
export const GL_BADGE_WARNING_TEXT_COLOR_ACTIVE = '#5c2900'; // Used for the text of a warning status or confidential item in the active state.N
export const GL_BADGE_WARNING_ICON_COLOR_DEFAULT = '#ab6100'; // Used for the icon of a warning status or confidential item when static or the default state when linked.
export const GL_BADGE_WARNING_ICON_COLOR_HOVER = '#9e5400'; // Used for the icon of a warning status or confidential item in the hover state.
export const GL_BADGE_WARNING_ICON_COLOR_FOCUS = '#9e5400'; // Used for the icon of a warning status or confidential item in the focus state.
export const GL_BADGE_WARNING_ICON_COLOR_ACTIVE = '#8f4700'; // Used for the icon of a warning status or confidential item in the active state.
export const GL_BADGE_DANGER_BACKGROUND_COLOR_DEFAULT = '#fdd4cd'; // Used for the background of a danger (critical) badge when static or the default state when linked.
export const GL_BADGE_DANGER_BACKGROUND_COLOR_ACTIVE = '#fcb5aa'; // Used for the background of a danger (critical) badge in the active state.
export const GL_BADGE_DANGER_BORDER_COLOR_HOVER = '#fcb5aa'; // Used for the border of a danger (critical) badge in the hover state.
export const GL_BADGE_DANGER_TEXT_COLOR_DEFAULT = '#ae1800'; // Used for the text of a danger (critical) badge when static or the default state when linked.
export const GL_BADGE_DANGER_TEXT_COLOR_HOVER = '#8d1300'; // Used for the text of a danger (critical) badge in the hover state.
export const GL_BADGE_DANGER_TEXT_COLOR_FOCUS = '#8d1300'; // Used for the text of a danger (critical) badge in the focus state.
export const GL_BADGE_DANGER_TEXT_COLOR_ACTIVE = '#660e00'; // Used for the text of a danger (critical) badge in the active state.
export const GL_BADGE_DANGER_ICON_COLOR_DEFAULT = '#dd2b0e'; // Used for the icon of a danger (critical) badge when static or the default state when linked.
export const GL_BADGE_DANGER_ICON_COLOR_HOVER = '#c91c00'; // Used for the icon of a danger (critical) badge in the hover state.
export const GL_BADGE_DANGER_ICON_COLOR_FOCUS = '#c91c00'; // Used for the icon of a danger (critical) badge in the focus state.
export const GL_BADGE_DANGER_ICON_COLOR_ACTIVE = '#ae1800'; // Used for the icon of a danger (critical) badge in the active state.
export const GL_BADGE_WARNING_BACKGROUND_COLOR_DEFAULT = '#f5d9a8'; // Used for the background of a warning badge when static or the default state when linked.
export const GL_BADGE_WARNING_BACKGROUND_COLOR_HOVER = '#f5d9a8'; // Used for the background of a warning badge in the hover state.
export const GL_BADGE_WARNING_BACKGROUND_COLOR_FOCUS = '#f5d9a8'; // Used for the background of a warning badge in the focus state.
export const GL_BADGE_WARNING_BACKGROUND_COLOR_ACTIVE = '#e9be74'; // Used for the background of a warning badge in the active state.
export const GL_BADGE_WARNING_BORDER_COLOR_DEFAULT = 'transparent'; // Used for the border of a warning badge when static or the default state when linked.
export const GL_BADGE_WARNING_BORDER_COLOR_HOVER = '#e9be74'; // Used for the border of a warning badge in the hover state.
export const GL_BADGE_WARNING_BORDER_COLOR_FOCUS = 'transparent'; // Used for the border of a warning badge in the focus state.
export const GL_BADGE_WARNING_BORDER_COLOR_ACTIVE = 'transparent'; // Used for the border of a warning badge in the active state.
export const GL_BADGE_WARNING_TEXT_COLOR_DEFAULT = '#8f4700'; // Used for the text of a warning badge when static or the default state when linked.
export const GL_BADGE_WARNING_TEXT_COLOR_HOVER = '#703800'; // Used for the text of a warning badge in the hover state.
export const GL_BADGE_WARNING_TEXT_COLOR_FOCUS = '#703800'; // Used for the text of a warning badge in the focus state.
export const GL_BADGE_WARNING_TEXT_COLOR_ACTIVE = '#5c2900'; // Used for the text of a warning badge in the active state.
export const GL_BADGE_WARNING_ICON_COLOR_DEFAULT = '#ab6100'; // Used for the icon of a warning badge when static or the default state when linked.
export const GL_BADGE_WARNING_ICON_COLOR_HOVER = '#9e5400'; // Used for the icon of a warning badge in the hover state.
export const GL_BADGE_WARNING_ICON_COLOR_FOCUS = '#9e5400'; // Used for the icon of a warning badge in the focus state.
export const GL_BADGE_WARNING_ICON_COLOR_ACTIVE = '#8f4700'; // Used for the icon of a warning badge in the active state.
export const GL_BADGE_DANGER_BACKGROUND_COLOR_DEFAULT = '#fdd4cd'; // Used for the background of a danger badge when static or the default state when linked.
export const GL_BADGE_DANGER_BACKGROUND_COLOR_HOVER = '#fdd4cd'; // Used for the background of a danger badge in the hover state.
export const GL_BADGE_DANGER_BACKGROUND_COLOR_FOCUS = '#fdd4cd'; // Used for the background of a danger badge in the focus state.
export const GL_BADGE_DANGER_BACKGROUND_COLOR_ACTIVE = '#fcb5aa'; // Used for the background of a danger badge in the active state.
export const GL_BADGE_DANGER_BORDER_COLOR_DEFAULT = 'transparent'; // Used for the border of a danger badge when static or the default state when linked.
export const GL_BADGE_DANGER_BORDER_COLOR_HOVER = '#fcb5aa'; // Used for the border of a danger badge in the hover state.
export const GL_BADGE_DANGER_BORDER_COLOR_FOCUS = 'transparent'; // Used for the border of a danger badge in the focus state.
export const GL_BADGE_DANGER_BORDER_COLOR_ACTIVE = 'transparent'; // Used for the border of a danger badge in the active state.
export const GL_BADGE_DANGER_TEXT_COLOR_DEFAULT = '#ae1800'; // Used for the text of a danger badge when static or the default state when linked.
export const GL_BADGE_DANGER_TEXT_COLOR_HOVER = '#8d1300'; // Used for the text of a danger badge in the hover state.
export const GL_BADGE_DANGER_TEXT_COLOR_FOCUS = '#8d1300'; // Used for the text of a danger badge in the focus state.
export const GL_BADGE_DANGER_TEXT_COLOR_ACTIVE = '#660e00'; // Used for the text of a danger badge in the active state.
export const GL_BADGE_DANGER_ICON_COLOR_DEFAULT = '#dd2b0e'; // Used for the icon of a danger badge when static or the default state when linked.
export const GL_BADGE_DANGER_ICON_COLOR_HOVER = '#c91c00'; // Used for the icon of a danger badge in the hover state.
export const GL_BADGE_DANGER_ICON_COLOR_FOCUS = '#c91c00'; // Used for the icon of a danger badge in the focus state.
export const GL_BADGE_DANGER_ICON_COLOR_ACTIVE = '#ae1800'; // Used for the icon of a danger badge in the active state.
export const GL_BADGE_TIER_BACKGROUND_COLOR_DEFAULT = '#e1d8f9'; // Used for the background of a tier related badge when static or the default state when linked.
export const GL_BADGE_TIER_BACKGROUND_COLOR_HOVER = '#e1d8f9'; // Used for the background of a tier related badge in the hover state.
export const GL_BADGE_TIER_BACKGROUND_COLOR_FOCUS = '#e1d8f9'; // Used for the background of a tier related badge in the focus state.
export const GL_BADGE_TIER_BACKGROUND_COLOR_ACTIVE = '#cbbbf2'; // Used for the background of a tier related badge in the active state.
export const GL_BADGE_TIER_BORDER_COLOR_DEFAULT = 'transparent'; // Used for the border of a tier related badge when static or the default state when linked.
export const GL_BADGE_TIER_BORDER_COLOR_HOVER = '#cbbbf2'; // Used for the border of a tier related badge in the hover state.
export const GL_BADGE_TIER_BORDER_COLOR_FOCUS = 'transparent'; // Used for the border of a tier related badge in the focus state.
export const GL_BADGE_TIER_BORDER_COLOR_ACTIVE = 'transparent'; // Used for the border of a tier related badge in the active state.
export const GL_BADGE_TIER_TEXT_COLOR_DEFAULT = '#5943b6'; // Used for the text of a tier related badge when static or the default state when linked.
export const GL_BADGE_TIER_TEXT_COLOR_HOVER = '#453894'; // Used for the text of a tier related badge in the hover state.
export const GL_BADGE_TIER_TEXT_COLOR_FOCUS = '#453894'; // Used for the text of a tier related badge in the focus state.
......
src/tokens/build/json/tokens.dark.json
View file @ 939910bd
This diff is collapsed.
src/tokens/build/json/tokens.json
View file @ 939910bd
This diff is collapsed.
src/tokens/build/scss/_tokens.dark.scss
View file @ 939910bd
This diff is collapsed.
src/tokens/build/scss/_tokens.scss
View file @ 939910bd
This diff is collapsed.
src/tokens/build/scss/_tokens_custom_properties.scss
View file @ 939910bd
......@@ -285,8 +285,13 @@ $gl-avatar-fallback-background-color-green: var(--gl-avatar-fallback-background-
$gl-avatar-fallback-background-color-orange: var(--gl-avatar-fallback-background-color-orange);
$gl-avatar-fallback-background-color-neutral: var(--gl-avatar-fallback-background-color-neutral);
$gl-badge-muted-background-color-default: var(--gl-badge-muted-background-color-default);
$gl-badge-muted-background-color-hover: var(--gl-badge-muted-background-color-hover);
$gl-badge-muted-background-color-focus: var(--gl-badge-muted-background-color-focus);
$gl-badge-muted-background-color-active: var(--gl-badge-muted-background-color-active);
$gl-badge-muted-border-color-default: var(--gl-badge-muted-border-color-default);
$gl-badge-muted-border-color-hover: var(--gl-badge-muted-border-color-hover);
$gl-badge-muted-border-color-focus: var(--gl-badge-muted-border-color-focus);
$gl-badge-muted-border-color-active: var(--gl-badge-muted-border-color-active);
$gl-badge-muted-text-color-default: var(--gl-badge-muted-text-color-default);
$gl-badge-muted-text-color-hover: var(--gl-badge-muted-text-color-hover);
$gl-badge-muted-text-color-focus: var(--gl-badge-muted-text-color-focus);
......@@ -296,8 +301,13 @@ $gl-badge-muted-icon-color-hover: var(--gl-badge-muted-icon-color-hover);
$gl-badge-muted-icon-color-focus: var(--gl-badge-muted-icon-color-focus);
$gl-badge-muted-icon-color-active: var(--gl-badge-muted-icon-color-active);
$gl-badge-neutral-background-color-default: var(--gl-badge-neutral-background-color-default);
$gl-badge-neutral-background-color-hover: var(--gl-badge-neutral-background-color-hover);
$gl-badge-neutral-background-color-focus: var(--gl-badge-neutral-background-color-focus);
$gl-badge-neutral-background-color-active: var(--gl-badge-neutral-background-color-active);
$gl-badge-neutral-border-color-default: var(--gl-badge-neutral-border-color-default);
$gl-badge-neutral-border-color-hover: var(--gl-badge-neutral-border-color-hover);
$gl-badge-neutral-border-color-focus: var(--gl-badge-neutral-border-color-focus);
$gl-badge-neutral-border-color-active: var(--gl-badge-neutral-border-color-active);
$gl-badge-neutral-text-color-default: var(--gl-badge-neutral-text-color-default);
$gl-badge-neutral-text-color-hover: var(--gl-badge-neutral-text-color-hover);
$gl-badge-neutral-text-color-focus: var(--gl-badge-neutral-text-color-focus);
......@@ -307,8 +317,13 @@ $gl-badge-neutral-icon-color-hover: var(--gl-badge-neutral-icon-color-hover);
$gl-badge-neutral-icon-color-focus: var(--gl-badge-neutral-icon-color-focus);
$gl-badge-neutral-icon-color-active: var(--gl-badge-neutral-icon-color-active);
$gl-badge-info-background-color-default: var(--gl-badge-info-background-color-default);
$gl-badge-info-background-color-hover: var(--gl-badge-info-background-color-hover);
$gl-badge-info-background-color-focus: var(--gl-badge-info-background-color-focus);
$gl-badge-info-background-color-active: var(--gl-badge-info-background-color-active);
$gl-badge-info-border-color-default: var(--gl-badge-info-border-color-default);
$gl-badge-info-border-color-hover: var(--gl-badge-info-border-color-hover);
$gl-badge-info-border-color-focus: var(--gl-badge-info-border-color-focus);
$gl-badge-info-border-color-active: var(--gl-badge-info-border-color-active);
$gl-badge-info-text-color-default: var(--gl-badge-info-text-color-default);
$gl-badge-info-text-color-hover: var(--gl-badge-info-text-color-hover);
$gl-badge-info-text-color-focus: var(--gl-badge-info-text-color-focus);
......@@ -318,8 +333,13 @@ $gl-badge-info-icon-color-hover: var(--gl-badge-info-icon-color-hover);
$gl-badge-info-icon-color-focus: var(--gl-badge-info-icon-color-focus);
$gl-badge-info-icon-color-active: var(--gl-badge-info-icon-color-active);
$gl-badge-success-background-color-default: var(--gl-badge-success-background-color-default);
$gl-badge-success-background-color-hover: var(--gl-badge-success-background-color-hover);
$gl-badge-success-background-color-focus: var(--gl-badge-success-background-color-focus);
$gl-badge-success-background-color-active: var(--gl-badge-success-background-color-active);
$gl-badge-success-border-color-default: var(--gl-badge-success-border-color-default);
$gl-badge-success-border-color-hover: var(--gl-badge-success-border-color-hover);
$gl-badge-success-border-color-focus: var(--gl-badge-success-border-color-focus);
$gl-badge-success-border-color-active: var(--gl-badge-success-border-color-active);
$gl-badge-success-text-color-default: var(--gl-badge-success-text-color-default);
$gl-badge-success-text-color-hover: var(--gl-badge-success-text-color-hover);
$gl-badge-success-text-color-focus: var(--gl-badge-success-text-color-focus);
......@@ -329,8 +349,13 @@ $gl-badge-success-icon-color-hover: var(--gl-badge-success-icon-color-hover);
$gl-badge-success-icon-color-focus: var(--gl-badge-success-icon-color-focus);
$gl-badge-success-icon-color-active: var(--gl-badge-success-icon-color-active);
$gl-badge-warning-background-color-default: var(--gl-badge-warning-background-color-default);
$gl-badge-warning-background-color-hover: var(--gl-badge-warning-background-color-hover);
$gl-badge-warning-background-color-focus: var(--gl-badge-warning-background-color-focus);
$gl-badge-warning-background-color-active: var(--gl-badge-warning-background-color-active);
$gl-badge-warning-border-color-default: var(--gl-badge-warning-border-color-default);
$gl-badge-warning-border-color-hover: var(--gl-badge-warning-border-color-hover);
$gl-badge-warning-border-color-focus: var(--gl-badge-warning-border-color-focus);
$gl-badge-warning-border-color-active: var(--gl-badge-warning-border-color-active);
$gl-badge-warning-text-color-default: var(--gl-badge-warning-text-color-default);
$gl-badge-warning-text-color-hover: var(--gl-badge-warning-text-color-hover);
$gl-badge-warning-text-color-focus: var(--gl-badge-warning-text-color-focus);
......@@ -340,8 +365,13 @@ $gl-badge-warning-icon-color-hover: var(--gl-badge-warning-icon-color-hover);
$gl-badge-warning-icon-color-focus: var(--gl-badge-warning-icon-color-focus);
$gl-badge-warning-icon-color-active: var(--gl-badge-warning-icon-color-active);
$gl-badge-danger-background-color-default: var(--gl-badge-danger-background-color-default);
$gl-badge-danger-background-color-hover: var(--gl-badge-danger-background-color-hover);
$gl-badge-danger-background-color-focus: var(--gl-badge-danger-background-color-focus);
$gl-badge-danger-background-color-active: var(--gl-badge-danger-background-color-active);
$gl-badge-danger-border-color-default: var(--gl-badge-danger-border-color-default);
$gl-badge-danger-border-color-hover: var(--gl-badge-danger-border-color-hover);
$gl-badge-danger-border-color-focus: var(--gl-badge-danger-border-color-focus);
$gl-badge-danger-border-color-active: var(--gl-badge-danger-border-color-active);
$gl-badge-danger-text-color-default: var(--gl-badge-danger-text-color-default);
$gl-badge-danger-text-color-hover: var(--gl-badge-danger-text-color-hover);
$gl-badge-danger-text-color-focus: var(--gl-badge-danger-text-color-focus);
......@@ -351,8 +381,13 @@ $gl-badge-danger-icon-color-hover: var(--gl-badge-danger-icon-color-hover);
$gl-badge-danger-icon-color-focus: var(--gl-badge-danger-icon-color-focus);
$gl-badge-danger-icon-color-active: var(--gl-badge-danger-icon-color-active);
$gl-badge-tier-background-color-default: var(--gl-badge-tier-background-color-default);
$gl-badge-tier-background-color-hover: var(--gl-badge-tier-background-color-hover);
$gl-badge-tier-background-color-focus: var(--gl-badge-tier-background-color-focus);
$gl-badge-tier-background-color-active: var(--gl-badge-tier-background-color-active);
$gl-badge-tier-border-color-default: var(--gl-badge-tier-border-color-default);
$gl-badge-tier-border-color-hover: var(--gl-badge-tier-border-color-hover);
$gl-badge-tier-border-color-focus: var(--gl-badge-tier-border-color-focus);
$gl-badge-tier-border-color-active: var(--gl-badge-tier-border-color-active);
$gl-badge-tier-text-color-default: var(--gl-badge-tier-text-color-default);
$gl-badge-tier-text-color-hover: var(--gl-badge-tier-text-color-hover);
$gl-badge-tier-text-color-focus: var(--gl-badge-tier-text-color-focus);
......
src/tokens/contextual/badge.tokens.json
View file @ 939910bd
This diff is collapsed.