UNPKG

@salesforce-ux/design-system

Version:
1,983 lines 107 kB
{ "aliases": { "PALETTE_DARK_GRAY_TRANSPARENT_40": { "value": "rgba(8, 7, 7, 0.4)" }, "WHITE_TRANSPARENT_30": { "value": "rgba(255, 255, 255, 0.30)" }, "PALETTE_GRAY_8": { "value": "#969492" }, "WHITE_TRANSPARENT_75": { "value": "rgba(255, 255, 255, 0.75)" }, "WHITE_TRANSPARENT_97": { "value": "rgba(255, 255, 255, 0.97)" }, "PALETTE_DARK_GRAY_TRANSPARENT_30": { "value": "rgba(8, 7, 7, 0.3)" }, "WHITE_TRANSPARENT_20": { "value": "rgba(255, 255, 255, 0.20)" }, "PALETTE_GRAY_9": { "value": "#706e6b" }, "PALETTE_DARK_GRAY_TRANSPARENT_20": { "value": "rgba(8, 7, 7, 0.2)" }, "WHITE_TRANSPARENT_10": { "value": "rgba(255, 255, 255, 0.10)" }, "PALETTE_DARK_GRAY_TRANSPARENT_10": { "value": "rgba(8, 7, 7, 0.1)" }, "BLACK_TRANSPARENT_90": { "value": "rgba(0, 0, 0, 0.90)" }, "PALETTE_WARM_GRAY_10": { "value": "#514f4d" }, "BLACK_TRANSPARENT_80": { "value": "rgba(0, 0, 0, 0.80)" }, "PALETTE_WARM_GRAY_11": { "value": "#3e3e3c" }, "BLACK_TRANSPARENT_70": { "value": "rgba(0, 0, 0, 0.70)" }, "BRAND_LIGHT_ACTIVE": { "value": "#e3e5ed" }, "PALETTE_WARM_GRAY_12": { "value": "#2B2826" }, "BLACK_TRANSPARENT_60": { "value": "rgba(0, 0, 0, 0.60)" }, "PALETTE_COOL_GRAY_1": { "value": "#FFFFFF" }, "WHITE_TRANSPARENT_15": { "value": "rgba(255, 255, 255, 0.15)" }, "PALETTE_WARM_GRAY_13": { "value": "#080707" }, "BLACK_TRANSPARENT_50": { "value": "rgba(0, 0, 0, 0.50)" }, "PALETTE_COOL_GRAY_2": { "value": "#F9F9FA" }, "WHITE": { "value": "#FFFFFF" }, "BLACK_TRANSPARENT_40": { "value": "rgba(0, 0, 0, 0.40)" }, "PALETTE_COOL_GRAY_10": { "value": "#4E5356" }, "PALETTE_COOL_GRAY_3": { "value": "#F2F2F3" }, "BRAND_BACKGROUND_PRIMARY": { "value": "#b0c4df" }, "BLACK_TRANSPARENT_30": { "value": "rgba(0, 0, 0, 0.30)" }, "BRAND_PRIMARY": { "value": "#1589ee" }, "PALETTE_COOL_GRAY_11": { "value": "#3E4041" }, "PALETTE_COOL_GRAY_4": { "value": "#E9EAEC" }, "PALETTE_WARM_GRAY_1": { "value": "#FFFFFF" }, "BLACK_TRANSPARENT_20": { "value": "rgba(0, 0, 0, 0.20)" }, "PALETTE_COOL_GRAY_12": { "value": "#292C2E" }, "BRAND_CONTRAST_ACTIVE": { "value": "#0d0e12" }, "PALETTE_COOL_GRAY_5": { "value": "#D9DBDD" }, "PALETTE_WARM_GRAY_2": { "value": "#fafaf9" }, "BLACK_TRANSPARENT_10": { "value": "rgba(0, 0, 0, 0.10)" }, "PALETTE_COOL_GRAY_13": { "value": "#070808" }, "PALETTE_COOL_GRAY_6": { "value": "#C4C6CA" }, "PALETTE_WARM_GRAY_3": { "value": "#f3f2f2" }, "PALETTE_COOL_GRAY_7": { "value": "#ABADB0" }, "PALETTE_WARM_GRAY_4": { "value": "#ecebea" }, "BRAND_DARK": { "value": "#182337" }, "PALETTE_COOL_GRAY_8": { "value": "#919297" }, "BRAND_ACCESSIBLE": { "value": "#0070d2" }, "PALETTE_WARM_GRAY_5": { "value": "#dddbda" }, "BLACK_TRANSPARENT_24": { "value": "rgba(0, 0, 0, 0.24)" }, "BRAND_BACKGROUND_DARK": { "value": "#195594" }, "PALETTE_COOL_GRAY_9": { "value": "#6B6D70" }, "PALETTE_WARM_GRAY_6": { "value": "#c9c7c5" }, "PALETTE_WARM_GRAY_7": { "value": "#b0adab" }, "BRAND_TEXT_LINK_ACTIVE": { "value": "#005fb2" }, "PALETTE_WARM_GRAY_8": { "value": "#969492" }, "BLACK_TRANSPARENT_05": { "value": "rgba(0, 0, 0, 0.05)" }, "BLACK_TRANSPARENT_16": { "value": "rgba(0, 0, 0, 0.16)" }, "PALETTE_WARM_GRAY_9": { "value": "#706e6b" }, "PALETTE_LIGHT_GRAY_TRANSPARENT_90": { "value": "rgba(255, 255, 255, 0.9)" }, "BRAND_DISABLED": { "value": "#c9c7c5" }, "BLACK_TRANSPARENT_07": { "value": "rgba(0, 0, 0, 0.07)" }, "PALETTE_LIGHT_GRAY_TRANSPARENT_80": { "value": "rgba(255, 255, 255, 0.8)" }, "BRAND_TEXT_LINK": { "value": "#006DCC" }, "PALETTE_LIGHT_GRAY_TRANSPARENT_70": { "value": "rgba(255, 255, 255, 0.7)" }, "PALETTE_LIGHT_GRAY_TRANSPARENT_60": { "value": "rgba(255, 255, 255, 0.6)" }, "PALETTE_LIGHT_GRAY_TRANSPARENT_50": { "value": "rgba(255, 255, 255, 0.5)" }, "BRAND_ACCESSIBLE_ACTIVE": { "value": "#005fb2" }, "BRAND_DARK_ACTIVE": { "value": "#253045" }, "PALETTE_GRAY_10": { "value": "#514f4d" }, "PALETTE_LIGHT_GRAY_TRANSPARENT_40": { "value": "rgba(255, 255, 255, 0.4)" }, "PALETTE_GRAY_11": { "value": "#3e3e3c" }, "PALETTE_LIGHT_GRAY_TRANSPARENT_30": { "value": "rgba(255, 255, 255, 0.3)" }, "PALETTE_GRAY_12": { "value": "#2B2826" }, "PALETTE_GRAY_1": { "value": "#FFFFFF" }, "PALETTE_LIGHT_GRAY_TRANSPARENT_20": { "value": "rgba(255, 255, 255, 0.2)" }, "WHITE_TRANSPARENT_90": { "value": "rgba(255, 255, 255, 0.90)" }, "BRAND_CONTRAST": { "value": "#1a1b1e" }, "PALETTE_GRAY_13": { "value": "#080707" }, "PALETTE_GRAY_2": { "value": "#fafaf9" }, "WHITE_TRANSPARENT_80": { "value": "rgba(255, 255, 255, 0.80)" }, "PALETTE_DARK_GRAY_TRANSPARENT_90": { "value": "rgba(8, 7, 7, 0.9)" }, "PALETTE_GRAY_3": { "value": "#f3f2f2" }, "BRAND_PRIMARY_ACTIVE": { "value": "#007add" }, "PALETTE_LIGHT_GRAY_TRANSPARENT_10": { "value": "rgba(255, 255, 255, 0.1)" }, "PALETTE_DARK_GRAY_TRANSPARENT_80": { "value": "rgba(8, 7, 7, 0.8)" }, "PALETTE_GRAY_4": { "value": "#ecebea" }, "PALETTE_DARK_GRAY_TRANSPARENT_70": { "value": "rgba(8, 7, 7, 0.7)" }, "PALETTE_GRAY_5": { "value": "#dddbda" }, "WHITE_TRANSPARENT_60": { "value": "rgba(255, 255, 255, 0.60)" }, "PALETTE_DARK_GRAY_TRANSPARENT_60": { "value": "rgba(8, 7, 7, 0.6)" }, "BRAND_LIGHT": { "value": "#f4f6fe" }, "PALETTE_GRAY_6": { "value": "#c9c7c5" }, "WHITE_TRANSPARENT_50": { "value": "rgba(255, 255, 255, 0.50)" }, "PALETTE_DARK_GRAY_TRANSPARENT_50": { "value": "rgba(8, 7, 7, 0.5)" }, "WHITE_TRANSPARENT_40": { "value": "rgba(255, 255, 255, 0.40)" }, "PALETTE_GRAY_7": { "value": "#b0adab" }, "BLACK": { "value": "#000000" }, "ALUMINIUM_BLUE": { "value": "hsl(210, 25%, 48%)" }, "FOREST_GREEN": { "value": "#027E46" }, "KOROMIKO": { "value": "#FFB75D" }, "RAIN_PURPLE_900": { "value": "hsl(257, 39.2%, 42%)" }, "SUNSHADE": { "value": "#FF9E2C" }, "FUN_GREEN": { "value": "#028048" }, "ATHENS_BLUE": { "value": "hsl(210, 42.36%, 96.53%)" }, "ROME_BLUE": { "value": "hsl(210, 30.56%, 82.72%)" }, "EMERALD": { "value": "#4BCA81" }, "MALIBU": { "value": "#5EB4FF" }, "SEA_GREEN_100": { "value": "hsl(177, 64.7%, 51.9%)" }, "GEYSER": { "value": "#D8DDE6" }, "RHINO_BLUE": { "value": "hsl(210, 42.86%, 28%)" }, "SALEM": { "value": "#04844B" }, "SEA_GREEN_300": { "value": "hsl(177, 61.3%, 47.1%)" }, "REGENT_GREY": { "value": "#7E8C99" }, "MIDNIGHT_BLUE": { "value": "#00396B" }, "SEA_GREEN_500": { "value": "hsl(177, 62.6%, 41.2%)" }, "GHOST_BLUE": { "value": "hsl(210, 25.93%, 59.5%)" }, "SKY_BLUE_100": { "value": "hsl(208, 93.3%, 70.1%)" }, "SEA_GREEN_700": { "value": "hsl(177, 65.3%, 35.7%)" }, "CERULEAN": { "value": "#00A1DF" }, "SNOWY_MINT": { "value": "#D9FFDF" }, "KAITOKE_GREEN": { "value": "#004a29" }, "SKY_BLUE_300": { "value": "hsl(208, 89.6%, 61.4%)" }, "SEA_GREEN_900": { "value": "hsl(177, 65.3%, 30.9%)" }, "ENDEAVOUR": { "value": "#005FB2" }, "TANGERINE": { "value": "#FF9A3C" }, "SANTORINI": { "value": "#006DCC" }, "DEEP_BLUSH": { "value": "#EA8288" }, "SKY_BLUE_500": { "value": "hsl(208, 84.3%, 55.3%)" }, "TOREA_BAY": { "value": "#0B2399" }, "DEEP_COVE": { "value": "#061C3F" }, "AZURE": { "value": "#1589EE" }, "BISCAY": { "value": "#16325C" }, "MAROON": { "value": "#870500" }, "SKY_BLUE_700": { "value": "hsl(208, 73.9%, 48.3%)" }, "STEAM": { "value": "#E0E5EE" }, "CINNAMON": { "value": "#844800" }, "VALENCIA": { "value": "#D4504C" }, "SKY_BLUE_900": { "value": "hsl(208, 77%, 41.8%)" }, "LINK_WATER": { "value": "#F4F6F9" }, "TRANSPARENT": { "value": "transparent" }, "TABASCO": { "value": "#A61A14" }, "BIGSTONE_BLUE": { "value": "hsl(210, 66.67%, 12%)" }, "SPIDER_BLUE": { "value": "hsl(210, 28.57%, 72%)" }, "SCIENCE_BLUE": { "value": "#0070D2" }, "LEMON_CHIFFON": { "value": "#FAFFBD" }, "SAN_JUAN": { "value": "#2A426C" }, "RAIN_PURPLE_100": { "value": "hsl(257, 83.1%, 76.3%)" }, "MEXICAN_RED": { "value": "#A12B2B" }, "ROLLINGSTONE_BLUE": { "value": "hsl(210, 33.33%, 37.5%)" }, "WHITE_LILAC": { "value": "#EEF1F6" }, "FLUSH_MAHOGANY": { "value": "#C23934" }, "GRADIENT_SHADOW_BOTTOM": { "value": "linear-gradient(to bottom, rgba(0, 0, 0, 0.25) 0, rgba(0, 0, 0, 0) 100%)" }, "RAIN_PURPLE_300": { "value": "hsl(257, 72.2%, 67.6%)" }, "GORSE": { "value": "#fff03f" }, "REGENT_GREY_TRANSPARENT_80": { "value": "rgba(126, 140, 153, 0.80)" }, "ZODIAC_BLUE": { "value": "hsl(210, 53.85%, 19.5%)" }, "RAIN_PURPLE_500": { "value": "hsl(257, 61.2%, 58.8%)" }, "PIPPIN": { "value": "#FFDDE1" }, "SPARTA_BLUE": { "value": "hsl(210, 32.2%, 92.62%)" }, "PATTEN_BLUE": { "value": "#D8EDFF" }, "RAIN_PURPLE_700": { "value": "hsl(257, 50.2%, 50%)" }, "SPACING_X_SMALL": { "value": "0.5rem" }, "SPACING_XXX_SMALL": { "value": "0.125rem" }, "SPACING_XX_SMALL": { "value": "0.25rem" }, "SPACING_SMALL": { "value": "0.75rem" }, "SPACING_MEDIUM": { "value": "1rem" }, "SPACING_NONE": { "value": "0" }, "SPACING_X_LARGE": { "value": "2rem" }, "SPACING_XX_LARGE": { "value": "3rem" }, "SPACING_LARGE": { "value": "1.5rem" }, "FONT_SIZE_1": { "value": "0.625rem" }, "FONT_SIZE_2": { "value": "0.75rem" }, "FONT_SIZE_3": { "value": "0.8125rem" }, "FONT_SIZE_4": { "value": "0.875rem" }, "FONT_SIZE_5": { "value": "1rem" }, "FONT_SIZE_6": { "value": "1.125rem" }, "FONT_SIZE_7": { "value": "1.25rem" }, "FONT_SIZE_8": { "value": "1.5rem" }, "FONT_SIZE_9": { "value": "1.75rem" }, "FONT_SIZE_10": { "value": "2rem" }, "FONT_SIZE_11": { "value": "2.625rem" } }, "props": { "AVATAR_GROUP_COLOR_BACKGROUND_LIGHTEST": { "scope": "component", "type": "color", "category": "background-color", "cssProperties": [ "background*", "border*", "box-shadow" ], "value": "#FFFFFF", "comment": "White avatar group background color.", "originalValue": "{!PALETTE_GRAY_1}", "name": "AVATAR_GROUP_COLOR_BACKGROUND_LIGHTEST" }, "AVATAR_GROUP_COLOR_BACKGROUND_INVERSE": { "scope": "component", "type": "color", "category": "background-color", "cssProperties": [ "background*", "border*", "box-shadow" ], "value": "#706e6b", "comment": "Dark gray avatar group background color.", "originalValue": "{!PALETTE_GRAY_9}", "name": "AVATAR_GROUP_COLOR_BACKGROUND_INVERSE" }, "BADGE_COLOR_BACKGROUND_LIGHTEST": { "scope": "component", "type": "color", "category": "background-color", "cssProperties": [ "background*", "border*", "box-shadow" ], "value": "#FFFFFF", "comment": "White badge background color.", "originalValue": "{!PALETTE_GRAY_1}", "name": "BADGE_COLOR_BACKGROUND_LIGHTEST" }, "BADGE_COLOR_BACKGROUND_INVERSE": { "scope": "component", "type": "color", "category": "background-color", "cssProperties": [ "background*", "border*", "box-shadow" ], "value": "#706e6b", "comment": "Dark gray badge background color.", "originalValue": "{!PALETTE_GRAY_9}", "name": "BADGE_COLOR_BACKGROUND_INVERSE" }, "BRAND_BAND_DEFAULT_IMAGE": { "scope": "component", "type": "string", "category": "background-color", "cssProperties": [ "background*" ], "value": "", "originalValue": "", "name": "BRAND_BAND_DEFAULT_IMAGE" }, "BRAND_BAND_COLOR_BACKGROUND_PRIMARY": { "scope": "component", "type": "color", "category": "background-color", "cssProperties": [ "background*" ], "value": "transparent", "originalValue": "transparent", "name": "BRAND_BAND_COLOR_BACKGROUND_PRIMARY" }, "BRAND_BAND_COLOR_BACKGROUND_PRIMARY_TRANSPARENT": { "scope": "component", "type": "color", "category": "background-color", "cssProperties": [ "background*" ], "value": "transparent", "originalValue": "transparent", "name": "BRAND_BAND_COLOR_BACKGROUND_PRIMARY_TRANSPARENT" }, "BRAND_BAND_COLOR_BACKGROUND_SECONDARY": { "scope": "component", "type": "color", "category": "background-color", "cssProperties": [ "background*" ], "value": "transparent", "originalValue": "transparent", "name": "BRAND_BAND_COLOR_BACKGROUND_SECONDARY" }, "BRAND_BAND_COLOR_BACKGROUND_SECONDARY_TRANSPARENT": { "scope": "component", "type": "color", "category": "background-color", "cssProperties": [ "background*" ], "value": "transparent", "originalValue": "transparent", "name": "BRAND_BAND_COLOR_BACKGROUND_SECONDARY_TRANSPARENT" }, "BRAND_BAND_IMAGE_HEIGHT_SMALL": { "scope": "component", "type": "size", "category": "sizing", "cssProperties": [ "*width", "*height" ], "value": "6rem", "originalValue": "6rem", "name": "BRAND_BAND_IMAGE_HEIGHT_SMALL" }, "BRAND_BAND_IMAGE_HEIGHT_MEDIUM": { "scope": "component", "type": "size", "category": "sizing", "cssProperties": [ "*width", "*height" ], "value": "12.5rem", "originalValue": "12.5rem", "name": "BRAND_BAND_IMAGE_HEIGHT_MEDIUM" }, "BRAND_BAND_IMAGE_HEIGHT_LARGE": { "scope": "component", "type": "size", "category": "sizing", "cssProperties": [ "*width", "*height" ], "value": "18.75rem", "originalValue": "18.75rem", "name": "BRAND_BAND_IMAGE_HEIGHT_LARGE" }, "BRAND_BAND_SCRIM_HEIGHT": { "scope": "component", "type": "size", "category": "sizing", "cssProperties": [ "*width", "*height" ], "value": "3.125rem", "originalValue": "3.125rem", "name": "BRAND_BAND_SCRIM_HEIGHT" }, "TEMPLATE_GUTTERS": { "scope": "component", "category": "spacing", "type": "size", "cssProperties": [ "margin*", "padding*" ], "value": "0", "originalValue": "0", "name": "TEMPLATE_GUTTERS" }, "TEMPLATE_PROFILE_GUTTERS": { "scope": "component", "category": "spacing", "type": "size", "cssProperties": [ "margin*", "padding*" ], "value": "0", "originalValue": "0", "name": "TEMPLATE_PROFILE_GUTTERS" }, "BUTTON_ICON_COLOR_BORDER_PRIMARY": { "scope": "component", "type": "color", "category": "border-color", "cssProperties": [ "border*", "box-shadow" ], "value": "#FFFFFF", "originalValue": "{!PALETTE_GRAY_1}", "name": "BUTTON_ICON_COLOR_BORDER_PRIMARY" }, "BUTTON_ICON_BOUNDARY_TOUCH": { "scope": "component", "type": "sizing", "category": "height", "cssProperties": [ "width", "height" ], "value": "2.75rem", "originalValue": "2.75rem", "name": "BUTTON_ICON_BOUNDARY_TOUCH" }, "BUTTON_COLOR_BORDER_PRIMARY": { "scope": "component", "type": "color", "category": "border-color", "cssProperties": [ "border*", "box-shadow" ], "value": "#D8DDE6", "originalValue": "{!GEYSER}", "name": "BUTTON_COLOR_BORDER_PRIMARY" }, "BUTTON_COLOR_BORDER_BRAND_PRIMARY": { "scope": "component", "type": "color", "category": "border-color", "cssProperties": [ "border*", "box-shadow" ], "value": "#0070D2", "deprecated": true, "originalValue": "{!SCIENCE_BLUE}", "name": "BUTTON_COLOR_BORDER_BRAND_PRIMARY" }, "BUTTON_COLOR_BORDER_SECONDARY": { "scope": "component", "type": "color", "category": "border-color", "cssProperties": [ "border*", "box-shadow" ], "value": "rgba(255, 255, 255, 0.80)", "deprecated": true, "originalValue": "{!WHITE_TRANSPARENT_80}", "name": "BUTTON_COLOR_BORDER_SECONDARY" }, "BUTTON_BORDER_RADIUS": { "scope": "component", "type": "size", "category": "radius", "cssProperties": [ "border*radius" ], "value": ".25rem", "originalValue": ".25rem", "name": "BUTTON_BORDER_RADIUS" }, "COLOR_BACKGROUND_BUTTON_DEFAULT_FOCUS": { "originalValue": "{!LINK_WATER}", "access": "global", "name": "COLOR_BACKGROUND_BUTTON_DEFAULT_FOCUS", "value": "#F4F6F9", "scope": "component", "cssProperties": [ "background*", "border*", "box-shadow" ], "type": "color", "category": "background-color", "comment": "Default secondary button - focus state" }, "BUTTON_COLOR_BACKGROUND_BRAND_PRIMARY": { "originalValue": "{!SCIENCE_BLUE}", "name": "BUTTON_COLOR_BACKGROUND_BRAND_PRIMARY", "value": "#0070D2", "deprecated": true, "scope": "component", "cssProperties": [ "background*", "border*", "box-shadow" ], "type": "color", "category": "background-color", "comment": "Use BRAND_ACCESSIBLE to pick up theming capabilities" }, "COLOR_BACKGROUND_BUTTON_INVERSE_DISABLED": { "originalValue": "{!TRANSPARENT}", "access": "global", "name": "COLOR_BACKGROUND_BUTTON_INVERSE_DISABLED", "value": "transparent", "scope": "component", "cssProperties": [ "background*", "border*", "box-shadow" ], "type": "color", "category": "background-color", "comment": "Disabled button backgrounds on inverse/dark backgrounds" }, "COLOR_BACKGROUND_BUTTON_DEFAULT_HOVER": { "originalValue": "{!LINK_WATER}", "access": "global", "name": "COLOR_BACKGROUND_BUTTON_DEFAULT_HOVER", "value": "#F4F6F9", "scope": "component", "cssProperties": [ "background*", "border*", "box-shadow" ], "type": "color", "category": "background-color", "comment": "Default secondary button - hover state" }, "COLOR_BACKGROUND_BUTTON_DEFAULT": { "originalValue": "{!WHITE}", "access": "global", "name": "COLOR_BACKGROUND_BUTTON_DEFAULT", "value": "#FFFFFF", "scope": "component", "cssProperties": [ "background*", "border*", "box-shadow" ], "type": "color", "category": "background-color", "comment": "Default secondary button" }, "COLOR_BACKGROUND_BUTTON_ICON_DISABLED": { "originalValue": "{!WHITE}", "access": "global", "name": "COLOR_BACKGROUND_BUTTON_ICON_DISABLED", "value": "#FFFFFF", "scope": "component", "cssProperties": [ "background*", "border*", "box-shadow" ], "type": "color", "category": "background-color", "comment": "Background color for icon-only button - disabled state" }, "COLOR_BACKGROUND_BUTTON_ICON_FOCUS": { "originalValue": "{!LINK_WATER}", "access": "global", "name": "COLOR_BACKGROUND_BUTTON_ICON_FOCUS", "value": "#F4F6F9", "scope": "component", "cssProperties": [ "background*", "border*", "box-shadow" ], "type": "color", "category": "background-color", "comment": "Background color for icon-only button - focus state" }, "BUTTON_COLOR_BACKGROUND_SECONDARY": { "scope": "component", "type": "color", "category": "background-color", "cssProperties": [ "background*", "border*", "box-shadow" ], "value": "rgba(255, 255, 255, 0.80)", "deprecated": true, "originalValue": "{!WHITE_TRANSPARENT_80}", "name": "BUTTON_COLOR_BACKGROUND_SECONDARY" }, "COLOR_BACKGROUND_BUTTON_BRAND_DISABLED": { "originalValue": "{!STEAM}", "access": "global", "name": "COLOR_BACKGROUND_BUTTON_BRAND_DISABLED", "value": "#E0E5EE", "scope": "component", "cssProperties": [ "background*", "border*", "box-shadow" ], "type": "color", "category": "background-color", "comment": "Brandable primary button - disabled state" }, "COLOR_BACKGROUND_BUTTON_BRAND_HOVER": { "originalValue": "{!ENDEAVOUR}", "access": "global", "name": "COLOR_BACKGROUND_BUTTON_BRAND_HOVER", "value": "#005FB2", "scope": "component", "cssProperties": [ "background*", "border*", "box-shadow" ], "type": "color", "category": "background-color", "comment": "Brandable primary button - hover state" }, "COLOR_BACKGROUND_BUTTON_INVERSE_ACTIVE": { "originalValue": "{!BLACK_TRANSPARENT_24}", "access": "global", "name": "COLOR_BACKGROUND_BUTTON_INVERSE_ACTIVE", "value": "rgba(0, 0, 0, 0.24)", "scope": "component", "cssProperties": [ "background*", "border*", "box-shadow" ], "type": "color", "category": "background-color", "comment": "Active button backgrounds on inverse backgrounds on mobile" }, "COLOR_BACKGROUND_BUTTON_ICON_HOVER": { "originalValue": "{!LINK_WATER}", "access": "global", "name": "COLOR_BACKGROUND_BUTTON_ICON_HOVER", "value": "#F4F6F9", "scope": "component", "cssProperties": [ "background*", "border*", "box-shadow" ], "type": "color", "category": "background-color", "comment": "Background color for icon-only button - hover state" }, "COLOR_BACKGROUND_BUTTON_BRAND": { "originalValue": "{!SCIENCE_BLUE}", "access": "global", "name": "COLOR_BACKGROUND_BUTTON_BRAND", "value": "#0070D2", "scope": "component", "cssProperties": [ "background*", "border*", "box-shadow" ], "type": "color", "category": "background-color", "comment": "Brandable primary button" }, "COLOR_BACKGROUND_BUTTON_ICON": { "originalValue": "{!TRANSPARENT}", "access": "global", "name": "COLOR_BACKGROUND_BUTTON_ICON", "value": "transparent", "scope": "component", "cssProperties": [ "background*", "border*", "box-shadow" ], "type": "color", "category": "background-color", "comment": "Background color for icon-only button" }, "COLOR_BACKGROUND_BUTTON_DEFAULT_DISABLED": { "originalValue": "{!WHITE}", "access": "global", "name": "COLOR_BACKGROUND_BUTTON_DEFAULT_DISABLED", "value": "#FFFFFF", "scope": "component", "cssProperties": [ "background*", "border*", "box-shadow" ], "type": "color", "category": "background-color", "comment": "Default secondary button - disabled state" }, "COLOR_BACKGROUND_BUTTON_ICON_ACTIVE": { "originalValue": "{!WHITE_LILAC}", "access": "global", "name": "COLOR_BACKGROUND_BUTTON_ICON_ACTIVE", "value": "#EEF1F6", "scope": "component", "cssProperties": [ "background*", "border*", "box-shadow" ], "type": "color", "category": "background-color", "comment": "Background color for icon-only button - active state" }, "COLOR_BACKGROUND_BUTTON_BRAND_ACTIVE": { "originalValue": "{!MIDNIGHT_BLUE}", "access": "global", "name": "COLOR_BACKGROUND_BUTTON_BRAND_ACTIVE", "value": "#00396B", "scope": "component", "cssProperties": [ "background*", "border*", "box-shadow" ], "type": "color", "category": "background-color", "comment": "Brandable primary button - active state" }, "COLOR_BACKGROUND_BUTTON_INVERSE": { "originalValue": "{!TRANSPARENT}", "access": "global", "name": "COLOR_BACKGROUND_BUTTON_INVERSE", "value": "transparent", "scope": "component", "cssProperties": [ "background*", "border*", "box-shadow" ], "type": "color", "category": "background-color", "comment": "Button backgrounds on inverse/dark backgrounds" }, "BUTTON_COLOR_BACKGROUND_PRIMARY": { "scope": "component", "type": "color", "category": "background-color", "cssProperties": [ "background*", "border*", "box-shadow" ], "value": "#FFFFFF", "originalValue": "{!WHITE}", "name": "BUTTON_COLOR_BACKGROUND_PRIMARY" }, "COLOR_BACKGROUND_BUTTON_DEFAULT_ACTIVE": { "originalValue": "{!WHITE_LILAC}", "access": "global", "name": "COLOR_BACKGROUND_BUTTON_DEFAULT_ACTIVE", "value": "#EEF1F6", "scope": "component", "cssProperties": [ "background*", "border*", "box-shadow" ], "type": "color", "category": "background-color", "comment": "Default secondary button - active state" }, "LINE_HEIGHT_BUTTON": { "originalValue": "1.875rem", "access": "global", "name": "LINE_HEIGHT_BUTTON", "value": "1.875rem", "scope": "component", "cssProperties": [ "font", "*height", "bottom" ], "type": "number", "category": "line-height", "comment": "Line heights for regular buttons" }, "LINE_HEIGHT_BUTTON_SMALL": { "originalValue": "1.75rem", "access": "global", "name": "LINE_HEIGHT_BUTTON_SMALL", "value": "1.75rem", "scope": "component", "cssProperties": [ "font", "*height" ], "type": "number", "category": "line-height", "comment": "Line heights for small buttons" }, "BUTTON_LINE_HEIGHT_TOUCH": { "originalValue": "2.65rem", "name": "BUTTON_LINE_HEIGHT_TOUCH", "value": "2.65rem", "deprecated": true, "scope": "component", "cssProperties": [ "font", "*height" ], "type": "number", "category": "line-height", "comment": "Line height for touch screens" }, "BUTTON_COLOR_TEXT_PRIMARY": { "scope": "component", "type": "color", "category": "text-color", "cssProperties": [ "color", "fill" ], "value": "#FFFFFF", "originalValue": "{!WHITE}", "name": "BUTTON_COLOR_TEXT_PRIMARY" }, "CARD_COLOR_BACKGROUND": { "scope": "component", "type": "color", "category": "background-color", "cssProperties": [ "background*", "border*", "box-shadow" ], "value": "#FFFFFF", "comment": "Default Card component background color.", "originalValue": "{!PALETTE_GRAY_1}", "name": "CARD_COLOR_BACKGROUND" }, "CARD_COLOR_BORDER": { "scope": "component", "type": "color", "category": "border-color", "cssProperties": [ "border*", "box-shadow" ], "value": "#dddbda", "originalValue": "{!PALETTE_GRAY_5}", "name": "CARD_COLOR_BORDER" }, "CARD_FOOTER_COLOR_BORDER": { "scope": "component", "type": "color", "category": "border-color", "cssProperties": [ "border*", "box-shadow" ], "value": "transparent", "originalValue": "transparent", "name": "CARD_FOOTER_COLOR_BORDER" }, "CARD_SHADOW": { "scope": "component", "type": "box-shadow", "category": "shadow", "cssProperties": [ "box-shadow" ], "value": "none", "originalValue": "none", "name": "CARD_SHADOW" }, "CARD_FONT_WEIGHT": { "scope": "component", "category": "font", "type": "font-weight", "cssProperties": [ "font", "font-weight" ], "value": "400", "comment": "Use for active tab.", "originalValue": "400", "name": "CARD_FONT_WEIGHT" }, "CARD_FOOTER_MARGIN": { "scope": "component", "category": "spacing", "type": "size", "comment": "", "cssProperties": [ "top", "right", "bottom", "left", "margin*", "padding*", "border*", "*width", "*height", "box-shadow" ], "value": "0.75rem", "originalValue": "{!SPACING_SMALL}", "name": "CARD_FOOTER_MARGIN" }, "CARD_BODY_PADDING": { "scope": "component", "category": "spacing", "type": "size", "comment": "", "cssProperties": [ "top", "right", "bottom", "left", "margin*", "padding*", "border*", "*width", "*height", "box-shadow" ], "value": "0 1rem", "originalValue": "0 {!SPACING_MEDIUM}", "name": "CARD_BODY_PADDING" }, "CARD_WRAPPER_SPACING": { "scope": "component", "category": "spacing", "type": "size", "comment": "", "cssProperties": [ "top", "right", "bottom", "left", "margin*", "padding*", "border*", "*width", "*height", "box-shadow" ], "value": "1rem", "originalValue": "{!SPACING_MEDIUM}", "name": "CARD_WRAPPER_SPACING" }, "CARD_HEADER_PADDING": { "scope": "component", "category": "spacing", "type": "size", "comment": "", "cssProperties": [ "top", "right", "bottom", "left", "margin*", "padding*", "border*", "*width", "*height", "box-shadow" ], "value": "0.75rem 1rem 0", "originalValue": "{!SPACING_SMALL} {!SPACING_MEDIUM} 0", "name": "CARD_HEADER_PADDING" }, "CARD_SPACING_LARGE": { "scope": "component", "category": "spacing", "type": "size", "comment": "", "cssProperties": [ "top", "right", "bottom", "left", "margin*", "padding*", "border*", "*width", "*height", "box-shadow" ], "value": "1.5rem", "originalValue": "{!SPACING_LARGE}", "name": "CARD_SPACING_LARGE" }, "CARD_HEADER_MARGIN": { "scope": "component", "category": "spacing", "type": "size", "comment": "", "cssProperties": [ "top", "right", "bottom", "left", "margin*", "padding*", "border*", "*width", "*height", "box-shadow" ], "value": "0 0 0.75rem", "originalValue": "0 0 {!SPACING_SMALL}", "name": "CARD_HEADER_MARGIN" }, "CARD_SPACING_MARGIN": { "scope": "component", "category": "spacing", "type": "size", "comment": "Use for vertical spacing between cards", "cssProperties": [ "top", "right", "bottom", "left", "margin*", "padding*", "border*", "*width", "*height", "box-shadow" ], "value": "1rem", "originalValue": "{!SPACING_MEDIUM}", "name": "CARD_SPACING_MARGIN" }, "CARD_FOOTER_PADDING": { "scope": "component", "category": "spacing", "type": "size", "comment": "", "cssProperties": [ "top", "right", "bottom", "left", "margin*", "padding*", "border*", "*width", "*height", "box-shadow" ], "value": "0 1rem 0.75rem", "originalValue": "0 {!SPACING_MEDIUM} {!SPACING_SMALL}", "name": "CARD_FOOTER_PADDING" }, "CARD_SPACING_SMALL": { "scope": "component", "category": "spacing", "type": "size", "comment": "", "cssProperties": [ "top", "right", "bottom", "left", "margin*", "padding*", "border*", "*width", "*height", "box-shadow" ], "value": "0.75rem", "originalValue": "{!SPACING_SMALL}", "name": "CARD_SPACING_SMALL" }, "CARD_FOOTER_TEXT_ALIGN": { "scope": "component", "category": "text", "type": "text-align", "cssProperties": [ "text-align" ], "value": "right", "originalValue": "right", "name": "CARD_FOOTER_TEXT_ALIGN" }, "CAROUSEL_COLOR_BACKGROUND": { "scope": "component", "type": "color", "category": "background-color", "cssProperties": [ "background*", "border*", "box-shadow" ], "value": "#FFFFFF", "comment": "Default background for carousel card", "originalValue": "{!PALETTE_GRAY_1}", "name": "CAROUSEL_COLOR_BACKGROUND" }, "CAROUSEL_INDICATOR_COLOR_BACKGROUND": { "scope": "component", "type": "color", "category": "background-color", "cssProperties": [ "background*", "border*", "box-shadow" ], "value": "#FFFFFF", "comment": "Default background for carousel navigation indicators", "originalValue": "{!PALETTE_GRAY_1}", "name": "CAROUSEL_INDICATOR_COLOR_BACKGROUND" }, "CAROUSEL_INDICATOR_COLOR_BACKGROUND_HOVER": { "scope": "component", "type": "color", "category": "background-color", "cssProperties": [ "background*", "border*", "box-shadow" ], "value": "#fafaf9", "comment": "Default hover background for carousel navigation indicators", "originalValue": "{!PALETTE_GRAY_2}", "name": "CAROUSEL_INDICATOR_COLOR_BACKGROUND_HOVER" }, "CAROUSEL_INDICATOR_COLOR_BACKGROUND_FOCUS": { "scope": "component", "type": "color", "category": "background-color", "cssProperties": [ "background*", "border*", "box-shadow" ], "value": "#005FB2", "comment": "Default focus background for carousel navigation indicators", "originalValue": "{!ENDEAVOUR}", "name": "CAROUSEL_INDICATOR_COLOR_BACKGROUND_FOCUS" }, "CAROUSEL_INDICATOR_COLOR_BACKGROUND_ACTIVE": { "scope": "component", "type": "color", "category": "background-color", "cssProperties": [ "background*", "border*", "box-shadow" ], "value": "#0070D2", "comment": "Default background for active state on carousel navigation indicators", "originalValue": "{!SCIENCE_BLUE}", "name": "CAROUSEL_INDICATOR_COLOR_BACKGROUND_ACTIVE" }, "CAROUSEL_INDICATOR_WIDTH": { "scope": "component", "type": "size", "category": "sizing", "cssProperties": [ "font", "font-size", "*width", "*height", "flex", "top", "right", "bottom", "left", "margin*", "padding*", "transform" ], "value": "1rem", "comment": "Default width for carousel indicator width", "originalValue": "1rem", "name": "CAROUSEL_INDICATOR_WIDTH" }, "CHAT_MESSAGE_COLOR_BACKGROUND_INBOUND": { "scope": "component", "type": "color", "category": "background-color", "cssProperties": [ "background*", "border*", "box-shadow" ], "value": "#F2F2F3", "comment": "Inbound chat message background color.", "originalValue": "{!PALETTE_COOL_GRAY_3}", "name": "CHAT_MESSAGE_COLOR_BACKGROUND_INBOUND" }, "CHAT_MESSAGE_COLOR_BACKGROUND_OUTBOUND": { "scope": "component", "type": "color", "category": "background-color", "cssProperties": [ "background*", "border*", "box-shadow" ], "value": "#005FB2", "comment": "Outbound chat message background color.", "originalValue": "{!ENDEAVOUR}", "name": "CHAT_MESSAGE_COLOR_BACKGROUND_OUTBOUND" }, "CHAT_MESSAGE_COLOR_BACKGROUND_OUTBOUND_AGENT": { "scope": "component", "type": "color", "category": "background-color", "cssProperties": [ "background*", "border*", "box-shadow" ], "value": "#6B6D70", "comment": "Outbound agent chat message background color.", "originalValue": "{!PALETTE_COOL_GRAY_9}", "name": "CHAT_MESSAGE_COLOR_BACKGROUND_OUTBOUND_AGENT" }, "CHAT_MESSAGE_COLOR_BACKGROUND_STATUS": { "scope": "component", "type": "color", "category": "background-color", "cssProperties": [ "background*", "border*", "box-shadow" ], "value": "#FFFFFF", "comment": "Status chat message background color.", "originalValue": "{!PALETTE_COOL_GRAY_1}", "name": "CHAT_MESSAGE_COLOR_BACKGROUND_STATUS" }, "LINE_HEIGHT_TOGGLE": { "scope": "component", "category": "line-height", "type": "number", "cssProperties": [ "font", "*height" ], "value": "1.3rem", "comment": "Line heights for toggle buttons", "originalValue": "1.3rem", "name": "LINE_HEIGHT_TOGGLE" }, "SQUARE_TOGGLE_SLIDER": { "scope": "component", "type": "size", "category": "sizing", "cssProperties": [ "font", "font-size", "*width", "*height", "flex", "top", "right", "bottom", "left", "margin*", "padding*", "transform" ], "value": "1.25rem", "comment": "Slider size for toggle.", "originalValue": "1.25rem", "name": "SQUARE_TOGGLE_SLIDER" }, "WIDTH_TOGGLE": { "scope": "component", "type": "size", "category": "sizing", "cssProperties": [ "font", "font-size", "*width", "*height", "flex", "top", "right", "bottom", "left", "margin*", "padding*", "transform" ], "value": "3rem", "comment": "Slider width.", "originalValue": "3rem", "name": "WIDTH_TOGGLE" }, "HEIGHT_TOGGLE": { "scope": "component", "type": "size", "category": "sizing", "cssProperties": [ "font", "font-size", "*width", "*height", "flex", "top", "right", "bottom", "left", "margin*", "padding*", "transform" ], "value": "1.5rem", "comment": "Slider height.", "originalValue": "1.5rem", "name": "HEIGHT_TOGGLE" }, "COLOR_PICKER_SLIDER_THUMB_COLOR_BACKGROUND": { "scope": "component", "type": "color", "category": "background-color", "cssProperties": [ "background*" ], "value": "#fafaf9", "originalValue": "{!PALETTE_GRAY_2}", "name": "COLOR_PICKER_SLIDER_THUMB_COLOR_BACKGROUND" }, "COLOR_PICKER_SLIDER_THUMB_BORDER_COLOR": { "scope": "component", "type": "color", "category": "border-color", "cssProperties": [ "border*" ], "value": "#514f4d", "originalValue": "{!PALETTE_GRAY_10}", "name": "COLOR_PICKER_SLIDER_THUMB_BORDER_COLOR" }, "COLOR_PICKER_SWATCH_SHADOW": { "scope": "component", "type": "box-shadow", "category": "shadow", "cssProperties": [ "box-shadow" ], "value": "inset 0 0 1px rgba(0,0,0,0.4)", "originalValue": "inset 0 0 1px rgba(0,0,0,0.4)", "name": "COLOR_PICKER_SWATCH_SHADOW" }, "COLOR_PICKER_INPUT_CUSTOM_HEX_FONT_SIZE": { "scope": "component", "category": "font-size", "type": "font-size", "cssProperties": [ "font", "font-size" ], "value": "0.75rem", "originalValue": "0.75rem", "name": "COLOR_PICKER_INPUT_CUSTOM_HEX_FONT_SIZE" }, "COLOR_PICKER_SELECTOR_WIDTH": { "scope": "component", "category": "sizing", "type": "size", "cssProperties": [ "*height", "*width" ], "value": "14rem", "originalValue": "14rem", "name": "COLOR_PICKER_SELECTOR_WIDTH" }, "COLOR_PICKER_SWATCHES_WIDTH": { "scope": "component", "category": "sizing", "type": "size", "cssProperties": [ "*height", "*width" ], "value": "13.3rem", "originalValue": "13.3rem", "name": "COLOR_PICKER_SWATCHES_WIDTH" }, "COLOR_PICKER_RANGE_HEIGHT": { "scope": "component", "category": "sizing", "type": "size", "cssProperties": [ "*height", "*width" ], "value": "5rem", "originalValue": "5rem", "name": "COLOR_PICKER_RANGE_HEIGHT" }, "COLOR_PICKER_SLIDER_HEIGHT": { "scope": "component", "category": "sizing", "type": "size", "cssProperties": [ "*height", "*width" ], "value": "1.5rem", "originalValue": "1.5rem", "name": "COLOR_PICKER_SLIDER_HEIGHT" }, "COLOR_PICKER_THUMB_WIDTH": { "scope": "component", "category": "sizing", "type": "size", "cssProperties": [ "*height", "*width" ], "value": "0.375rem", "originalValue": "0.375rem", "name": "COLOR_PICKER_THUMB_WIDTH" }, "COLOR_PICKER_RANGE_INDICATOR_SIZE": { "scope": "component", "category": "sizing", "type": "size", "cssProperties": [ "*height", "*width" ], "value": "0.75rem", "originalValue": "0.75rem", "name": "COLOR_PICKER_RANGE_INDICATOR_SIZE" }, "COLOR_PICKER_INPUT_CUSTOM_HEX_WIDTH": { "scope": "component", "category": "sizing", "type": "size", "cssProperties": [ "*height", "*width" ], "value": "4.2rem", "originalValue": "4.2rem", "name": "COLOR_PICKER_INPUT_CUSTOM_HEX_WIDTH" }, "COLOR_PICKER_SWATCH_SIZE": { "scope": "component", "category": "sizing", "type": "size", "cssProperties": [ "*height", "*width" ], "value": "1.25rem", "originalValue": "1.25rem", "name": "COLOR_PICKER_SWATCH_SIZE" }, "TABLE_COLOR_BACKGROUND_STRIPES": { "scope": "component", "type": "color", "category": "background-color", "cssProperties": [ "background*", "border*", "box-shadow" ], "value": "#fafaf9", "comment": "Alternating row background color for tables", "originalValue": "{!PALETTE_GRAY_2}", "name": "TABLE_COLOR_BACKGROUND_STRIPES" }, "TABLE_COLOR_BACKGROUND_HEADER": { "scope": "component", "type": "color", "category": "background-color", "cssProperties": [ "background*", "border*", "box-shadow" ], "value": "#FFFFFF", "comment": "Default background color for table headers", "originalValue": "{!PALETTE_GRAY_1}", "name": "TABLE_COLOR_BACKGROUND_HEADER" }, "TABLE_COLOR_BACKGROUND_HEADER_HOVER": { "scope": "component", "type": "color", "category": "background-color", "cssProperties": [ "background*", "border*", "box-shadow" ], "value": "#fafaf9", "comment": "Hover state for table header cells", "originalValue": "{!PALETTE_GRAY_2}", "name": "TABLE_COLOR_BACKGROUND_HEADER_HOVER" }, "TABLE_COLOR_BACKGROUND_HEADER_FOCUS": { "scope": "component", "type": "color", "category": "background-color", "cssProperties": [ "background*", "border*", "box-shadow" ], "value": "#FFFFFF", "comment": "Focused state for table header cells", "originalValue": "{!PALETTE_GRAY_1}", "name": "TABLE_COLOR_BACKGROUND_HEADER_FOCUS" }, "TABLE_COLOR_BACKGROUND_HEADER_RESIZABLE_HANDLE": { "scope": "component", "type": "color", "category": "background-color", "cssProperties": [ "background*", "border*", "box-shadow" ], "value": "#b0adab", "comment": "Resizable handle color for table header cells", "originalValue": "{!PALETTE_GRAY_7}", "name": "TABLE_COLOR_BACKGROUND_HEADER_RESIZABLE_HANDLE" }, "TABLE_BORDER_RADIUS": { "scope": "component", "type": "size", "category": "radius", "cssProperties": [ "border*radius" ], "value": "0", "originalValue": "0", "name": "TABLE_BORDER_RADIUS" }, "TABLE_CELL_SPACING": { "scope": "component", "category": "spacing", "type": "size", "comment": "", "cssProperties": [ "top", "right", "bottom", "left", "margin*", "padding*", "border*", "*width", "*height", "box-shadow" ], "value": "0.5rem", "originalValue": "{!SPACING_X_SMALL}", "name": "TABLE_CELL_SPACING" }, "TABLE_COLOR_TEXT_HEADER": { "scope": "component", "type": "color", "category": "text-color", "cssProperties": [ "color", "fill" ], "value": "#514f4d", "originalValue": "{!PALETTE_GRAY_10}", "name": "TABLE_COLOR_TEXT_HEADER" }, "DATEPICKER_COLOR_TEXT_DAY_ADJACENT_MONTH": { "scope": "component", "type": "color", "category": "text-color", "cssProperties": [ "color" ], "value": "#706e6b", "originalValue": "{!PALETTE_GRAY_9}", "name": "DATEPICKER_COLOR_TEXT_DAY_ADJACENT_MONTH" }, "COLOR_BACKGROUND_DOCKED_PANEL_HEADER": { "scope": "component", "type": "color", "category": "background-color", "cssProperties": [ "background*", "border*", "box-shadow" ], "value": "#FFFFFF", "comment": "Docked panel header’s background color.", "originalValue": "{!PALETTE_GRAY_1}", "name": "COLOR_BACKGROUND_DOCKED_PANEL_HEADER" }, "COLOR_BACKGROUND_DOCKED_PANEL": { "scope": "component", "type": "color", "category": "background-color", "cssProperties": [ "background*", "border*", "box-shadow" ], "value": "#FFFFFF", "comment": "Docked panel’s background color when open.", "originalValue": "{!PALETTE_GRAY_1}", "name": "COLOR_BACKGROUND_DOCKED_PANEL" }, "HEIGHT_DOCKED_BAR": { "scope": "component", "type": "size", "category": "sizing", "cssProperties": [ "font", "font-size", "*width", "*height", "flex", "top", "right", "bottom", "left", "margin*", "padding*", "transform" ], "value": "2.5rem", "comment": "Height of the docked bar.", "originalValue": "2.5rem", "name": "HEIGHT_DOCKED_BAR" }, "UTILITY_BAR_COLOR_BACKGROUND_NOTIFICATION_BADGE": { "scope": "component", "type": "color", "category": "background-color", "cssProperties": [ "background*", "border*", "box-shadow" ], "value": "#D4504C", "comment": "Utility bar notifications badge background color.", "originalValue": "{!VALENCIA}", "name": "UTILITY_BAR_COLOR_BACKGROUND_NOTIFICATION_BADGE" }, "UTILITY