From 00c9709fd9763542e848f6278db8ba26af5c9886 Mon Sep 17 00:00:00 2001
From: Max
Date: Mon, 15 Oct 2018 23:46:42 +0200
Subject: Initial commit.
---
src/sass/bootstrap4/_dropdown.scss | 166 +++++++++++++++++++++++++++++++++++++
1 file changed, 166 insertions(+)
create mode 100644 src/sass/bootstrap4/_dropdown.scss
(limited to 'src/sass/bootstrap4/_dropdown.scss')
diff --git a/src/sass/bootstrap4/_dropdown.scss b/src/sass/bootstrap4/_dropdown.scss
new file mode 100644
index 0000000..ee6f658
--- /dev/null
+++ b/src/sass/bootstrap4/_dropdown.scss
@@ -0,0 +1,166 @@
+// The dropdown wrapper (`
`)
+.dropup,
+.dropright,
+.dropdown,
+.dropleft {
+ position: relative;
+}
+
+.dropdown-toggle {
+ // Generate the caret automatically
+ @include caret;
+}
+
+// The dropdown menu
+.dropdown-menu {
+ position: absolute;
+ top: 100%;
+ left: 0;
+ z-index: $zindex-dropdown;
+ display: none; // none by default, but block on "open" of the menu
+ float: left;
+ min-width: $dropdown-min-width;
+ padding: $dropdown-padding-y 0;
+ margin: $dropdown-spacer 0 0; // override default ul
+ font-size: $font-size-base; // Redeclare because nesting can cause inheritance issues
+ color: $body-color;
+ text-align: left; // Ensures proper alignment if parent has it changed (e.g., modal footer)
+ list-style: none;
+ background-color: $dropdown-bg;
+ background-clip: padding-box;
+ border: $dropdown-border-width solid $dropdown-border-color;
+ @include border-radius($dropdown-border-radius);
+ @include box-shadow($dropdown-box-shadow);
+}
+
+.dropdown-menu-right {
+ right: 0;
+ left: auto;
+}
+
+// Allow for dropdowns to go bottom up (aka, dropup-menu)
+// Just add .dropup after the standard .dropdown class and you're set.
+.dropup {
+ .dropdown-menu {
+ top: auto;
+ bottom: 100%;
+ margin-top: 0;
+ margin-bottom: $dropdown-spacer;
+ }
+
+ .dropdown-toggle {
+ @include caret(up);
+ }
+}
+
+.dropright {
+ .dropdown-menu {
+ top: 0;
+ right: auto;
+ left: 100%;
+ margin-top: 0;
+ margin-left: $dropdown-spacer;
+ }
+
+ .dropdown-toggle {
+ @include caret(right);
+ &::after {
+ vertical-align: 0;
+ }
+ }
+}
+
+.dropleft {
+ .dropdown-menu {
+ top: 0;
+ right: 100%;
+ left: auto;
+ margin-top: 0;
+ margin-right: $dropdown-spacer;
+ }
+
+ .dropdown-toggle {
+ @include caret(left);
+ &::before {
+ vertical-align: 0;
+ }
+ }
+}
+
+// When enabled Popper.js, reset basic dropdown position
+// stylelint-disable no-duplicate-selectors
+.dropdown-menu {
+ &[x-placement^="top"],
+ &[x-placement^="right"],
+ &[x-placement^="bottom"],
+ &[x-placement^="left"] {
+ right: auto;
+ bottom: auto;
+ }
+}
+// stylelint-enable no-duplicate-selectors
+
+// Dividers (basically an `
`) within the dropdown
+.dropdown-divider {
+ @include nav-divider($dropdown-divider-bg);
+}
+
+// Links, buttons, and more within the dropdown menu
+//
+// `