Back to home page

EIC code displayed by LXR

 
 

    


Warning, /iDDS/monitor/data/scss/bootstrap/_dropdown.scss is written in an unsupported language. File is not indexed.

0001 // The dropdown wrapper (`<div>`)
0002 .dropup,
0003 .dropend,
0004 .dropdown,
0005 .dropstart {
0006   position: relative;
0007 }
0008 
0009 .dropdown-toggle {
0010   white-space: nowrap;
0011 
0012   // Generate the caret automatically
0013   @include caret();
0014 }
0015 
0016 // The dropdown menu
0017 .dropdown-menu {
0018   position: absolute;
0019   top: 100%;
0020   left: 0;
0021   z-index: $zindex-dropdown;
0022   display: none; // none by default, but block on "open" of the menu
0023   min-width: $dropdown-min-width;
0024   padding: $dropdown-padding-y $dropdown-padding-x;
0025   margin: $dropdown-spacer 0 0; // override default ul
0026   @include font-size($dropdown-font-size);
0027   color: $dropdown-color;
0028   text-align: left; // Ensures proper alignment if parent has it changed (e.g., modal footer)
0029   list-style: none;
0030   background-color: $dropdown-bg;
0031   background-clip: padding-box;
0032   border: $dropdown-border-width solid $dropdown-border-color;
0033   @include border-radius($dropdown-border-radius);
0034   @include box-shadow($dropdown-box-shadow);
0035 
0036   // Reset positioning when positioned with Popper
0037   &[style] {
0038     right: auto !important; // stylelint-disable-line declaration-no-important
0039   }
0040 }
0041 
0042 // scss-docs-start responsive-breakpoints
0043 // We deliberately hardcode the `bs-` prefix because we check
0044 // this custom property in JS to determine Popper's positioning
0045 
0046 @each $breakpoint in map-keys($grid-breakpoints) {
0047   @include media-breakpoint-up($breakpoint) {
0048     $infix: breakpoint-infix($breakpoint, $grid-breakpoints);
0049 
0050     .dropdown-menu#{$infix}-start {
0051       --bs-position: start;
0052       right: auto #{"/* rtl:ignore */"};
0053       left: 0 #{"/* rtl:ignore */"};
0054     }
0055 
0056     .dropdown-menu#{$infix}-end {
0057       --bs-position: end;
0058       right: 0 #{"/* rtl:ignore */"};
0059       left: auto #{"/* rtl:ignore */"};
0060     }
0061   }
0062 }
0063 // scss-docs-end responsive-breakpoints
0064 
0065 // Allow for dropdowns to go bottom up (aka, dropup-menu)
0066 // Just add .dropup after the standard .dropdown class and you're set.
0067 .dropup {
0068   .dropdown-menu {
0069     top: auto;
0070     bottom: 100%;
0071     margin-top: 0;
0072     margin-bottom: $dropdown-spacer;
0073   }
0074 
0075   .dropdown-toggle {
0076     @include caret(up);
0077   }
0078 }
0079 
0080 .dropend {
0081   .dropdown-menu {
0082     top: 0;
0083     right: auto;
0084     left: 100%;
0085     margin-top: 0;
0086     margin-left: $dropdown-spacer;
0087   }
0088 
0089   .dropdown-toggle {
0090     @include caret(end);
0091     &::after {
0092       vertical-align: 0;
0093     }
0094   }
0095 }
0096 
0097 .dropstart {
0098   .dropdown-menu {
0099     top: 0;
0100     right: 100%;
0101     left: auto;
0102     margin-top: 0;
0103     margin-right: $dropdown-spacer;
0104   }
0105 
0106   .dropdown-toggle {
0107     @include caret(start);
0108     &::before {
0109       vertical-align: 0;
0110     }
0111   }
0112 }
0113 
0114 
0115 // Dividers (basically an `<hr>`) within the dropdown
0116 .dropdown-divider {
0117   height: 0;
0118   margin: $dropdown-divider-margin-y 0;
0119   overflow: hidden;
0120   border-top: 1px solid $dropdown-divider-bg;
0121 }
0122 
0123 // Links, buttons, and more within the dropdown menu
0124 //
0125 // `<button>`-specific styles are denoted with `// For <button>s`
0126 .dropdown-item {
0127   display: block;
0128   width: 100%; // For `<button>`s
0129   padding: $dropdown-item-padding-y $dropdown-item-padding-x;
0130   clear: both;
0131   font-weight: $font-weight-normal;
0132   color: $dropdown-link-color;
0133   text-align: inherit; // For `<button>`s
0134   text-decoration: if($link-decoration == none, null, none);
0135   white-space: nowrap; // prevent links from randomly breaking onto new lines
0136   background-color: transparent; // For `<button>`s
0137   border: 0; // For `<button>`s
0138 
0139   // Prevent dropdown overflow if there's no padding
0140   // See https://github.com/twbs/bootstrap/pull/27703
0141   @if $dropdown-padding-y == 0 {
0142     &:first-child {
0143       @include border-top-radius($dropdown-inner-border-radius);
0144     }
0145 
0146     &:last-child {
0147       @include border-bottom-radius($dropdown-inner-border-radius);
0148     }
0149   }
0150 
0151   &:hover,
0152   &:focus {
0153     color: $dropdown-link-hover-color;
0154     text-decoration: if($link-hover-decoration == underline, none, null);
0155     @include gradient-bg($dropdown-link-hover-bg);
0156   }
0157 
0158   &.active,
0159   &:active {
0160     color: $dropdown-link-active-color;
0161     text-decoration: none;
0162     @include gradient-bg($dropdown-link-active-bg);
0163   }
0164 
0165   &.disabled,
0166   &:disabled {
0167     color: $dropdown-link-disabled-color;
0168     pointer-events: none;
0169     background-color: transparent;
0170     // Remove CSS gradients if they're enabled
0171     background-image: if($enable-gradients, none, null);
0172   }
0173 }
0174 
0175 .dropdown-menu.show {
0176   display: block;
0177 }
0178 
0179 // Dropdown section headers
0180 .dropdown-header {
0181   display: block;
0182   padding: $dropdown-header-padding;
0183   margin-bottom: 0; // for use with heading elements
0184   @include font-size($font-size-sm);
0185   color: $dropdown-header-color;
0186   white-space: nowrap; // as with > li > a
0187 }
0188 
0189 // Dropdown text
0190 .dropdown-item-text {
0191   display: block;
0192   padding: $dropdown-item-padding-y $dropdown-item-padding-x;
0193   color: $dropdown-link-color;
0194 }
0195 
0196 // Dark dropdowns
0197 .dropdown-menu-dark {
0198   color: $dropdown-dark-color;
0199   background-color: $dropdown-dark-bg;
0200   border-color: $dropdown-dark-border-color;
0201   @include box-shadow($dropdown-dark-box-shadow);
0202 
0203   .dropdown-item {
0204     color: $dropdown-dark-link-color;
0205 
0206     &:hover,
0207     &:focus {
0208       color: $dropdown-dark-link-hover-color;
0209       @include gradient-bg($dropdown-dark-link-hover-bg);
0210     }
0211 
0212     &.active,
0213     &:active {
0214       color: $dropdown-dark-link-active-color;
0215       @include gradient-bg($dropdown-dark-link-active-bg);
0216     }
0217 
0218     &.disabled,
0219     &:disabled {
0220       color: $dropdown-dark-link-disabled-color;
0221     }
0222   }
0223 
0224   .dropdown-divider {
0225     border-color: $dropdown-dark-divider-bg;
0226   }
0227 
0228   .dropdown-item-text {
0229     color: $dropdown-dark-link-color;
0230   }
0231 
0232   .dropdown-header {
0233     color: $dropdown-dark-header-color;
0234   }
0235 }