2
0
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:
Steven Harman
2018-07-18 16:01:58 -04:00
parent 746ea25ac9
commit 22449bc3f2
+4 -6
View File
@@ -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;