2
0
mirror of https://github.com/tenrok/vue-select.git synced 2026-05-26 04:34:04 +03:00

convert to css custom properties

This commit is contained in:
Jeff Sagal
2021-10-19 21:25:09 -07:00
parent 6798658100
commit 6d30cf21db
16 changed files with 309 additions and 590 deletions
+21 -31
View File
@@ -1,38 +1,28 @@
/* Dropdown Menu */
$border-width: $vs-border-width;
$border-style: solid;
$border-color: $vs-border-color;
$border-radius: $vs-border-radius;
$box-shadow: $vs-dropdown-box-shadow;
$bg-color: $vs-dropdown-bg;
$z-index: $vs-dropdown-z-index;
$min-width: $vs-dropdown-min-width;
$max-height: $vs-dropdown-max-height;
.vs__dropdown-menu {
display: block;
box-sizing: border-box;
position: absolute;
top: calc(100% - #{$border-width}); // -{#$border-width} here ensures the left and right borders of the dropdown appear flush with the toggle.
left: 0;
z-index: $z-index;
padding: 5px 0;
margin: 0;
width: 100%;
max-height: $max-height;
min-width: $min-width;
overflow-y: auto;
box-shadow: $box-shadow;
border: $border-width $border-style $border-color;
border-top-style: none;
border-radius: 0 0 $border-radius $border-radius;
text-align: left;
list-style: none;
background: $bg-color;
display: block;
box-sizing: border-box;
position: absolute;
// -{#$border-width} here ensures the left and right borders of the dropdown appear flush with the toggle.
top: calc(100% - var(--vs-border-width));
left: 0;
z-index: var(--vs-dropdown-z-index);
padding: 5px 0;
margin: 0;
width: 100%;
max-height: var(--vs-dropdown-max-height);
min-width: var(--vs-dropdown-min-width);
overflow-y: auto;
box-shadow: var(--vs-dropdown-box-shadow);
border: var(--vs-border-width) var(--vs-border-style) var(--vs-border-color);
border-top-style: none;
border-radius: 0 0 var(--vs-border-radius) var(--vs-border-radius);
text-align: left;
list-style: none;
background: var(--vs-dropdown-bg);
}
.vs__no-options {
text-align: center;
text-align: center;
}