mirror of
https://github.com/twbs/bootstrap.git
synced 2025-08-21 04:41:36 +02:00
Remove remaining .navbar-light
classes (#35814)
* Fix typo in CSS variables documentation * Drop remaining .navbar-light classes
This commit is contained in:
@@ -492,7 +492,7 @@ Fixed navbars use `position: fixed`, meaning they're pulled from the normal flow
|
||||
{{< /example >}}
|
||||
|
||||
{{< example >}}
|
||||
<nav class="navbar sticky-bottom navbar-light bg-light">
|
||||
<nav class="navbar sticky-bottom bg-light">
|
||||
<div class="container-fluid">
|
||||
<a class="navbar-brand" href="#">Sticky bottom</a>
|
||||
</div>
|
||||
|
@@ -27,7 +27,7 @@ If you're making a scrollable container (other than the `<body>`), be sure to ha
|
||||
Scroll the area below the navbar and watch the active class change. The dropdown items will be highlighted as well.
|
||||
|
||||
<div class="bd-example">
|
||||
<nav id="navbar-example2" class="navbar navbar-light bg-light px-3">
|
||||
<nav id="navbar-example2" class="navbar bg-light px-3">
|
||||
<a class="navbar-brand" href="#">Navbar</a>
|
||||
<ul class="nav nav-pills">
|
||||
<li class="nav-item">
|
||||
@@ -62,7 +62,7 @@ Scroll the area below the navbar and watch the active class change. The dropdown
|
||||
</div>
|
||||
|
||||
```html
|
||||
<nav id="navbar-example2" class="navbar navbar-light bg-light px-3">
|
||||
<nav id="navbar-example2" class="navbar bg-light px-3">
|
||||
<a class="navbar-brand" href="#">Navbar</a>
|
||||
<ul class="nav nav-pills">
|
||||
<li class="nav-item">
|
||||
@@ -103,7 +103,7 @@ Scrollspy also works with nested `.nav`s. If a nested `.nav` is `.active`, its p
|
||||
<div class="bd-example">
|
||||
<div class="row">
|
||||
<div class="col-4">
|
||||
<nav id="navbar-example3" class="navbar navbar-light bg-light flex-column align-items-stretch p-3">
|
||||
<nav id="navbar-example3" class="navbar bg-light flex-column align-items-stretch p-3">
|
||||
<a class="navbar-brand" href="#">Navbar</a>
|
||||
<nav class="nav nav-pills flex-column">
|
||||
<a class="nav-link" href="#item-1">Item 1</a>
|
||||
@@ -142,7 +142,7 @@ Scrollspy also works with nested `.nav`s. If a nested `.nav` is `.active`, its p
|
||||
</div>
|
||||
|
||||
```html
|
||||
<nav id="navbar-example3" class="navbar navbar-light bg-light flex-column align-items-stretch p-3">
|
||||
<nav id="navbar-example3" class="navbar bg-light flex-column align-items-stretch p-3">
|
||||
<a class="navbar-brand" href="#">Navbar</a>
|
||||
<nav class="nav nav-pills flex-column">
|
||||
<a class="nav-link" href="#item-1">Item 1</a>
|
||||
|
@@ -34,7 +34,7 @@ Bootstrap 5 is increasingly making use of custom properties as local variables f
|
||||
|
||||
Have a look at our table documentation for some [insight into how we're using CSS variables]({{< docsref "/content/tables#how-do-the-variants-and-accented-tables-work" >}}). Our [navbars also use CSS variables]({{< docsref "/components/navbar#css" >}}) as of v5.2.0. We're also using CSS variables across our grids—primarily for gutters the [new opt-in CSS grid]({{< docsref "/layout/css-grid" >}})—with more component usage coming in the future.
|
||||
|
||||
Whenever possible, we'll assign CSS variables at the base component level (e.g., `.navbar` for navbar and it's sub-components). This reduces guessing on where and how to customize, and allows for easy modifications by our team in future updates.
|
||||
Whenever possible, we'll assign CSS variables at the base component level (e.g., `.navbar` for navbar and its sub-components). This reduces guessing on where and how to customize, and allows for easy modifications by our team in future updates.
|
||||
|
||||
## Prefix
|
||||
|
||||
|
@@ -1208,7 +1208,7 @@ direction: rtl
|
||||
|
||||
<div>
|
||||
{{< example show_markup="false" >}}
|
||||
<nav class="navbar navbar-expand-lg navbar-light bg-light">
|
||||
<nav class="navbar navbar-expand-lg bg-light">
|
||||
<div class="container-fluid">
|
||||
<a class="navbar-brand" href="#">
|
||||
<img src="/docs/{{< param docs_version >}}/assets/brand/bootstrap-logo-white.svg" width="38" height="30" class="d-inline-block align-top" alt="Bootstrap" loading="lazy"
|
||||
@@ -1417,7 +1417,7 @@ direction: rtl
|
||||
|
||||
<div>
|
||||
<div class="bd-example">
|
||||
<nav id="navbar-example2" class="navbar navbar-light bg-light px-3">
|
||||
<nav id="navbar-example2" class="navbar bg-light px-3">
|
||||
<a class="navbar-brand" href="#">شريط التنقل</a>
|
||||
<ul class="nav nav-pills">
|
||||
<li class="nav-item">
|
||||
|
@@ -1207,7 +1207,7 @@ body_class: "bg-light"
|
||||
|
||||
<div>
|
||||
{{< example show_markup="false" >}}
|
||||
<nav class="navbar navbar-expand-lg navbar-light bg-light">
|
||||
<nav class="navbar navbar-expand-lg bg-light">
|
||||
<div class="container-fluid">
|
||||
<a class="navbar-brand" href="#">
|
||||
<img src="/docs/{{< param docs_version >}}/assets/brand/bootstrap-logo-white.svg" width="38" height="30" class="d-inline-block align-top" alt="Bootstrap" loading="lazy"
|
||||
@@ -1414,7 +1414,7 @@ body_class: "bg-light"
|
||||
|
||||
<div>
|
||||
<div class="bd-example">
|
||||
<nav id="navbar-example2" class="navbar navbar-light bg-light px-3">
|
||||
<nav id="navbar-example2" class="navbar bg-light px-3">
|
||||
<a class="navbar-brand" href="#">Navbar</a>
|
||||
<ul class="nav nav-pills">
|
||||
<li class="nav-item">
|
||||
|
Reference in New Issue
Block a user