aboutsummaryrefslogtreecommitdiff
path: root/site/content/docs/examples/offcanvas/offcanvas.css
diff options
context:
space:
mode:
authorXhmikosR <[email protected]>2019-08-01 18:07:17 +0300
committerXhmikosR <[email protected]>2021-01-18 22:52:38 +0200
commit72d7e4612bc97230e2c1da0d5e2229ec21793e51 (patch)
tree49e1aa85f43a1641973ac5dd614d066bb0c871af /site/content/docs/examples/offcanvas/offcanvas.css
parent4167c107f81aeb2b05e3fe3e2e511b50ea9be640 (diff)
downloadbootstrap-main-xmr-hugo-reorg-files.tar.xz
bootstrap-main-xmr-hugo-reorg-files.zip
Trying to get rid of the version number from folders.main-xmr-hugo-reorg-files
Diffstat (limited to 'site/content/docs/examples/offcanvas/offcanvas.css')
-rw-r--r--site/content/docs/examples/offcanvas/offcanvas.css67
1 files changed, 67 insertions, 0 deletions
diff --git a/site/content/docs/examples/offcanvas/offcanvas.css b/site/content/docs/examples/offcanvas/offcanvas.css
new file mode 100644
index 000000000..29e26b11b
--- /dev/null
+++ b/site/content/docs/examples/offcanvas/offcanvas.css
@@ -0,0 +1,67 @@
+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: transform .3s ease-in-out, visibility .3s ease-in-out;
+ }
+ .offcanvas-collapse.open {
+ visibility: visible;
+ transform: translateX(-100%);
+ }
+}
+
+.nav-scroller {
+ position: relative;
+ z-index: 2;
+ height: 2.75rem;
+ overflow-y: hidden;
+}
+
+.nav-scroller .nav {
+ display: flex;
+ 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; }