1
0
mirror of https://github.com/twbs/bootstrap.git synced 2025-08-22 05:03:16 +02:00

More darkmode examples (#38058)

* WIP darkmode examples

* Fix product css error, redo parts of blog

* wip dashboard

* updated rtl generated

* fix up some examples, namely dashboard

* jumbotron and sign-in fixes

* more fixes

* more

* Fixes from code review

* Remove duplicate `data-bs-target` in dashboard/index.html

* Modify `blog-rtl/index.html`

* Modify `dashboard-rtl/index.html`

* Modify `carousel-rtl/index.html`

* Keep JS on all pages for switcher

* Remove Feather from dashboard examples

---------

Co-authored-by: Julien Déramond <juderamond@gmail.com>
This commit is contained in:
Mark Otto
2023-04-27 18:13:35 -07:00
committed by GitHub
parent 6182c0d962
commit e468daac25
25 changed files with 656 additions and 511 deletions

View File

@@ -1,57 +1,33 @@
body {
font-size: .875rem;
}
.feather {
width: 16px;
height: 16px;
.bi {
display: inline-block;
width: 1rem;
height: 1rem;
}
/*
* Sidebar
*/
.sidebar {
position: fixed;
top: 0;
right: 0;
bottom: 0;
z-index: 100; /* Behind the navbar */
padding: 48px 0 0; /* Height of navbar */
box-shadow: inset 1px 0 0 rgba(0, 0, 0, .1);
}
@media (max-width: 767.98px) {
.sidebar {
top: 5rem;
@media (min-width: 768px) {
.sidebar .offcanvas-lg {
position: -webkit-sticky;
position: sticky;
top: 48px;
}
.navbar-search {
display: block;
}
}
.sidebar-sticky {
height: calc(100vh - 48px);
overflow-x: hidden;
overflow-y: auto; /* Scrollable contents if viewport is shorter than content. */
}
.sidebar .nav-link {
font-size: .875rem;
font-weight: 500;
color: #333;
}
.sidebar .nav-link .feather {
margin-left: 4px;
color: #727272;
}
.sidebar .nav-link.active {
color: #2470dc;
}
.sidebar .nav-link:hover .feather,
.sidebar .nav-link.active .feather {
color: inherit;
}
.sidebar-heading {
font-size: .75rem;
}
@@ -67,22 +43,6 @@ body {
box-shadow: inset 1px 0 0 rgba(0, 0, 0, .25);
}
.navbar .navbar-toggler {
top: .25rem;
left: 1rem;
}
.navbar .form-control {
padding: .75rem 1rem;
}
.form-control-dark {
color: #fff;
background-color: rgba(255, 255, 255, .1);
border-color: rgba(255, 255, 255, .1);
}
.form-control-dark:focus {
border-color: transparent;
box-shadow: 0 0 0 3px rgba(255, 255, 255, .25);
}