@gitlab/ui 103.0.0 → 103.1.0

package/dist/tokens/build/js/tokens.dark.js

@@ -165,7 +165,7 @@ const GL_COLOR_PURPLE_950 = '#232150';
 const GL_COLOR_RED_50 = '#fcf1ef';
 const GL_COLOR_RED_100 = '#fdd4cd';
 const GL_COLOR_RED_200 = '#fcb5aa';
-const GL_COLOR_RED_300 = '#f57f6c';
+const GL_COLOR_RED_300 = '#f6806d';
 const GL_COLOR_RED_400 = '#ec5941';
 const GL_COLOR_RED_500 = '#dd2b0e';
 const GL_COLOR_RED_600 = '#c91c00';
@@ -331,7 +331,7 @@ const GL_ALERT_WARNING_TITLE_COLOR = '#d99530';
 const GL_ALERT_WARNING_BACKGROUND_COLOR = '#28272d';
 const GL_ALERT_WARNING_BORDER_TOP_COLOR = '#c17d10';
 const GL_ALERT_WARNING_BORDER_BOTTOM_COLOR = 'transparent';
-const GL_ALERT_DANGER_TITLE_COLOR = '#f57f6c';
+const GL_ALERT_DANGER_TITLE_COLOR = '#f6806d';
 const GL_ALERT_DANGER_BACKGROUND_COLOR = '#28272d';
 const GL_ALERT_DANGER_BORDER_TOP_COLOR = '#ec5941';
 const GL_ALERT_DANGER_BORDER_BOTTOM_COLOR = 'transparent';
@@ -429,9 +429,9 @@ const GL_BADGE_WARNING_ICON_COLOR_DEFAULT = '#421f00';
 const GL_BADGE_WARNING_ICON_COLOR_HOVER = '#421f00';
 const GL_BADGE_WARNING_ICON_COLOR_FOCUS = '#421f00';
 const GL_BADGE_WARNING_ICON_COLOR_ACTIVE = '#421f00';
-const GL_BADGE_DANGER_BACKGROUND_COLOR_DEFAULT = '#f57f6c';
-const GL_BADGE_DANGER_BACKGROUND_COLOR_HOVER = '#f57f6c';
-const GL_BADGE_DANGER_BACKGROUND_COLOR_FOCUS = '#f57f6c';
+const GL_BADGE_DANGER_BACKGROUND_COLOR_DEFAULT = '#f6806d';
+const GL_BADGE_DANGER_BACKGROUND_COLOR_HOVER = '#f6806d';
+const GL_BADGE_DANGER_BACKGROUND_COLOR_FOCUS = '#f6806d';
 const GL_BADGE_DANGER_BACKGROUND_COLOR_ACTIVE = '#fcb5aa';
 const GL_BADGE_DANGER_BORDER_COLOR_DEFAULT = 'transparent';
 const GL_BADGE_DANGER_BORDER_COLOR_HOVER = '#fcb5aa';
@@ -569,7 +569,7 @@ const GL_BUTTON_DANGER_PRIMARY_FOREGROUND_COLOR_DEFAULT = '#18171d';
 const GL_BUTTON_DANGER_PRIMARY_FOREGROUND_COLOR_HOVER = '#18171d';
 const GL_BUTTON_DANGER_PRIMARY_FOREGROUND_COLOR_FOCUS = '#18171d';
 const GL_BUTTON_DANGER_PRIMARY_FOREGROUND_COLOR_ACTIVE = '#18171d';
-const GL_BUTTON_DANGER_PRIMARY_BACKGROUND_COLOR_DEFAULT = '#f57f6c';
+const GL_BUTTON_DANGER_PRIMARY_BACKGROUND_COLOR_DEFAULT = '#f6806d';
 const GL_BUTTON_DANGER_PRIMARY_BACKGROUND_COLOR_HOVER = '#fcb5aa';
 const GL_BUTTON_DANGER_PRIMARY_BACKGROUND_COLOR_FOCUS = '#fcb5aa';
 const GL_BUTTON_DANGER_PRIMARY_BACKGROUND_COLOR_ACTIVE = '#ec5941';
@@ -704,11 +704,11 @@ const GL_CONTROL_BORDER_COLOR_DEFAULT = '#737278';
 const GL_CONTROL_BORDER_COLOR_HOVER = '#a4a3a8';
 const GL_CONTROL_BORDER_COLOR_FOCUS = '#ececef';
 const GL_CONTROL_BORDER_COLOR_DISABLED = '#3a383f';
-const GL_CONTROL_BORDER_COLOR_ERROR = '#f57f6c';
+const GL_CONTROL_BORDER_COLOR_ERROR = '#f6806d';
 const GL_CONTROL_BORDER_COLOR_SELECTED_DEFAULT = '#428fdc';
 const GL_CONTROL_BORDER_COLOR_SELECTED_HOVER = '#9dc7f1';
 const GL_CONTROL_BORDER_COLOR_SELECTED_FOCUS = '#9dc7f1';
-const GL_CONTROL_TEXT_COLOR_ERROR = '#f57f6c';
+const GL_CONTROL_TEXT_COLOR_ERROR = '#f6806d';
 const GL_CONTROL_TEXT_COLOR_VALID = '#52b87a';
 const GL_CONTROL_PLACEHOLDER_COLOR = '#89888d';
 const GL_CONTROL_INDICATOR_COLOR_SELECTED = '#18171d';
@@ -896,7 +896,7 @@ const GL_FEEDBACK_WARNING_TEXT_COLOR = '#e9be74';
 const GL_FEEDBACK_WARNING_ICON_COLOR = '#d99530';
 const GL_FEEDBACK_DANGER_BACKGROUND_COLOR = '#660e00';
 const GL_FEEDBACK_DANGER_TEXT_COLOR = '#fcb5aa';
-const GL_FEEDBACK_DANGER_ICON_COLOR = '#f57f6c';
+const GL_FEEDBACK_DANGER_ICON_COLOR = '#f6806d';
 const GL_FOCUS_RING_OUTER_COLOR = '#428fdc';
 const GL_FOCUS_RING_INNER_COLOR = '#18171d';
 const GL_ICON_COLOR_DEFAULT = '#dcdcde';
@@ -906,7 +906,7 @@ const GL_ICON_COLOR_DISABLED = '#737278';
 const GL_ICON_COLOR_LINK = '#63a6e9';
 const GL_ICON_COLOR_INFO = '#63a6e9';
 const GL_ICON_COLOR_WARNING = '#d99530';
-const GL_ICON_COLOR_DANGER = '#f57f6c';
+const GL_ICON_COLOR_DANGER = '#f6806d';
 const GL_ICON_COLOR_SUCCESS = '#52b87a';
 const GL_LINE_HEIGHT_12 = '0.75rem';
 const GL_LINE_HEIGHT_16 = '1rem';
@@ -946,7 +946,7 @@ const GL_TEXT_COLOR_STRONG = '#fff';
 const GL_TEXT_COLOR_HEADING = '#fff';
 const GL_TEXT_COLOR_LINK = '#9dc7f1';
 const GL_TEXT_COLOR_WARNING = '#d99530';
-const GL_TEXT_COLOR_DANGER = '#f57f6c';
+const GL_TEXT_COLOR_DANGER = '#f6806d';
 const GL_TEXT_COLOR_SUCCESS = '#52b87a';
 const GL_TEXT_COLOR_DISABLED = '#89888d';
 

package/dist/tokens/build/js/tokens.js

@@ -165,7 +165,7 @@ const GL_COLOR_PURPLE_950 = '#232150';
 const GL_COLOR_RED_50 = '#fcf1ef';
 const GL_COLOR_RED_100 = '#fdd4cd';
 const GL_COLOR_RED_200 = '#fcb5aa';
-const GL_COLOR_RED_300 = '#f57f6c';
+const GL_COLOR_RED_300 = '#f6806d';
 const GL_COLOR_RED_400 = '#ec5941';
 const GL_COLOR_RED_500 = '#dd2b0e';
 const GL_COLOR_RED_600 = '#c91c00';

package/dist/tokens/css/tokens.css

@@ -88,7 +88,7 @@
   --gl-color-red-50: #fcf1ef;
   --gl-color-red-100: #fdd4cd;
   --gl-color-red-200: #fcb5aa;
-  --gl-color-red-300: #f57f6c;
+  --gl-color-red-300: #f6806d;
   --gl-color-red-400: #ec5941;
   --gl-color-red-500: #dd2b0e;
   --gl-color-red-600: #c91c00;

package/dist/tokens/css/tokens.dark.css

@@ -88,7 +88,7 @@
   --gl-color-red-50: #fcf1ef;
   --gl-color-red-100: #fdd4cd;
   --gl-color-red-200: #fcb5aa;
-  --gl-color-red-300: #f57f6c;
+  --gl-color-red-300: #f6806d;
   --gl-color-red-400: #ec5941;
   --gl-color-red-500: #dd2b0e;
   --gl-color-red-600: #c91c00;

package/dist/tokens/js/tokens.dark.js

@@ -165,7 +165,7 @@ export const GL_COLOR_PURPLE_950 = '#232150';
 export const GL_COLOR_RED_50 = '#fcf1ef';
 export const GL_COLOR_RED_100 = '#fdd4cd';
 export const GL_COLOR_RED_200 = '#fcb5aa';
-export const GL_COLOR_RED_300 = '#f57f6c';
+export const GL_COLOR_RED_300 = '#f6806d';
 export const GL_COLOR_RED_400 = '#ec5941';
 export const GL_COLOR_RED_500 = '#dd2b0e';
 export const GL_COLOR_RED_600 = '#c91c00';
@@ -331,7 +331,7 @@ export const GL_ALERT_WARNING_TITLE_COLOR = '#d99530';
 export const GL_ALERT_WARNING_BACKGROUND_COLOR = '#28272d';
 export const GL_ALERT_WARNING_BORDER_TOP_COLOR = '#c17d10';
 export const GL_ALERT_WARNING_BORDER_BOTTOM_COLOR = 'transparent';
-export const GL_ALERT_DANGER_TITLE_COLOR = '#f57f6c';
+export const GL_ALERT_DANGER_TITLE_COLOR = '#f6806d';
 export const GL_ALERT_DANGER_BACKGROUND_COLOR = '#28272d';
 export const GL_ALERT_DANGER_BORDER_TOP_COLOR = '#ec5941';
 export const GL_ALERT_DANGER_BORDER_BOTTOM_COLOR = 'transparent';
@@ -429,9 +429,9 @@ export const GL_BADGE_WARNING_ICON_COLOR_DEFAULT = '#421f00';
 export const GL_BADGE_WARNING_ICON_COLOR_HOVER = '#421f00';
 export const GL_BADGE_WARNING_ICON_COLOR_FOCUS = '#421f00';
 export const GL_BADGE_WARNING_ICON_COLOR_ACTIVE = '#421f00';
-export const GL_BADGE_DANGER_BACKGROUND_COLOR_DEFAULT = '#f57f6c';
-export const GL_BADGE_DANGER_BACKGROUND_COLOR_HOVER = '#f57f6c';
-export const GL_BADGE_DANGER_BACKGROUND_COLOR_FOCUS = '#f57f6c';
+export const GL_BADGE_DANGER_BACKGROUND_COLOR_DEFAULT = '#f6806d';
+export const GL_BADGE_DANGER_BACKGROUND_COLOR_HOVER = '#f6806d';
+export const GL_BADGE_DANGER_BACKGROUND_COLOR_FOCUS = '#f6806d';
 export const GL_BADGE_DANGER_BACKGROUND_COLOR_ACTIVE = '#fcb5aa';
 export const GL_BADGE_DANGER_BORDER_COLOR_DEFAULT = 'transparent';
 export const GL_BADGE_DANGER_BORDER_COLOR_HOVER = '#fcb5aa';
@@ -569,7 +569,7 @@ export const GL_BUTTON_DANGER_PRIMARY_FOREGROUND_COLOR_DEFAULT = '#18171d';
 export const GL_BUTTON_DANGER_PRIMARY_FOREGROUND_COLOR_HOVER = '#18171d';
 export const GL_BUTTON_DANGER_PRIMARY_FOREGROUND_COLOR_FOCUS = '#18171d';
 export const GL_BUTTON_DANGER_PRIMARY_FOREGROUND_COLOR_ACTIVE = '#18171d';
-export const GL_BUTTON_DANGER_PRIMARY_BACKGROUND_COLOR_DEFAULT = '#f57f6c';
+export const GL_BUTTON_DANGER_PRIMARY_BACKGROUND_COLOR_DEFAULT = '#f6806d';
 export const GL_BUTTON_DANGER_PRIMARY_BACKGROUND_COLOR_HOVER = '#fcb5aa';
 export const GL_BUTTON_DANGER_PRIMARY_BACKGROUND_COLOR_FOCUS = '#fcb5aa';
 export const GL_BUTTON_DANGER_PRIMARY_BACKGROUND_COLOR_ACTIVE = '#ec5941';
@@ -704,11 +704,11 @@ export const GL_CONTROL_BORDER_COLOR_DEFAULT = '#737278';
 export const GL_CONTROL_BORDER_COLOR_HOVER = '#a4a3a8';
 export const GL_CONTROL_BORDER_COLOR_FOCUS = '#ececef';
 export const GL_CONTROL_BORDER_COLOR_DISABLED = '#3a383f';
-export const GL_CONTROL_BORDER_COLOR_ERROR = '#f57f6c';
+export const GL_CONTROL_BORDER_COLOR_ERROR = '#f6806d';
 export const GL_CONTROL_BORDER_COLOR_SELECTED_DEFAULT = '#428fdc';
 export const GL_CONTROL_BORDER_COLOR_SELECTED_HOVER = '#9dc7f1';
 export const GL_CONTROL_BORDER_COLOR_SELECTED_FOCUS = '#9dc7f1';
-export const GL_CONTROL_TEXT_COLOR_ERROR = '#f57f6c';
+export const GL_CONTROL_TEXT_COLOR_ERROR = '#f6806d';
 export const GL_CONTROL_TEXT_COLOR_VALID = '#52b87a';
 export const GL_CONTROL_PLACEHOLDER_COLOR = '#89888d';
 export const GL_CONTROL_INDICATOR_COLOR_SELECTED = '#18171d';
@@ -896,7 +896,7 @@ export const GL_FEEDBACK_WARNING_TEXT_COLOR = '#e9be74';
 export const GL_FEEDBACK_WARNING_ICON_COLOR = '#d99530';
 export const GL_FEEDBACK_DANGER_BACKGROUND_COLOR = '#660e00';
 export const GL_FEEDBACK_DANGER_TEXT_COLOR = '#fcb5aa';
-export const GL_FEEDBACK_DANGER_ICON_COLOR = '#f57f6c';
+export const GL_FEEDBACK_DANGER_ICON_COLOR = '#f6806d';
 export const GL_FOCUS_RING_OUTER_COLOR = '#428fdc';
 export const GL_FOCUS_RING_INNER_COLOR = '#18171d';
 export const GL_ICON_COLOR_DEFAULT = '#dcdcde';
@@ -906,7 +906,7 @@ export const GL_ICON_COLOR_DISABLED = '#737278';
 export const GL_ICON_COLOR_LINK = '#63a6e9';
 export const GL_ICON_COLOR_INFO = '#63a6e9';
 export const GL_ICON_COLOR_WARNING = '#d99530';
-export const GL_ICON_COLOR_DANGER = '#f57f6c';
+export const GL_ICON_COLOR_DANGER = '#f6806d';
 export const GL_ICON_COLOR_SUCCESS = '#52b87a';
 export const GL_LINE_HEIGHT_12 = '0.75rem';
 export const GL_LINE_HEIGHT_16 = '1rem';
@@ -946,6 +946,6 @@ export const GL_TEXT_COLOR_STRONG = '#fff';
 export const GL_TEXT_COLOR_HEADING = '#fff';
 export const GL_TEXT_COLOR_LINK = '#9dc7f1';
 export const GL_TEXT_COLOR_WARNING = '#d99530';
-export const GL_TEXT_COLOR_DANGER = '#f57f6c';
+export const GL_TEXT_COLOR_DANGER = '#f6806d';
 export const GL_TEXT_COLOR_SUCCESS = '#52b87a';
 export const GL_TEXT_COLOR_DISABLED = '#89888d';

package/dist/tokens/js/tokens.js

@@ -165,7 +165,7 @@ export const GL_COLOR_PURPLE_950 = '#232150';
 export const GL_COLOR_RED_50 = '#fcf1ef';
 export const GL_COLOR_RED_100 = '#fdd4cd';
 export const GL_COLOR_RED_200 = '#fcb5aa';
-export const GL_COLOR_RED_300 = '#f57f6c';
+export const GL_COLOR_RED_300 = '#f6806d';
 export const GL_COLOR_RED_400 = '#ec5941';
 export const GL_COLOR_RED_500 = '#dd2b0e';
 export const GL_COLOR_RED_600 = '#c91c00';

package/dist/tokens/json/tokens.dark.json

@@ -3387,12 +3387,12 @@
         ]
       },
       "300": {
-        "$value": "#f57f6c",
+        "$value": "#f6806d",
         "$type": "color",
         "filePath": "src/tokens/color.constant.tokens.json",
         "isSource": true,
         "original": {
-          "$value": "#f57f6c",
+          "$value": "#f6806d",
           "$type": "color"
         },
         "name": "COLOR_RED_300",
@@ -6769,7 +6769,7 @@
     "danger": {
       "title": {
         "color": {
-          "$value": "#f57f6c",
+          "$value": "#f6806d",
           "$type": "color",
           "$description": "Used for the title color of a danger alert.",
           "filePath": "src/tokens/contextual/alert.tokens.json",
@@ -9112,7 +9112,7 @@
       "background": {
         "color": {
           "default": {
-            "$value": "#f57f6c",
+            "$value": "#f6806d",
             "$type": "color",
             "$description": "Used for the background of a danger badge when static or the default state when linked.",
             "filePath": "src/tokens/contextual/badge.tokens.json",
@@ -9136,7 +9136,7 @@
             ]
           },
           "hover": {
-            "$value": "#f57f6c",
+            "$value": "#f6806d",
             "$type": "color",
             "$description": "Used for the background of a danger badge in the hover state.",
             "filePath": "src/tokens/contextual/badge.tokens.json",
@@ -9157,7 +9157,7 @@
             ]
           },
           "focus": {
-            "$value": "#f57f6c",
+            "$value": "#f6806d",
             "$type": "color",
             "$description": "Used for the background of a danger badge in the focus state.",
             "filePath": "src/tokens/contextual/badge.tokens.json",
@@ -12390,7 +12390,7 @@
         "background": {
           "color": {
             "default": {
-              "$value": "#f57f6c",
+              "$value": "#f6806d",
               "$type": "color",
               "$description": "Used for the background of a danger (destructive) primary button in the default state.",
               "filePath": "src/tokens/contextual/button.tokens.json",
@@ -15712,7 +15712,7 @@
           ]
         },
         "error": {
-          "$value": "#f57f6c",
+          "$value": "#f6806d",
           "$type": "color",
           "$description": "Used for invalid form control (input, textarea) border.",
           "filePath": "src/tokens/control.tokens.json",
@@ -15813,7 +15813,7 @@
     "text": {
       "color": {
         "error": {
-          "$value": "#f57f6c",
+          "$value": "#f6806d",
           "$type": "color",
           "$description": "Used for the helper text when the input is invalid.",
           "filePath": "src/tokens/control.tokens.json",
@@ -20597,7 +20597,7 @@
       },
       "icon": {
         "color": {
-          "$value": "#f57f6c",
+          "$value": "#f6806d",
           "$type": "color",
           "$description": "Used for the icon of a danger feedback item when notifying about a critical issue that has just occurred and requires immediate attention.",
           "filePath": "src/tokens/feedback.tokens.json",
@@ -20826,7 +20826,7 @@
         ]
       },
       "danger": {
-        "$value": "#f57f6c",
+        "$value": "#f6806d",
         "$type": "color",
         "$description": "Used for an icon associated with an error or danger.",
         "filePath": "src/tokens/icon.tokens.json",
@@ -21777,7 +21777,7 @@
         ]
       },
       "danger": {
-        "$value": "#f57f6c",
+        "$value": "#f6806d",
         "$type": "color",
         "$description": "Used for text indicating a problem, critical state, destructive action, error, failure, removal, stop, or declination.",
         "filePath": "src/tokens/text.tokens.json",

package/dist/tokens/json/tokens.json

@@ -3387,12 +3387,12 @@
         ]
       },
       "300": {
-        "$value": "#f57f6c",
+        "$value": "#f6806d",
         "$type": "color",
         "filePath": "src/tokens/color.constant.tokens.json",
         "isSource": true,
         "original": {
-          "$value": "#f57f6c",
+          "$value": "#f6806d",
           "$type": "color"
         },
         "name": "COLOR_RED_300",

package/dist/tokens/scss/_tokens.dark.scss

@@ -86,7 +86,7 @@ $gl-color-purple-950: #232150;
 $gl-color-red-50: #fcf1ef;
 $gl-color-red-100: #fdd4cd;
 $gl-color-red-200: #fcb5aa;
-$gl-color-red-300: #f57f6c;
+$gl-color-red-300: #f6806d;
 $gl-color-red-400: #ec5941;
 $gl-color-red-500: #dd2b0e;
 $gl-color-red-600: #c91c00;

package/dist/tokens/scss/_tokens.scss

@@ -86,7 +86,7 @@ $gl-color-purple-950: #232150;
 $gl-color-red-50: #fcf1ef;
 $gl-color-red-100: #fdd4cd;
 $gl-color-red-200: #fcb5aa;
-$gl-color-red-300: #f57f6c;
+$gl-color-red-300: #f6806d;
 $gl-color-red-400: #ec5941;
 $gl-color-red-500: #dd2b0e;
 $gl-color-red-600: #c91c00;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@gitlab/ui",
-  "version": "103.0.0",
+  "version": "103.1.0",
   "description": "GitLab UI Components",
   "license": "MIT",
   "main": "dist/index.js",

package/src/components/base/table/table.scss

@@ -63,7 +63,6 @@ table.gl-table {
 
   caption {
     @apply gl-pt-2;
-    color: var(--gl-text-color-subtle);
   }
 
   @mixin gl-tmp-stacked-override {

package/src/components/regions/empty_state/empty_state.vue

@@ -148,7 +148,11 @@ export default {
           {{ title }}
         </h1>
       </slot>
-      <p v-if="description || $scopedSlots.description" ref="description" class="gl-mb-0 gl-mt-4">
+      <p
+        v-if="description || $scopedSlots.description"
+        ref="description"
+        class="gl-mb-0 gl-mt-4 gl-text-subtle"
+      >
         <!--
           @slot Use this slot to customize the empty state's description
           area. Overrides the `description` prop.

package/src/scss/typography.scss

@@ -2,3 +2,7 @@ h1, h2, h3, h4, h5, h6,
 .h1, .h2, .h3, .h4, .h5, .h6 {
   @apply gl-text-heading;
 }
+
+caption {
+  @apply gl-text-subtle;
+}

package/src/tokens/build/css/tokens.css

@@ -88,7 +88,7 @@
   --gl-color-red-50: #fcf1ef;
   --gl-color-red-100: #fdd4cd;
   --gl-color-red-200: #fcb5aa;
-  --gl-color-red-300: #f57f6c;
+  --gl-color-red-300: #f6806d;
   --gl-color-red-400: #ec5941;
   --gl-color-red-500: #dd2b0e;
   --gl-color-red-600: #c91c00;

package/src/tokens/build/css/tokens.dark.css

@@ -88,7 +88,7 @@
   --gl-color-red-50: #fcf1ef;
   --gl-color-red-100: #fdd4cd;
   --gl-color-red-200: #fcb5aa;
-  --gl-color-red-300: #f57f6c;
+  --gl-color-red-300: #f6806d;
   --gl-color-red-400: #ec5941;
   --gl-color-red-500: #dd2b0e;
   --gl-color-red-600: #c91c00;

package/src/tokens/build/js/tokens.dark.js

@@ -165,7 +165,7 @@ export const GL_COLOR_PURPLE_950 = '#232150';
 export const GL_COLOR_RED_50 = '#fcf1ef';
 export const GL_COLOR_RED_100 = '#fdd4cd';
 export const GL_COLOR_RED_200 = '#fcb5aa';
-export const GL_COLOR_RED_300 = '#f57f6c';
+export const GL_COLOR_RED_300 = '#f6806d';
 export const GL_COLOR_RED_400 = '#ec5941';
 export const GL_COLOR_RED_500 = '#dd2b0e';
 export const GL_COLOR_RED_600 = '#c91c00';
@@ -331,7 +331,7 @@ export const GL_ALERT_WARNING_TITLE_COLOR = '#d99530';
 export const GL_ALERT_WARNING_BACKGROUND_COLOR = '#28272d';
 export const GL_ALERT_WARNING_BORDER_TOP_COLOR = '#c17d10';
 export const GL_ALERT_WARNING_BORDER_BOTTOM_COLOR = 'transparent';
-export const GL_ALERT_DANGER_TITLE_COLOR = '#f57f6c';
+export const GL_ALERT_DANGER_TITLE_COLOR = '#f6806d';
 export const GL_ALERT_DANGER_BACKGROUND_COLOR = '#28272d';
 export const GL_ALERT_DANGER_BORDER_TOP_COLOR = '#ec5941';
 export const GL_ALERT_DANGER_BORDER_BOTTOM_COLOR = 'transparent';
@@ -429,9 +429,9 @@ export const GL_BADGE_WARNING_ICON_COLOR_DEFAULT = '#421f00';
 export const GL_BADGE_WARNING_ICON_COLOR_HOVER = '#421f00';
 export const GL_BADGE_WARNING_ICON_COLOR_FOCUS = '#421f00';
 export const GL_BADGE_WARNING_ICON_COLOR_ACTIVE = '#421f00';
-export const GL_BADGE_DANGER_BACKGROUND_COLOR_DEFAULT = '#f57f6c';
-export const GL_BADGE_DANGER_BACKGROUND_COLOR_HOVER = '#f57f6c';
-export const GL_BADGE_DANGER_BACKGROUND_COLOR_FOCUS = '#f57f6c';
+export const GL_BADGE_DANGER_BACKGROUND_COLOR_DEFAULT = '#f6806d';
+export const GL_BADGE_DANGER_BACKGROUND_COLOR_HOVER = '#f6806d';
+export const GL_BADGE_DANGER_BACKGROUND_COLOR_FOCUS = '#f6806d';
 export const GL_BADGE_DANGER_BACKGROUND_COLOR_ACTIVE = '#fcb5aa';
 export const GL_BADGE_DANGER_BORDER_COLOR_DEFAULT = 'transparent';
 export const GL_BADGE_DANGER_BORDER_COLOR_HOVER = '#fcb5aa';
@@ -569,7 +569,7 @@ export const GL_BUTTON_DANGER_PRIMARY_FOREGROUND_COLOR_DEFAULT = '#18171d';
 export const GL_BUTTON_DANGER_PRIMARY_FOREGROUND_COLOR_HOVER = '#18171d';
 export const GL_BUTTON_DANGER_PRIMARY_FOREGROUND_COLOR_FOCUS = '#18171d';
 export const GL_BUTTON_DANGER_PRIMARY_FOREGROUND_COLOR_ACTIVE = '#18171d';
-export const GL_BUTTON_DANGER_PRIMARY_BACKGROUND_COLOR_DEFAULT = '#f57f6c';
+export const GL_BUTTON_DANGER_PRIMARY_BACKGROUND_COLOR_DEFAULT = '#f6806d';
 export const GL_BUTTON_DANGER_PRIMARY_BACKGROUND_COLOR_HOVER = '#fcb5aa';
 export const GL_BUTTON_DANGER_PRIMARY_BACKGROUND_COLOR_FOCUS = '#fcb5aa';
 export const GL_BUTTON_DANGER_PRIMARY_BACKGROUND_COLOR_ACTIVE = '#ec5941';
@@ -704,11 +704,11 @@ export const GL_CONTROL_BORDER_COLOR_DEFAULT = '#737278';
 export const GL_CONTROL_BORDER_COLOR_HOVER = '#a4a3a8';
 export const GL_CONTROL_BORDER_COLOR_FOCUS = '#ececef';
 export const GL_CONTROL_BORDER_COLOR_DISABLED = '#3a383f';
-export const GL_CONTROL_BORDER_COLOR_ERROR = '#f57f6c';
+export const GL_CONTROL_BORDER_COLOR_ERROR = '#f6806d';
 export const GL_CONTROL_BORDER_COLOR_SELECTED_DEFAULT = '#428fdc';
 export const GL_CONTROL_BORDER_COLOR_SELECTED_HOVER = '#9dc7f1';
 export const GL_CONTROL_BORDER_COLOR_SELECTED_FOCUS = '#9dc7f1';
-export const GL_CONTROL_TEXT_COLOR_ERROR = '#f57f6c';
+export const GL_CONTROL_TEXT_COLOR_ERROR = '#f6806d';
 export const GL_CONTROL_TEXT_COLOR_VALID = '#52b87a';
 export const GL_CONTROL_PLACEHOLDER_COLOR = '#89888d';
 export const GL_CONTROL_INDICATOR_COLOR_SELECTED = '#18171d';
@@ -896,7 +896,7 @@ export const GL_FEEDBACK_WARNING_TEXT_COLOR = '#e9be74';
 export const GL_FEEDBACK_WARNING_ICON_COLOR = '#d99530';
 export const GL_FEEDBACK_DANGER_BACKGROUND_COLOR = '#660e00';
 export const GL_FEEDBACK_DANGER_TEXT_COLOR = '#fcb5aa';
-export const GL_FEEDBACK_DANGER_ICON_COLOR = '#f57f6c';
+export const GL_FEEDBACK_DANGER_ICON_COLOR = '#f6806d';
 export const GL_FOCUS_RING_OUTER_COLOR = '#428fdc';
 export const GL_FOCUS_RING_INNER_COLOR = '#18171d';
 export const GL_ICON_COLOR_DEFAULT = '#dcdcde';
@@ -906,7 +906,7 @@ export const GL_ICON_COLOR_DISABLED = '#737278';
 export const GL_ICON_COLOR_LINK = '#63a6e9';
 export const GL_ICON_COLOR_INFO = '#63a6e9';
 export const GL_ICON_COLOR_WARNING = '#d99530';
-export const GL_ICON_COLOR_DANGER = '#f57f6c';
+export const GL_ICON_COLOR_DANGER = '#f6806d';
 export const GL_ICON_COLOR_SUCCESS = '#52b87a';
 export const GL_LINE_HEIGHT_12 = '0.75rem';
 export const GL_LINE_HEIGHT_16 = '1rem';
@@ -946,6 +946,6 @@ export const GL_TEXT_COLOR_STRONG = '#fff';
 export const GL_TEXT_COLOR_HEADING = '#fff';
 export const GL_TEXT_COLOR_LINK = '#9dc7f1';
 export const GL_TEXT_COLOR_WARNING = '#d99530';
-export const GL_TEXT_COLOR_DANGER = '#f57f6c';
+export const GL_TEXT_COLOR_DANGER = '#f6806d';
 export const GL_TEXT_COLOR_SUCCESS = '#52b87a';
 export const GL_TEXT_COLOR_DISABLED = '#89888d';

package/src/tokens/build/js/tokens.js

@@ -165,7 +165,7 @@ export const GL_COLOR_PURPLE_950 = '#232150';
 export const GL_COLOR_RED_50 = '#fcf1ef';
 export const GL_COLOR_RED_100 = '#fdd4cd';
 export const GL_COLOR_RED_200 = '#fcb5aa';
-export const GL_COLOR_RED_300 = '#f57f6c';
+export const GL_COLOR_RED_300 = '#f6806d';
 export const GL_COLOR_RED_400 = '#ec5941';
 export const GL_COLOR_RED_500 = '#dd2b0e';
 export const GL_COLOR_RED_600 = '#c91c00';

package/src/tokens/build/json/tokens.dark.json

@@ -3387,12 +3387,12 @@
         ]
       },
       "300": {
-        "$value": "#f57f6c",
+        "$value": "#f6806d",
         "$type": "color",
         "filePath": "src/tokens/color.constant.tokens.json",
         "isSource": true,
         "original": {
-          "$value": "#f57f6c",
+          "$value": "#f6806d",
           "$type": "color"
         },
         "name": "COLOR_RED_300",
@@ -6769,7 +6769,7 @@
     "danger": {
       "title": {
         "color": {
-          "$value": "#f57f6c",
+          "$value": "#f6806d",
           "$type": "color",
           "$description": "Used for the title color of a danger alert.",
           "filePath": "src/tokens/contextual/alert.tokens.json",
@@ -9112,7 +9112,7 @@
       "background": {
         "color": {
           "default": {
-            "$value": "#f57f6c",
+            "$value": "#f6806d",
             "$type": "color",
             "$description": "Used for the background of a danger badge when static or the default state when linked.",
             "filePath": "src/tokens/contextual/badge.tokens.json",
@@ -9136,7 +9136,7 @@
             ]
           },
           "hover": {
-            "$value": "#f57f6c",
+            "$value": "#f6806d",
             "$type": "color",
             "$description": "Used for the background of a danger badge in the hover state.",
             "filePath": "src/tokens/contextual/badge.tokens.json",
@@ -9157,7 +9157,7 @@
             ]
           },
           "focus": {
-            "$value": "#f57f6c",
+            "$value": "#f6806d",
             "$type": "color",
             "$description": "Used for the background of a danger badge in the focus state.",
             "filePath": "src/tokens/contextual/badge.tokens.json",
@@ -12390,7 +12390,7 @@
         "background": {
           "color": {
             "default": {
-              "$value": "#f57f6c",
+              "$value": "#f6806d",
               "$type": "color",
               "$description": "Used for the background of a danger (destructive) primary button in the default state.",
               "filePath": "src/tokens/contextual/button.tokens.json",
@@ -15712,7 +15712,7 @@
           ]
         },
         "error": {
-          "$value": "#f57f6c",
+          "$value": "#f6806d",
           "$type": "color",
           "$description": "Used for invalid form control (input, textarea) border.",
           "filePath": "src/tokens/control.tokens.json",
@@ -15813,7 +15813,7 @@
     "text": {
       "color": {
         "error": {
-          "$value": "#f57f6c",
+          "$value": "#f6806d",
           "$type": "color",
           "$description": "Used for the helper text when the input is invalid.",
           "filePath": "src/tokens/control.tokens.json",
@@ -20597,7 +20597,7 @@
       },
       "icon": {
         "color": {
-          "$value": "#f57f6c",
+          "$value": "#f6806d",
           "$type": "color",
           "$description": "Used for the icon of a danger feedback item when notifying about a critical issue that has just occurred and requires immediate attention.",
           "filePath": "src/tokens/feedback.tokens.json",
@@ -20826,7 +20826,7 @@
         ]
       },
       "danger": {
-        "$value": "#f57f6c",
+        "$value": "#f6806d",
         "$type": "color",
         "$description": "Used for an icon associated with an error or danger.",
         "filePath": "src/tokens/icon.tokens.json",
@@ -21777,7 +21777,7 @@
         ]
       },
       "danger": {
-        "$value": "#f57f6c",
+        "$value": "#f6806d",
         "$type": "color",
         "$description": "Used for text indicating a problem, critical state, destructive action, error, failure, removal, stop, or declination.",
         "filePath": "src/tokens/text.tokens.json",

package/src/tokens/build/json/tokens.json

@@ -3387,12 +3387,12 @@
         ]
       },
       "300": {
-        "$value": "#f57f6c",
+        "$value": "#f6806d",
         "$type": "color",
         "filePath": "src/tokens/color.constant.tokens.json",
         "isSource": true,
         "original": {
-          "$value": "#f57f6c",
+          "$value": "#f6806d",
           "$type": "color"
         },
         "name": "COLOR_RED_300",

package/src/tokens/build/scss/_tokens.dark.scss

@@ -86,7 +86,7 @@ $gl-color-purple-950: #232150;
 $gl-color-red-50: #fcf1ef;
 $gl-color-red-100: #fdd4cd;
 $gl-color-red-200: #fcb5aa;
-$gl-color-red-300: #f57f6c;
+$gl-color-red-300: #f6806d;
 $gl-color-red-400: #ec5941;
 $gl-color-red-500: #dd2b0e;
 $gl-color-red-600: #c91c00;

package/src/tokens/build/scss/_tokens.scss

@@ -86,7 +86,7 @@ $gl-color-purple-950: #232150;
 $gl-color-red-50: #fcf1ef;
 $gl-color-red-100: #fdd4cd;
 $gl-color-red-200: #fcb5aa;
-$gl-color-red-300: #f57f6c;
+$gl-color-red-300: #f6806d;
 $gl-color-red-400: #ec5941;
 $gl-color-red-500: #dd2b0e;
 $gl-color-red-600: #c91c00;

package/src/tokens/color.constant.tokens.json

@@ -256,7 +256,7 @@
         "$type": "color"
       },
       "300": {
-        "$value": "#f57f6c",
+        "$value": "#f6806d",
         "$type": "color"
       },
       "400": {

package/src/vendor/bootstrap/scss/_reboot.scss

@@ -270,7 +270,6 @@ table {
 caption {
   padding-top: $table-cell-padding;
   padding-bottom: $table-cell-padding;
-  color: $table-caption-color;
   text-align: left;
   caption-side: bottom;
 }