Index: lams_central/web/css/bootstrap/_dropdown.scss =================================================================== diff -u -r9f4482aa1d29f454f091420cc38d3b27a3f4cc8f -rb7c92dbcfdb0469dbc0144190a201757f398e529 --- lams_central/web/css/bootstrap/_dropdown.scss (.../_dropdown.scss) (revision 9f4482aa1d29f454f091420cc38d3b27a3f4cc8f) +++ lams_central/web/css/bootstrap/_dropdown.scss (.../_dropdown.scss) (revision b7c92dbcfdb0469dbc0144190a201757f398e529) @@ -2,7 +2,9 @@ .dropup, .dropend, .dropdown, -.dropstart { +.dropstart, +.dropup-center, +.dropdown-center { position: relative; } @@ -15,26 +17,54 @@ // The dropdown menu .dropdown-menu { + // scss-docs-start dropdown-css-vars + --#{$prefix}dropdown-min-width: #{$dropdown-min-width}; + --#{$prefix}dropdown-padding-x: #{$dropdown-padding-x}; + --#{$prefix}dropdown-padding-y: #{$dropdown-padding-y}; + --#{$prefix}dropdown-spacer: #{$dropdown-spacer}; + @include rfs($dropdown-font-size, --#{$prefix}dropdown-font-size); + --#{$prefix}dropdown-color: #{$dropdown-color}; // stylelint-disable-line custom-property-empty-line-before + --#{$prefix}dropdown-bg: #{$dropdown-bg}; + --#{$prefix}dropdown-border-color: #{$dropdown-border-color}; + --#{$prefix}dropdown-border-radius: #{$dropdown-border-radius}; + --#{$prefix}dropdown-border-width: #{$dropdown-border-width}; + --#{$prefix}dropdown-inner-border-radius: #{$dropdown-inner-border-radius}; + --#{$prefix}dropdown-divider-bg: #{$dropdown-divider-bg}; + --#{$prefix}dropdown-divider-margin-y: #{$dropdown-divider-margin-y}; + --#{$prefix}dropdown-box-shadow: #{$dropdown-box-shadow}; + --#{$prefix}dropdown-link-color: #{$dropdown-link-color}; + --#{$prefix}dropdown-link-hover-color: #{$dropdown-link-hover-color}; + --#{$prefix}dropdown-link-hover-bg: #{$dropdown-link-hover-bg}; + --#{$prefix}dropdown-link-active-color: #{$dropdown-link-active-color}; + --#{$prefix}dropdown-link-active-bg: #{$dropdown-link-active-bg}; + --#{$prefix}dropdown-link-disabled-color: #{$dropdown-link-disabled-color}; + --#{$prefix}dropdown-item-padding-x: #{$dropdown-item-padding-x}; + --#{$prefix}dropdown-item-padding-y: #{$dropdown-item-padding-y}; + --#{$prefix}dropdown-header-color: #{$dropdown-header-color}; + --#{$prefix}dropdown-header-padding-x: #{$dropdown-header-padding-x}; + --#{$prefix}dropdown-header-padding-y: #{$dropdown-header-padding-y}; + // scss-docs-end dropdown-css-vars + position: absolute; z-index: $zindex-dropdown; display: none; // none by default, but block on "open" of the menu - min-width: $dropdown-min-width; - padding: $dropdown-padding-y $dropdown-padding-x; + min-width: var(--#{$prefix}dropdown-min-width); + padding: var(--#{$prefix}dropdown-padding-y) var(--#{$prefix}dropdown-padding-x); margin: 0; // Override default margin of ul - @include font-size($dropdown-font-size); - color: $dropdown-color; + @include font-size(var(--#{$prefix}dropdown-font-size)); + color: var(--#{$prefix}dropdown-color); text-align: left; // Ensures proper alignment if parent has it changed (e.g., modal footer) list-style: none; - background-color: $dropdown-bg; + background-color: var(--#{$prefix}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); + border: var(--#{$prefix}dropdown-border-width) solid var(--#{$prefix}dropdown-border-color); + @include border-radius(var(--#{$prefix}dropdown-border-radius)); + @include box-shadow(var(--#{$prefix}dropdown-box-shadow)); &[data-bs-popper] { top: 100%; left: 0; - margin-top: $dropdown-spacer; + margin-top: var(--#{$prefix}dropdown-spacer); } } @@ -74,7 +104,7 @@ top: auto; bottom: 100%; margin-top: 0; - margin-bottom: $dropdown-spacer; + margin-bottom: var(--#{$prefix}dropdown-spacer); } .dropdown-toggle { @@ -88,7 +118,7 @@ right: auto; left: 100%; margin-top: 0; - margin-left: $dropdown-spacer; + margin-left: var(--#{$prefix}dropdown-spacer); } .dropdown-toggle { @@ -105,7 +135,7 @@ right: 100%; left: auto; margin-top: 0; - margin-right: $dropdown-spacer; + margin-right: var(--#{$prefix}dropdown-spacer); } .dropdown-toggle { @@ -120,9 +150,10 @@ // Dividers (basically an `
`) within the dropdown .dropdown-divider { height: 0; - margin: $dropdown-divider-margin-y 0; + margin: var(--#{$prefix}dropdown-divider-margin-y) 0; overflow: hidden; - border-top: 1px solid $dropdown-divider-bg; + border-top: 1px solid var(--#{$prefix}dropdown-divider-bg); + opacity: 1; // Revisit in v6 to de-dupe styles that conflict with
element } // Links, buttons, and more within the dropdown menu @@ -131,10 +162,10 @@ .dropdown-item { display: block; width: 100%; // For `