feat(docs): 'Added in v5.2.0' label for all new features (#1406)

site/content/docs/5.2/components/accordion.md

@@ -200,6 +200,8 @@ Omit the `data-bs-parent` attribute on each `.accordion-collapse` to make accord
 
 ### Dark variant
 
+{{< added-in "5.2.0" >}}
+
 Accordions come with a dark variant: `.accordion-dark`.
 
 {{< example class="bg-dark" >}}

site/content/docs/5.2/components/alerts.md

@@ -152,6 +152,8 @@ When an alert is dismissed, the element is completely removed from the page stru
 
 ### Dark variant
 
+{{< added-in "5.2.0" >}}
+
 Add `.bg-dark` to the `.alert` for a dark variant. Close button can be inverted as well by using the [dark variant of close button]({{< docsref "/components/close-button#dark-variant" >}})
 
 {{< example class="bg-dark" >}}

site/content/docs/5.2/components/buttons.md

@@ -127,6 +127,8 @@ Supported social networks are declared in a dedicated Sass map—meaning you're
 
 ## Dark background
 
+{{< added-in "5.2.0" >}}
+
 To get the inverted button behavior, simply add `.btn-inverse` to a `<button>` or `<a>`.
 
 {{< example class="bg-dark" >}}

site/content/docs/5.2/components/carousel.md

@@ -98,6 +98,8 @@ Carousel progress indicator is paused under multiple conditions:
 <!-- Boosted mod -->
 ### With pause/play button
 
+{{< added-in "5.2.0" >}}
+
 Adding a pause and play button is recommended to setup an accessible carousel.
 This `button` must immediately follow your carousel and have the custom `data-bs-control="play-button"` attribute. In addition, it must also have a `data-bs-target` attribute that matches the `id` of the `.carousel` element.
 

site/content/docs/5.2/components/footer.md

@@ -7,6 +7,8 @@ toc: true
 added: "5.2"
 ---
 
+{{< added-in "5.2.0" >}}
+
 ## How it works
 
 The footer is basically a `<footer>` tag with a `.bg-dark` class. It comes with 5 ready to use bars which should be arranged vertically in the following order:

site/content/docs/5.2/components/navs-tabs.md

@@ -172,6 +172,8 @@ Nav tabs light only differ visually, with a full width bottom border and a diffe
 
 ### Nested tabs
 
+{{< added-in "5.2.0" >}}
+
 Nav tabs light is nested in a tab for adding a level of depth in information organization.
 
 {{< example >}}

site/content/docs/5.2/components/offcanvas.md

@@ -160,7 +160,7 @@ When backdrop is set to static, the offcanvas will not close when clicking outsi
 
 ## Responsive
 
-<small class="d-inline-flex px-2 py-1 fw-semibold text-success bg-success bg-opacity-10 rounded-2">Added in v5.2.0</small>
+{{< added-in "5.2.0" >}}
 
 Responsive offcanvas classes hide content outside the viewport from a specified breakpoint and down. Above that breakpoint, the contents within will behave as usual. For example, `.offcanvas-lg` hides content in an offcanvas below the `lg` breakpoint, but shows the content above the `lg` breakpoint.
 
@@ -253,7 +253,7 @@ Since the offcanvas panel is conceptually a modal dialog, be sure to add `aria-l
 
 ### Variables
 
-<small class="d-inline-flex px-2 py-1 fw-semibold text-success bg-success bg-opacity-10 rounded-2">Added in v5.2.0</small>
+{{< added-in "5.2.0" >}}
 
 As part of Bootstrap's evolving CSS variables approach, offcanvas now uses local CSS variables on `.offcanvas` for enhanced real-time customization. Values for the CSS variables are set via Sass, so Sass customization is still supported, too.
 

site/content/docs/5.2/components/orange-navbar.md

@@ -7,6 +7,8 @@ toc: true
 added: "5.2"
 ---
 
+{{< added-in "5.2.0" >}}
+
 ## How it works
 
 Orange navbars are based on the [navbar]({{<docsref "/components/navbar">}}) component. They add some display management and introduce the Supra bar component.

site/content/docs/5.2/components/spinners.md

@@ -62,6 +62,8 @@ The border spinner uses `currentColor` for its `border-color`, meaning you can c
 
 ## Growing spinner
 
+{{< added-in "5.2.0" >}}
+
 If you don't fancy a border spinner, switch to the grow spinner. While it doesn't technically spin, it does repeatedly grow!
 
 {{< example >}}

site/content/docs/5.2/components/sticker.md

@@ -7,6 +7,8 @@ toc: true
 added: "5.2"
 ---
 
+{{< added-in "5.2.0" >}}
+
 ## Example
 
 {{< example >}}

site/content/docs/5.2/components/title-bars.md

@@ -7,6 +7,8 @@ toc: true
 added: "5.2"
 ---
 
+{{< added-in "5.2.0" >}}
+
 ## How it works
 
 A title bar is designed to display the title of a page and shall be placed right below an [Orange navbar]({{<docsref "/components/orange-navbar">}}).

site/content/docs/5.2/forms/checks-radios.md

@@ -355,6 +355,8 @@ Drop borders using `.btn-no-outline`, too.
 
 ## Star rating
 
+{{< added-in "5.2.0" >}}
+
 Star rating system is built on top of radios. Simply add `.star-rating` to a `<fieldset>` element to use predefined glyphs and compose your star rating system with as much stars as needed.
 
 {{< example >}}

site/content/docs/5.2/forms/quantity-selector.md

@@ -7,6 +7,8 @@ toc: true
 added: "5.2"
 ---
 
+{{< added-in "5.2.0" >}}
+
 ## Default
 
 Quantity selector is a form element used to select a number.

site/content/docs/5.2/utilities/text.md

@@ -104,6 +104,8 @@ Change the line height with `.lh-*` utilities.
 
 ## Line length
 
+{{< added-in "5.2.0" >}}
+
 Limit the line length with `.ll-*` utilities. It applies `max-width` property to an element with a width based on `ch` unit. This one was chosen because it is a font-based unit and because `1ch` is the width of "0" (which is around an average character width). It requires anything but `inline` to be applied.
 
 {{< example >}}