Skip to content

Commit

Permalink
Code review changes
Browse files Browse the repository at this point in the history
  • Loading branch information
mdo committed Jun 8, 2022
1 parent bb0b540 commit d790cc8
Showing 1 changed file with 3 additions and 3 deletions.
6 changes: 3 additions & 3 deletions site/content/docs/5.2/components/navbar.md
Original file line number Diff line number Diff line change
Expand Up @@ -732,7 +732,7 @@ To create an offcanvas navbar that expands into a normal navbar at a specific br
</nav>
```

When using offcanvas in a dark navbar, be aware that you may need to have a dark background on the offcanvas content to avoid the text becoming illegible. In the example below, we add `.navbar-dark` and `.bg-dark` to the `.navbar`, `.text-bg-dark` to the `.offcanvas`, and `.btn-close-white` to `.btn-close` for proper styling with a dark offcanvas.
When using offcanvas in a dark navbar, be aware that you may need to have a dark background on the offcanvas content to avoid the text becoming illegible. In the example below, we add `.navbar-dark` and `.bg-dark` to the `.navbar`, `.text-bg-dark` to the `.offcanvas`, `.dropdown-menu-dark` to `.dropdown-menu`, and `.btn-close-white` to `.btn-close` for proper styling with a dark offcanvas.

{{< example >}}
<nav class="navbar navbar-dark bg-dark fixed-top">
Expand All @@ -758,7 +758,7 @@ When using offcanvas in a dark navbar, be aware that you may need to have a dark
<a class="nav-link dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-expanded="false">
Dropdown
</a>
<ul class="dropdown-menu">
<ul class="dropdown-menu dropdown-menu-dark">
<li><a class="dropdown-item" href="#">Action</a></li>
<li><a class="dropdown-item" href="#">Another action</a></li>
<li>
Expand All @@ -770,7 +770,7 @@ When using offcanvas in a dark navbar, be aware that you may need to have a dark
</ul>
<form class="d-flex" role="search">
<input class="form-control me-2" type="search" placeholder="Search" aria-label="Search">
<button class="btn btn-outline-success" type="submit">Search</button>
<button class="btn btn-success" type="submit">Search</button>
</form>
</div>
</div>
Expand Down

0 comments on commit d790cc8

Please sign in to comment.