mirror of
https://github.com/tenrok/vue-select.git
synced 2026-06-22 10:30:34 +03:00
Give actions full height, but center them visually
Meaning the are larger click targets, but still centered in the box.
This commit is contained in:
@@ -30,13 +30,13 @@
|
|||||||
|
|
||||||
/* Open Indicator */
|
/* Open Indicator */
|
||||||
.v-select .open-indicator {
|
.v-select .open-indicator {
|
||||||
display: inline-block;
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
cursor: pointer;
|
cursor: pointer;
|
||||||
pointer-events: all;
|
pointer-events: all;
|
||||||
transition: all 150ms cubic-bezier(1.000, -0.115, 0.975, 0.855);
|
transition: all 150ms cubic-bezier(1.000, -0.115, 0.975, 0.855);
|
||||||
transition-timing-function: cubic-bezier(1.000, -0.115, 0.975, 0.855);
|
transition-timing-function: cubic-bezier(1.000, -0.115, 0.975, 0.855);
|
||||||
opacity: 1;
|
opacity: 1;
|
||||||
height: 16px;
|
|
||||||
width: 12px; /* To account for extra width from rotating. */
|
width: 12px; /* To account for extra width from rotating. */
|
||||||
}
|
}
|
||||||
.v-select .open-indicator:before {
|
.v-select .open-indicator:before {
|
||||||
@@ -60,9 +60,6 @@
|
|||||||
.v-select.loading .open-indicator {
|
.v-select.loading .open-indicator {
|
||||||
opacity: 0;
|
opacity: 0;
|
||||||
}
|
}
|
||||||
.v-select.open .open-indicator {
|
|
||||||
bottom: 1px;
|
|
||||||
}
|
|
||||||
|
|
||||||
/* Dropdown Toggle */
|
/* Dropdown Toggle */
|
||||||
.v-select .dropdown-toggle {
|
.v-select .dropdown-toggle {
|
||||||
@@ -93,7 +90,7 @@
|
|||||||
}
|
}
|
||||||
.v-select .v-select__actions {
|
.v-select .v-select__actions {
|
||||||
display: flex;
|
display: flex;
|
||||||
align-items: center;
|
align-items: stretch;
|
||||||
padding: 0 4px 0 3px;
|
padding: 0 4px 0 3px;
|
||||||
}
|
}
|
||||||
|
|
||||||
@@ -268,6 +265,7 @@
|
|||||||
}
|
}
|
||||||
/* Loading Spinner */
|
/* Loading Spinner */
|
||||||
.v-select .spinner {
|
.v-select .spinner {
|
||||||
|
align-self: center;
|
||||||
opacity: 0;
|
opacity: 0;
|
||||||
font-size: 5px;
|
font-size: 5px;
|
||||||
text-indent: -9999em;
|
text-indent: -9999em;
|
||||||
|
|||||||
Reference in New Issue
Block a user