From: Mark Otto <markdotto@gmail.com>
Date: Wed, 26 Feb 2025 17:39:17 +0000 (-0800)
Subject: Update Alerts variables and remove deprecation mentions
X-Git-Url: http://git.ipfire.org/?a=commitdiff_plain;h=4dc3e62ec26fb450ff38026f19ed59842567a4ed;p=thirdparty%2Fbootstrap.git

Update Alerts variables and remove deprecation mentions
---

diff --git a/scss/_alert.scss b/scss/_alert.scss
index 1003f6a440..3964929283 100644
--- a/scss/_alert.scss
+++ b/scss/_alert.scss
@@ -10,13 +10,14 @@
 @layer components {
   .alert {
     // scss-docs-start alert-css-vars
-    --#{$prefix}alert-bg: transparent;
+    --#{$prefix}alert-bg: var(--#{$prefix}theme-bg-subtle, transparent);
     --#{$prefix}alert-padding-x: #{$alert-padding-x};
     --#{$prefix}alert-padding-y: #{$alert-padding-y};
     --#{$prefix}alert-margin-bottom: #{$alert-margin-bottom};
-    --#{$prefix}alert-color: inherit;
-    --#{$prefix}alert-border-color: transparent;
-    --#{$prefix}alert-border: #{$alert-border-width} solid var(--#{$prefix}alert-border-color);
+    --#{$prefix}alert-color: var(--#{$prefix}theme-text, inherit);
+    --#{$prefix}alert-border-color: var(--#{$prefix}theme-border, transparent);
+    --#{$prefix}alert-border-width: #{$alert-border-width};
+    // --#{$prefix}alert-border: #{$alert-border-width} solid var(--#{$prefix}alert-border-color);
     --#{$prefix}alert-border-radius: #{$alert-border-radius};
     --#{$prefix}alert-link-color: inherit;
     // scss-docs-end alert-css-vars
@@ -26,7 +27,7 @@
     margin-bottom: var(--#{$prefix}alert-margin-bottom);
     color: var(--#{$prefix}alert-color);
     background-color: var(--#{$prefix}alert-bg);
-    border: var(--#{$prefix}alert-border);
+    border: var(--#{$prefix}alert-border-width) solid var(--#{$prefix}alert-border-color);
     @include border-radius(var(--#{$prefix}alert-border-radius));
   }
 
diff --git a/site/src/content/docs/components/alerts.mdx b/site/src/content/docs/components/alerts.mdx
index e25604462b..a173cfa895 100644
--- a/site/src/content/docs/components/alerts.mdx
+++ b/site/src/content/docs/components/alerts.mdx
@@ -14,9 +14,9 @@ Alerts are available for any length of text, as well as an optional close button
 **Heads up!** As of v5.3.0, the `alert-variant()` Sass mixin is deprecated. Alert variants now have their CSS variables overridden in [a Sass loop](#sass-loops).
 </Callout>
 
-<Example code={getData('theme-colors').map((themeColor) => `<div class="alert alert-${themeColor.name}" role="alert">
-    A simple ${themeColor.name} alert—check it out!
-  </div>`)} />
+<Example code={getData('theme-colors').map((themeColor) => `<div class="alert theme-${themeColor.name}" role="alert">
+  A simple ${themeColor.name} alert—check it out!
+</div>`)} />
 
 <Callout name="warning-color-assistive-technologies" />
 
@@ -136,6 +136,7 @@ As part of Bootstrap’s evolving CSS variables approach, alerts now use local C
 
 <ScssDocs name="alert-variables" file="scss/_variables.scss" />
 
+<<<<<<< HEAD
 ### Sass mixins
 
 <DeprecatedIn version="5.3.0" />
@@ -143,6 +144,9 @@ As part of Bootstrap’s evolving CSS variables approach, alerts now use local C
 <ScssDocs name="alert-variant-mixin" file="scss/mixins/_alert.scss" removeIndentation={false} />
 
 ### Sass loops
+=======
+### Sass loop
+>>>>>>> 29c34e4cd (Update Alerts variables and remove deprecation mentions)
 
 Loop that generates the modifier classes with an overriding of CSS variables.