diff --git a/site/content/docs/5.3/helpers/color-background.md b/site/content/docs/5.3/helpers/color-background.md
index d64ca43391..780662e964 100644
--- a/site/content/docs/5.3/helpers/color-background.md
+++ b/site/content/docs/5.3/helpers/color-background.md
@@ -4,7 +4,8 @@ title: Color and background
description: Set a background color with contrasting foreground color.
group: helpers
toc: true
-added: "5.2"
+added:
+ version: "5.2"
---
## Overview
diff --git a/site/content/docs/5.3/helpers/focus-ring.md b/site/content/docs/5.3/helpers/focus-ring.md
index fa36bf8ce0..5a4e0f0faf 100644
--- a/site/content/docs/5.3/helpers/focus-ring.md
+++ b/site/content/docs/5.3/helpers/focus-ring.md
@@ -4,7 +4,8 @@ title: Focus ring
description: Utility classes that allows you to add and modify custom focus ring styles to elements and components.
group: helpers
toc: true
-added: "5.3"
+added:
+ version: "5.3"
---
The `.focus-ring` helper removes the default `outline` on `:focus`, replacing it with a `box-shadow` that can be more broadly customized. The new shadow is made up of a series of CSS variables, inherited from the `:root` level, that can be modified for any element or component.
diff --git a/site/content/docs/5.3/helpers/icon-link.md b/site/content/docs/5.3/helpers/icon-link.md
index ec63c5b8c8..1e5cc8b127 100644
--- a/site/content/docs/5.3/helpers/icon-link.md
+++ b/site/content/docs/5.3/helpers/icon-link.md
@@ -4,7 +4,8 @@ title: Icon link
description: Quickly create stylized hyperlinks with Bootstrap Icons or other icons.
group: helpers
toc: true
-added: 5.3
+added:
+ version: "5.3"
---
The icon link helper component modifies our default link styles to enhance their appearance and quickly align any pairing of icon and text. Alignment is set via inline flexbox styling and a default `gap` value. We stylize the underline with a custom offset and color. Icons are automatically sized to `1em` to best match their associated text's `font-size`.
diff --git a/site/content/docs/5.3/helpers/stacks.md b/site/content/docs/5.3/helpers/stacks.md
index ffe434188b..f85a7533ea 100644
--- a/site/content/docs/5.3/helpers/stacks.md
+++ b/site/content/docs/5.3/helpers/stacks.md
@@ -4,7 +4,8 @@ title: Stacks
description: Shorthand helpers that build on top of our flexbox utilities to make component layout faster and easier than ever.
group: helpers
toc: true
-added: "5.1"
+added:
+ version: "5.1"
---
Stacks offer a shortcut for applying a number of flexbox properties to quickly and easily create layouts in Bootstrap. All credit for the concept and implementation goes to the open source [Pylon project](https://almonk.github.io/pylon/).
diff --git a/site/content/docs/5.3/helpers/vertical-rule.md b/site/content/docs/5.3/helpers/vertical-rule.md
index 130f97b8a6..9e5981f226 100644
--- a/site/content/docs/5.3/helpers/vertical-rule.md
+++ b/site/content/docs/5.3/helpers/vertical-rule.md
@@ -4,7 +4,8 @@ title: Vertical rule
description: Use the custom vertical rule helper to create vertical dividers like the `` element. group: helpers toc: true -added: "5.1" +added: + version: "5.1" --- ## How it works diff --git a/site/content/docs/5.3/layout/breakpoints.md b/site/content/docs/5.3/layout/breakpoints.md index 1667fd9d11..1799503baa 100644 --- a/site/content/docs/5.3/layout/breakpoints.md +++ b/site/content/docs/5.3/layout/breakpoints.md @@ -41,7 +41,7 @@ For more information and examples on how to modify our Sass maps and variables, ## Media queries -Since Bootstrap is developed to be mobile first, we use a handful of [media queries](https://developer.mozilla.org/en-US/docs/Web/CSS/Media_Queries/Using_media_queries) to create sensible breakpoints for our layouts and interfaces. These breakpoints are mostly based on minimum viewport widths and allow us to scale up elements as the viewport changes. +Since Bootstrap is developed to be mobile first, we use a handful of [media queries](https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_media_queries/Using_media_queries) to create sensible breakpoints for our layouts and interfaces. These breakpoints are mostly based on minimum viewport widths and allow us to scale up elements as the viewport changes. ### Min-width diff --git a/site/content/docs/5.3/layout/css-grid.md b/site/content/docs/5.3/layout/css-grid.md index 397733c8a2..c79c4ce0f4 100644 --- a/site/content/docs/5.3/layout/css-grid.md +++ b/site/content/docs/5.3/layout/css-grid.md @@ -4,7 +4,8 @@ title: CSS Grid description: Learn how to enable, use, and customize our alternate layout system built on CSS Grid with examples and code snippets. group: layout toc: true -added: "5.1" +added: + version: "5.1" --- Bootstrap's default grid system represents the culmination of over a decade of CSS layout techniques, tried and tested by millions of people. But, it was also created without many of the modern CSS features and techniques we're seeing in browsers like the new CSS Grid. diff --git a/site/content/docs/5.3/utilities/api.md b/site/content/docs/5.3/utilities/api.md index aa7d6b88bd..ec9e593318 100644 --- a/site/content/docs/5.3/utilities/api.md +++ b/site/content/docs/5.3/utilities/api.md @@ -7,7 +7,7 @@ aliases: "/docs/5.3/utilities/" toc: true --- -Bootstrap utilities are generated with our utility API and can be used to modify or extend our default set of utility classes via Sass. Our utility API is based on a series of Sass maps and functions for generating families of classes with various options. If you're unfamiliar with Sass maps, read up on the [official Sass docs](https://sass-lang.com/documentation/values/maps) to get started. +Bootstrap utilities are generated with our utility API and can be used to modify or extend our default set of utility classes via Sass. Our utility API is based on a series of Sass maps and functions for generating families of classes with various options. If you're unfamiliar with Sass maps, read up on the [official Sass docs](https://sass-lang.com/documentation/values/maps/) to get started. The `$utilities` map contains all our utilities and is later merged with your custom `$utilities` map, if present. The utility map contains a keyed list of utility groups which accept the following options: @@ -521,7 +521,7 @@ $utilities: map-merge( ### Remove utilities -Remove any of the default utilities with the [`map-remove()` Sass function](https://sass-lang.com/documentation/modules/map#remove). +Remove any of the default utilities with the [`map-remove()` Sass function](https://sass-lang.com/documentation/modules/map/#remove). ```scss @import "bootstrap/scss/functions"; @@ -537,7 +537,7 @@ $utilities: map-remove($utilities, "width", "float"); @import "bootstrap/scss/utilities/api"; ``` -You can also use the [`map-merge()` Sass function](https://sass-lang.com/documentation/modules/map#merge) and set the group key to `null` to remove the utility. +You can also use the [`map-merge()` Sass function](https://sass-lang.com/documentation/modules/map/#merge) and set the group key to `null` to remove the utility. ```scss @import "bootstrap/scss/functions"; @@ -559,7 +559,7 @@ $utilities: map-merge( ### Add, remove, modify -You can add, remove, and modify many utilities all at once with the [`map-merge()` Sass function](https://sass-lang.com/documentation/modules/map#merge). Here's how you can combine the previous examples into one larger map. +You can add, remove, and modify many utilities all at once with the [`map-merge()` Sass function](https://sass-lang.com/documentation/modules/map/#merge). Here's how you can combine the previous examples into one larger map. ```scss @import "bootstrap/scss/functions"; diff --git a/site/content/docs/5.3/utilities/link.md b/site/content/docs/5.3/utilities/link.md index 668af8c237..2623f8029e 100644 --- a/site/content/docs/5.3/utilities/link.md +++ b/site/content/docs/5.3/utilities/link.md @@ -4,7 +4,8 @@ title: Link description: Link utilities are used to stylize your anchors to adjust their color, opacity, underline offset, underline color, and more. group: utilities toc: true -added: 5.3 +added: + version: "5.3" --- ## Link opacity diff --git a/site/content/docs/5.3/utilities/object-fit.md b/site/content/docs/5.3/utilities/object-fit.md index babc70a697..732a8fec98 100644 --- a/site/content/docs/5.3/utilities/object-fit.md +++ b/site/content/docs/5.3/utilities/object-fit.md @@ -4,6 +4,8 @@ title: Object fit description: Use the object fit utilities to modify how the content of a [replaced element](https://developer.mozilla.org/en-US/docs/Web/CSS/Replaced_element), such as an `