Skip to content

Commit c654bab

Browse files
Docs: modify remaining .link-offset-* to .underline-offset-* usage (#42572)
1 parent 5d7ac0d commit c654bab

2 files changed

Lines changed: 18 additions & 3 deletions

File tree

site/src/content/docs/guides/migration.mdx

Lines changed: 15 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -391,6 +391,21 @@ Bootstrap 6 is a major release with many breaking changes to modernize our codeb
391391
- **Spacing and border utilities now use CSS logical properties.** `margin-top` → `margin-block-start`, `margin-right` → `margin-inline-end`, `padding-left` → `padding-inline-start`, `border-right` → `border-inline-end`, etc. Class names (`.mt-*`, `.me-*`, `.ps-*`, `.border-end`) remain the same, but the underlying CSS properties are now logical, improving RTL and writing-mode support.
392392
- **Text wrap additions.** Added `.text-balance` and `.text-pretty` values to the text-wrap utility.
393393
- **Color utility renames.** `.text-*` color utilities have been replaced by `.fg-*` (foreground) utilities. New `.fg-emphasis-*` and `.fg-contrast-*` variants. Background utilities now include `.bg-subtle-*` and `.bg-muted-*` in addition to `.bg-*`. Added `.fg-bg` and `.bg-fg` cross-reference utilities; removed `.fg-inherit` and `.bg-inherit`. Renamed `.bg-opacity-*` to `.bg-*`. Renamed `.text-reset` to `.fg-reset`.
394+
- **Link utilities are now part of text decoration utilities.** The v5 `link-*` utility family has been replaced by `underline-*` utilities documented under [Text decoration]([[docsref:/utilities/text-decoration]]). Update class names accordingly:
395+
396+
<BsTable>
397+
| Category | Before (v5) | After (v6) |
398+
|---|---|---|
399+
| Link text opacity | `.link-opacity-*`, `.link-opacity-*-hover` | Removed (no dedicated `link-opacity-*` utility in v6) |
400+
| Underline offset | `.link-offset-1`, `.link-offset-2`, `.link-offset-3` | `.underline-offset-1`, `.underline-offset-2`, `.underline-offset-3` |
401+
| Underline color | `.link-underline-primary`, `.link-underline-secondary` | `.underline-primary`, `.underline-secondary` |
402+
| Underline opacity | `.link-underline-opacity-*` | `.underline-*` (10-step scale from `10` to `100`) |
403+
| Underline thickness || `.underline-thickness-1` through `.underline-thickness-5` |
404+
| Hover variants | `.link-offset-3-hover`, `.link-underline-opacity-75-hover` | `.hover:underline-offset-3`, `.hover:underline-70` or `.hover:underline-80` |
405+
</BsTable>
406+
407+
The helper `.link-underline` is no longer needed in v6.
408+
394409
- **Display utilities:** added `flow-root` and `contents` options.
395410
- **Sizing utilities:**
396411
- Renamed `.mh-*`/`.mw-*` to `.max-h-*`/`.max-w-*`

site/src/layouts/partials/ExamplesMain.astro

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -22,7 +22,7 @@ import { getSlug } from '@libs/utils'
2222
<div>
2323
<h3 class="h5 mb-1">
2424
<a
25-
class="d-block link-offset-1"
25+
class="d-block underline-offset-1"
2626
href={`${getConfig().github_org}${example.url}/`}
2727
target="_blank"
2828
rel="noopener"
@@ -34,7 +34,7 @@ import { getSlug } from '@libs/utils'
3434
<p class="fg-2">{example.description}</p>
3535
<p>
3636
<a
37-
class="icon-link small theme-secondary link-offset-1"
37+
class="icon-link small theme-secondary underline-offset-1"
3838
href={`https://stackblitz.com/github/twbs${example.url}?file=${
3939
example.indexPath ? example.indexPath : 'index.html'
4040
}`}
@@ -56,7 +56,7 @@ import { getSlug } from '@libs/utils'
5656
return (
5757
<article class="sm:col-6 md:col-3 mb-3">
5858
<a
59-
class="d-block link-offset-1"
59+
class="d-block underline-offset-1"
6060
href={`/docs/${getConfig().docs_version}/examples/${getSlug(example.name)}/`}
6161
>
6262
<img

0 commit comments

Comments
 (0)