summaryrefslogtreecommitdiffstats
path: root/site/content/docs/5.3/examples/headers/index.html
diff options
context:
space:
mode:
Diffstat (limited to '')
-rw-r--r--site/content/docs/5.3/examples/headers/index.html (renamed from site/content/docs/5.2/examples/headers/index.html)56
1 files changed, 29 insertions, 27 deletions
diff --git a/site/content/docs/5.2/examples/headers/index.html b/site/content/docs/5.3/examples/headers/index.html
index b8fc8b2..d47597f 100644
--- a/site/content/docs/5.2/examples/headers/index.html
+++ b/site/content/docs/5.3/examples/headers/index.html
@@ -35,7 +35,7 @@ body_class: ""
<div class="container">
<header class="d-flex flex-wrap justify-content-center py-3 mb-4 border-bottom">
- <a href="/" class="d-flex align-items-center mb-3 mb-md-0 me-md-auto text-dark text-decoration-none">
+ <a href="/" class="d-flex align-items-center mb-3 mb-md-0 me-md-auto link-body-emphasis text-decoration-none">
<svg class="bi me-2" width="40" height="32"><use xlink:href="#bootstrap"/></svg>
<span class="fs-4">Simple header</span>
</a>
@@ -68,16 +68,18 @@ body_class: ""
<div class="container">
<header class="d-flex flex-wrap align-items-center justify-content-center justify-content-md-between py-3 mb-4 border-bottom">
- <a href="/" class="d-flex align-items-center col-md-3 mb-2 mb-md-0 text-dark text-decoration-none">
- <svg class="bi me-2" width="40" height="32" role="img" aria-label="Bootstrap"><use xlink:href="#bootstrap"/></svg>
- </a>
+ <div class="col-md-3 mb-2 mb-md-0">
+ <a href="/" class="d-inline-flex link-body-emphasis text-decoration-none">
+ <svg class="bi" width="40" height="32" role="img" aria-label="Bootstrap"><use xlink:href="#bootstrap"/></svg>
+ </a>
+ </div>
<ul class="nav col-12 col-md-auto mb-2 justify-content-center mb-md-0">
<li><a href="#" class="nav-link px-2 link-secondary">Home</a></li>
- <li><a href="#" class="nav-link px-2 link-dark">Features</a></li>
- <li><a href="#" class="nav-link px-2 link-dark">Pricing</a></li>
- <li><a href="#" class="nav-link px-2 link-dark">FAQs</a></li>
- <li><a href="#" class="nav-link px-2 link-dark">About</a></li>
+ <li><a href="#" class="nav-link px-2">Features</a></li>
+ <li><a href="#" class="nav-link px-2">Pricing</a></li>
+ <li><a href="#" class="nav-link px-2">FAQs</a></li>
+ <li><a href="#" class="nav-link px-2">About</a></li>
</ul>
<div class="col-md-3 text-end">
@@ -121,15 +123,15 @@ body_class: ""
<header class="p-3 mb-3 border-bottom">
<div class="container">
<div class="d-flex flex-wrap align-items-center justify-content-center justify-content-lg-start">
- <a href="/" class="d-flex align-items-center mb-2 mb-lg-0 text-dark text-decoration-none">
+ <a href="/" class="d-flex align-items-center mb-2 mb-lg-0 link-body-emphasis text-decoration-none">
<svg class="bi me-2" width="40" height="32" role="img" aria-label="Bootstrap"><use xlink:href="#bootstrap"/></svg>
</a>
<ul class="nav col-12 col-lg-auto me-lg-auto mb-2 justify-content-center mb-md-0">
<li><a href="#" class="nav-link px-2 link-secondary">Overview</a></li>
- <li><a href="#" class="nav-link px-2 link-dark">Inventory</a></li>
- <li><a href="#" class="nav-link px-2 link-dark">Customers</a></li>
- <li><a href="#" class="nav-link px-2 link-dark">Products</a></li>
+ <li><a href="#" class="nav-link px-2 link-body-emphasis">Inventory</a></li>
+ <li><a href="#" class="nav-link px-2 link-body-emphasis">Customers</a></li>
+ <li><a href="#" class="nav-link px-2 link-body-emphasis">Products</a></li>
</ul>
<form class="col-12 col-lg-auto mb-3 mb-lg-0 me-lg-3" role="search">
@@ -137,7 +139,7 @@ body_class: ""
</form>
<div class="dropdown text-end">
- <a href="#" class="d-block link-dark text-decoration-none dropdown-toggle" data-bs-toggle="dropdown" aria-expanded="false">
+ <a href="#" class="d-block link-body-emphasis text-decoration-none dropdown-toggle" data-bs-toggle="dropdown" aria-expanded="false">
<img src="https://github.com/mdo.png" alt="mdo" width="32" height="32" class="rounded-circle">
</a>
<ul class="dropdown-menu text-small">
@@ -157,7 +159,7 @@ body_class: ""
<header class="py-3 mb-3 border-bottom">
<div class="container-fluid d-grid gap-3 align-items-center" style="grid-template-columns: 1fr 2fr;">
<div class="dropdown">
- <a href="#" class="d-flex align-items-center col-lg-4 mb-2 mb-lg-0 link-dark text-decoration-none dropdown-toggle" data-bs-toggle="dropdown" aria-expanded="false">
+ <a href="#" class="d-flex align-items-center col-lg-4 mb-2 mb-lg-0 link-body-emphasis text-decoration-none dropdown-toggle" data-bs-toggle="dropdown" aria-expanded="false">
<svg class="bi me-2" width="40" height="32"><use xlink:href="#bootstrap"/></svg>
</a>
<ul class="dropdown-menu text-small shadow">
@@ -177,7 +179,7 @@ body_class: ""
</form>
<div class="flex-shrink-0 dropdown">
- <a href="#" class="d-block link-dark text-decoration-none dropdown-toggle" data-bs-toggle="dropdown" aria-expanded="false">
+ <a href="#" class="d-block link-body-emphasis text-decoration-none dropdown-toggle" data-bs-toggle="dropdown" aria-expanded="false">
<img src="https://github.com/mdo.png" alt="mdo" width="32" height="32" class="rounded-circle">
</a>
<ul class="dropdown-menu text-small shadow">
@@ -194,10 +196,10 @@ body_class: ""
<div class="container-fluid pb-3">
<div class="d-grid gap-3" style="grid-template-columns: 1fr 2fr;">
- <div class="bg-light border rounded-3">
+ <div class="bg-body-tertiary border rounded-3">
<br><br><br><br><br><br><br><br><br><br>
</div>
- <div class="bg-light border rounded-3">
+ <div class="bg-body-tertiary border rounded-3">
<br><br><br><br><br><br><br><br><br><br>
</div>
</div>
@@ -205,24 +207,24 @@ body_class: ""
<div class="b-example-divider"></div>
- <nav class="py-2 bg-light border-bottom">
+ <nav class="py-2 bg-body-tertiary border-bottom">
<div class="container d-flex flex-wrap">
<ul class="nav me-auto">
- <li class="nav-item"><a href="#" class="nav-link link-dark px-2 active" aria-current="page">Home</a></li>
- <li class="nav-item"><a href="#" class="nav-link link-dark px-2">Features</a></li>
- <li class="nav-item"><a href="#" class="nav-link link-dark px-2">Pricing</a></li>
- <li class="nav-item"><a href="#" class="nav-link link-dark px-2">FAQs</a></li>
- <li class="nav-item"><a href="#" class="nav-link link-dark px-2">About</a></li>
+ <li class="nav-item"><a href="#" class="nav-link link-body-emphasis px-2 active" aria-current="page">Home</a></li>
+ <li class="nav-item"><a href="#" class="nav-link link-body-emphasis px-2">Features</a></li>
+ <li class="nav-item"><a href="#" class="nav-link link-body-emphasis px-2">Pricing</a></li>
+ <li class="nav-item"><a href="#" class="nav-link link-body-emphasis px-2">FAQs</a></li>
+ <li class="nav-item"><a href="#" class="nav-link link-body-emphasis px-2">About</a></li>
</ul>
<ul class="nav">
- <li class="nav-item"><a href="#" class="nav-link link-dark px-2">Login</a></li>
- <li class="nav-item"><a href="#" class="nav-link link-dark px-2">Sign up</a></li>
+ <li class="nav-item"><a href="#" class="nav-link link-body-emphasis px-2">Login</a></li>
+ <li class="nav-item"><a href="#" class="nav-link link-body-emphasis px-2">Sign up</a></li>
</ul>
</div>
</nav>
<header class="py-3 mb-4 border-bottom">
<div class="container d-flex flex-wrap justify-content-center">
- <a href="/" class="d-flex align-items-center mb-3 mb-lg-0 me-lg-auto text-dark text-decoration-none">
+ <a href="/" class="d-flex align-items-center mb-3 mb-lg-0 me-lg-auto link-body-emphasis text-decoration-none">
<svg class="bi me-2" width="40" height="32"><use xlink:href="#bootstrap"/></svg>
<span class="fs-4">Double header</span>
</a>
@@ -235,7 +237,7 @@ body_class: ""
<div class="b-example-divider"></div>
<header>
- <div class="px-3 py-2 text-bg-dark">
+ <div class="px-3 py-2 text-bg-dark border-bottom">
<div class="container">
<div class="d-flex flex-wrap align-items-center justify-content-center justify-content-lg-start">
<a href="/" class="d-flex align-items-center my-2 my-lg-0 me-lg-auto text-white text-decoration-none">