Revert border-color utilities to use the CSS property instead of the variable

diff --git a/scss/_utilities.scss b/scss/_utilities.scss
index 3705f92ab37f56bea6cc3cc7a564fde00898e0f3..9e60529098b84d0e7c562ab2321589561f4b8763 100644 (file)
--- a/scss/_utilities.scss
+++ b/scss/_utilities.scss
@@ -148,8 +148,7 @@ $utilities: map-merge(
       )
     ),
     "border-color": (
-      css-var: true,
-      css-variable-name: border-color,
+      property: border-color,
       class: border,
       values: $utilities-border-colors
     ),

diff --git a/site/content/docs/5.1/utilities/borders.md b/site/content/docs/5.1/utilities/borders.md
index 6939dcdf8ac48d930a395cdafc9f6ad0ae115727..17d353b322d1c2725b2c870b436bddce8a2fa2b9 100644 (file)
--- a/site/content/docs/5.1/utilities/borders.md
+++ b/site/content/docs/5.1/utilities/borders.md
@@ -43,6 +43,12 @@ Change the border color using utilities built on our theme colors.
 <span class="border border-white"></span>
 {{< /example >}}
 
+{{< callout >}}
+Unlike text and background color utilities, border color utilities redeclare the `border-color` property **without** an additional `--bs-border-opacity`, as opposed to resetting only `--bs-border-color`. This ensures the backward compatibility of border color utilities applying to other components while providing additional functionality through CSS variables.
+
+This will be revisited in a future major release.
+{{< /callout >}}
+
 ## Opacity
 
 {{< added-in "5.2.0" >}}