1
0
mirror of https://github.com/twbs/bootstrap.git synced 2025-08-28 07:39:57 +02:00

Use <h1> for all modal-title examples/uses (#37210)

* Use `fs-` font sizing classes where needed
* Also add info callout about heading hierarchy in modals
This commit is contained in:
Patrick H. Lauke
2022-10-02 11:02:36 +01:00
committed by GitHub
parent 812f891bfc
commit 0a5f6e078c
5 changed files with 45 additions and 41 deletions

View File

@@ -1535,7 +1535,7 @@ body_class: "bg-light"
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header">
<h5 class="modal-title" id="exampleModalLabel">Modal title</h5>
<h1 class="modal-title fs-5" id="exampleModalLabel">Modal title</h1>
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
</div>
<div class="modal-body">
@@ -1552,7 +1552,7 @@ body_class: "bg-light"
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header">
<h5 class="modal-title" id="staticBackdropLiveLabel">Modal title</h5>
<h1 class="modal-title fs-5" id="staticBackdropLiveLabel">Modal title</h1>
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
</div>
<div class="modal-body">
@@ -1569,7 +1569,7 @@ body_class: "bg-light"
<div class="modal-dialog modal-dialog-centered modal-dialog-scrollable">
<div class="modal-content">
<div class="modal-header">
<h5 class="modal-title" id="exampleModalCenteredScrollableTitle">Modal title</h5>
<h1 class="modal-title fs-5" id="exampleModalCenteredScrollableTitle">Modal title</h1>
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
</div>
<div class="modal-body">
@@ -1588,7 +1588,7 @@ body_class: "bg-light"
<div class="modal-dialog modal-fullscreen">
<div class="modal-content">
<div class="modal-header">
<h5 class="modal-title h4" id="exampleModalFullscreenLabel">Full screen modal</h5>
<h1 class="modal-title fs-4" id="exampleModalFullscreenLabel">Full screen modal</h1>
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
</div>
<div class="modal-body">