mirror of https://github.com/rancher/ui.git
89 lines
1.7 KiB
SCSS
89 lines
1.7 KiB
SCSS
// The dropdown wrapper (div)
|
|
.dropup,
|
|
.dropdown {
|
|
position: relative;
|
|
}
|
|
|
|
// The dropdown menu (ul)
|
|
.dropdown-menu {
|
|
position: absolute;
|
|
top: 100%;
|
|
left: 0;
|
|
display: none; // none by default, but block on "open" of the menu
|
|
float: left;
|
|
min-width: 160px;
|
|
padding: 5px 0;
|
|
margin: 2px 0 0; // override default ul
|
|
list-style: none;
|
|
text-align: left; // Ensures proper alignment if parent has it changed (e.g., modal footer)
|
|
background-color: $light-grey;
|
|
border: 1px solid $light-grey; // IE8 fallback
|
|
border: 1px solid $light-grey;
|
|
background-clip: padding-box;
|
|
|
|
// Links within the dropdown menu
|
|
> li > a {
|
|
display: block;
|
|
padding: 3px 20px;
|
|
clear: both;
|
|
font-weight: normal;
|
|
color: $primary;
|
|
white-space: nowrap; // prevent links from randomly breaking onto new lines
|
|
}
|
|
}
|
|
|
|
// Hover/Focus state
|
|
.dropdown-menu > li > a {
|
|
&:hover,
|
|
&:focus {
|
|
text-decoration: none;
|
|
color: $primary;
|
|
background-color: $primary;
|
|
}
|
|
}
|
|
|
|
// Active state
|
|
.dropdown-menu > .active > a {
|
|
&,
|
|
&:hover,
|
|
&:focus {
|
|
color: $secondary;
|
|
text-decoration: none;
|
|
outline: 0;
|
|
background-color: $mid-grey;
|
|
}
|
|
}
|
|
|
|
// Disabled state
|
|
//
|
|
// Gray out text and ensure the hover/focus state remains gray
|
|
|
|
.dropdown-menu > .disabled > a {
|
|
&,
|
|
&:hover,
|
|
&:focus {
|
|
color: $mid-grey;
|
|
}
|
|
|
|
// Nuke hover/focus effects
|
|
&:hover,
|
|
&:focus {
|
|
text-decoration: none;
|
|
background-color: transparent;
|
|
// cursor: @cursor-disabled;
|
|
}
|
|
}
|
|
|
|
// // Open state for the dropdown
|
|
// .open {
|
|
// // Show the menu
|
|
// > .dropdown-menu {
|
|
// display: block;
|
|
// }
|
|
|
|
// // Remove the outline when :focus is triggered
|
|
// > a {
|
|
// outline: 0;
|
|
// }
|
|
// }
|