diff --git a/_data/nav.yml b/_data/nav.yml index 79f532a8b1..a6d4a6bdce 100644 --- a/_data/nav.yml +++ b/_data/nav.yml @@ -65,7 +65,7 @@ - title: Screenreaders - title: Sizing - title: Spacing - - title: Typography + - title: Text - title: Vertical align - title: Visibility diff --git a/docs/4.0/components/card.md b/docs/4.0/components/card.md index 28483fc137..d0d633d052 100644 --- a/docs/4.0/components/card.md +++ b/docs/4.0/components/card.md @@ -242,7 +242,7 @@ Use custom CSS in your stylesheets or as inline styles to set a width. ## Text alignment -You can quickly change the text alignment of any card—in its entirety or specific parts—with our [text align classes]({{ site.baseurl }}/docs/{{ site.docs_version }}/utilities/typography/#text-alignment). +You can quickly change the text alignment of any card—in its entirety or specific parts—with our [text align classes]({{ site.baseurl }}/docs/{{ site.docs_version }}/utilities/text/#text-alignment). {% example html %}
diff --git a/docs/4.0/content/figures.md b/docs/4.0/content/figures.md index e7c181cabd..31e89edfe8 100644 --- a/docs/4.0/content/figures.md +++ b/docs/4.0/content/figures.md @@ -16,7 +16,7 @@ Use the included `.figure` , `.figure-img` and `.figure-caption` classes to prov {% endexample %} -Aligning the figure's caption is easy with our [text utilities]({{ site.baseurl }}/docs/{{ site.docs_version }}/utilities/typography/#text-alignment). +Aligning the figure's caption is easy with our [text utilities]({{ site.baseurl }}/docs/{{ site.docs_version }}/utilities/text/#text-alignment). {% example html %}
diff --git a/docs/4.0/content/images.md b/docs/4.0/content/images.md index 2198889c77..7906dab362 100644 --- a/docs/4.0/content/images.md +++ b/docs/4.0/content/images.md @@ -38,7 +38,7 @@ In addition to our [border-radius utilities]({{ site.baseurl }}/docs/{{ site.doc ## Aligning images -Align images with the [helper float classes]({{ site.baseurl }}/docs/{{ site.docs_version }}/utilities/responsive-helpers/#responsive-floats) or [text alignment classes]({{ site.baseurl }}/docs/{{ site.docs_version }}/utilities/typography/#text-alignment). `block`-level images can be centered using [the `.mx-auto` margin utility class]({{ site.baseurl }}/docs/{{ site.docs_version }}/utilities/spacing/#horizontal-centering). +Align images with the [helper float classes]({{ site.baseurl }}/docs/{{ site.docs_version }}/utilities/responsive-helpers/#responsive-floats) or [text alignment classes]({{ site.baseurl }}/docs/{{ site.docs_version }}/utilities/text/#text-alignment). `block`-level images can be centered using [the `.mx-auto` margin utility class]({{ site.baseurl }}/docs/{{ site.docs_version }}/utilities/spacing/#horizontal-centering).
A generic square placeholder image with rounded corners diff --git a/docs/4.0/content/typography.md b/docs/4.0/content/typography.md index 2f69ea9c63..74ecbe6147 100644 --- a/docs/4.0/content/typography.md +++ b/docs/4.0/content/typography.md @@ -8,7 +8,7 @@ toc: true ## Global settings -Bootstrap sets basic global display, typography, and link styles. When more control is needed, check out the [textual utility classes]({{ site.baseurl }}/docs/{{ site.docs_version }}/utilities/typography/). +Bootstrap sets basic global display, typography, and link styles. When more control is needed, check out the [textual utility classes]({{ site.baseurl }}/docs/{{ site.docs_version }}/utilities/text/). - Use a [native font stack]({{ site.baseurl }}/docs/{{ site.docs_version }}/content/reboot/#native-font-stack) that selects the best `font-family` for each OS and device. - For a more inclusive and accessible type scale, we assume the browser default root `font-size` (typically 16px) so visitors can customize their browser defaults as needed. @@ -168,7 +168,7 @@ While not shown above, feel free to use `` and `` in HTML5. `` is meant ## Text utilities -Change text alignment, transform, style, weight, and color with our [text utilities]({{ site.baseurl }}/docs/{{ site.docs_version }}/utilities/typography/#text-alignment). +Change text alignment, transform, style, weight, and color with our [text utilities]({{ site.baseurl }}/docs/{{ site.docs_version }}/utilities/text/#text-alignment). ## Abbreviations diff --git a/docs/4.0/migration.md b/docs/4.0/migration.md index 1748fd9248..0f2819eddd 100644 --- a/docs/4.0/migration.md +++ b/docs/4.0/migration.md @@ -198,7 +198,7 @@ Dropped entirely for the new card component. - `.panel-default` removed and no replacement. - `.panel-group` removed and no replacement. `.card-group` is not a replacement, it is different. - `.panel-heading` to `.card-header` -- `.panel-title` to `.card-title`. Depending on the desired look, you may also want to use [heading elements or classes]({{ site.baseurl }}/docs/{{ site.docs_version }}/content/typography/#headings) (e.g. `

`, `.h3`) or bold elements or classes (e.g. ``, ``, [`.font-weight-bold`]({{ site.baseurl }}/docs/{{ site.docs_version }}/utilities/typography/#font-weight-and-italics)). Note that `.card-title`, while similarly named, produces a different look than `.panel-title`. +- `.panel-title` to `.card-title`. Depending on the desired look, you may also want to use [heading elements or classes]({{ site.baseurl }}/docs/{{ site.docs_version }}/content/typography/#headings) (e.g. `

`, `.h3`) or bold elements or classes (e.g. ``, ``, [`.font-weight-bold`]({{ site.baseurl }}/docs/{{ site.docs_version }}/utilities/text/#font-weight-and-italics)). Note that `.card-title`, while similarly named, produces a different look than `.panel-title`. - `.panel-body` to `.card-body` - `.panel-footer` to `.card-footer` - `.panel-primary`, `.panel-success`, `.panel-info`, `.panel-warning`, and `.panel-danger` have been dropped for `.bg-`, `.text-`, and `.border` utilities generated from our `$theme-colors` Sass map. diff --git a/docs/4.0/utilities/typography.md b/docs/4.0/utilities/text.md similarity index 100% rename from docs/4.0/utilities/typography.md rename to docs/4.0/utilities/text.md