mirror of
https://github.com/twbs/bootstrap.git
synced 2025-08-22 21:22:52 +02:00
Add v4.6.0 docs
This commit is contained in:
76
docs/4.6/examples/offcanvas/offcanvas.css
Normal file
76
docs/4.6/examples/offcanvas/offcanvas.css
Normal file
@@ -0,0 +1,76 @@
|
||||
html,
|
||||
body {
|
||||
overflow-x: hidden; /* Prevent scroll on narrow devices */
|
||||
}
|
||||
|
||||
body {
|
||||
padding-top: 56px;
|
||||
}
|
||||
|
||||
@media (max-width: 991.98px) {
|
||||
.offcanvas-collapse {
|
||||
position: fixed;
|
||||
top: 56px; /* Height of navbar */
|
||||
bottom: 0;
|
||||
left: 100%;
|
||||
width: 100%;
|
||||
padding-right: 1rem;
|
||||
padding-left: 1rem;
|
||||
overflow-y: auto;
|
||||
visibility: hidden;
|
||||
background-color: #343a40;
|
||||
transition: visibility .3s ease-in-out, -webkit-transform .3s ease-in-out;
|
||||
transition: transform .3s ease-in-out, visibility .3s ease-in-out;
|
||||
transition: transform .3s ease-in-out, visibility .3s ease-in-out, -webkit-transform .3s ease-in-out;
|
||||
}
|
||||
.offcanvas-collapse.open {
|
||||
visibility: visible;
|
||||
-webkit-transform: translateX(-100%);
|
||||
transform: translateX(-100%);
|
||||
}
|
||||
}
|
||||
|
||||
.nav-scroller {
|
||||
position: relative;
|
||||
z-index: 2;
|
||||
height: 2.75rem;
|
||||
overflow-y: hidden;
|
||||
}
|
||||
|
||||
.nav-scroller .nav {
|
||||
display: -ms-flexbox;
|
||||
display: flex;
|
||||
-ms-flex-wrap: nowrap;
|
||||
flex-wrap: nowrap;
|
||||
padding-bottom: 1rem;
|
||||
margin-top: -1px;
|
||||
overflow-x: auto;
|
||||
color: rgba(255, 255, 255, .75);
|
||||
text-align: center;
|
||||
white-space: nowrap;
|
||||
-webkit-overflow-scrolling: touch;
|
||||
}
|
||||
|
||||
.nav-underline .nav-link {
|
||||
padding-top: .75rem;
|
||||
padding-bottom: .75rem;
|
||||
font-size: .875rem;
|
||||
color: #6c757d;
|
||||
}
|
||||
|
||||
.nav-underline .nav-link:hover {
|
||||
color: #007bff;
|
||||
}
|
||||
|
||||
.nav-underline .active {
|
||||
font-weight: 500;
|
||||
color: #343a40;
|
||||
}
|
||||
|
||||
.text-white-50 { color: rgba(255, 255, 255, .5); }
|
||||
|
||||
.bg-purple { background-color: #6f42c1; }
|
||||
|
||||
.lh-100 { line-height: 1; }
|
||||
.lh-125 { line-height: 1.25; }
|
||||
.lh-150 { line-height: 1.5; }
|
Reference in New Issue
Block a user