snappymail/vendors/bootstrap/less/dropdowns.less
djmaze b6d8fa5b3f Split admin css from app.css
Cleanup normalize and bootstrap css
Removed almost all css float
Removed CKEditor from app.css
2021-02-18 21:06:19 +01:00

107 lines
2.2 KiB
Text

//
// Dropdown menus
// --------------------------------------------------
// Use the .menu class on any <li> element within the topbar or ul.tabs and you'll get some superfancy dropdowns
.dropdown {
position: relative;
}
.dropdown-toggle:active,
.open .dropdown-toggle {
outline: 0;
}
// Dropdown arrow/caret
// --------------------
.caret {
display: inline-block;
width: 0;
height: 0;
vertical-align: top;
border: 4px solid transparent;
border-top-color: @black;
}
// Place the caret
.dropdown .caret {
margin-top: 8px;
margin-left: 2px;
}
// The dropdown menu (ul)
// ----------------------
.dropdown-menu {
position: absolute;
top: 100%;
left: 0;
z-index: @zindexDropdown;
display: none; // none by default, but block on "open" of the menu
min-width: 160px;
padding: 5px 0;
margin: 2px 0 0; // override default ul
list-style: none;
color: var(--dropdown-menu-color, inherit);
background-color: var(--dropdown-menu-background-color, @dropdownBackground);
border: 1px solid @dropdownBorder;
box-shadow: 0 1px 2px rgba(0,0,0,0.2);
background-clip: padding-box;
// Aligns the dropdown menu to right
&.right-edge {
right: 0;
left: auto;
}
// Links within the dropdown menu
a {
display: block;
padding: 3px 10px;
clear: both;
font-weight: normal;
line-height: @baseLineHeight;
color: @dropdownLinkColor;
white-space: nowrap;
}
}
// Hover state
// -----------
.dropdown-menu li > a:hover,
.dropdown-menu li > a:focus {
text-decoration: none;
color: @dropdownLinkColorHover;
background-color: @dropdownLinkBackgroundHover;
}
// Active state
// ------------
.dropdown-menu .active > a,
.dropdown-menu .active > a:hover {
color: @dropdownLinkColorHover;
text-decoration: none;
outline: 0;
background-color: @dropdownLinkBackgroundActive;
}
// Disabled state
// --------------
// Gray out text and ensure the hover state remains gray
.dropdown-menu .disabled > a,
.dropdown-menu .disabled > a:hover {
color: @grayLight;
}
// Nuke hover effects
.dropdown-menu .disabled > a:hover {
text-decoration: none;
background-color: transparent;
cursor: default;
}
// Open state for the dropdown
// ---------------------------
.open {
& > .dropdown-menu {
display: block;
}
}