2
0
mirror of https://github.com/tenrok/vue-select.git synced 2026-06-10 07:52:23 +03:00

Ensure input take available space, but not more.

`flex-grow` will stretch the input to take all remaining space, but We
need to ensure a small amount of space so there's room to type input.
We'll set the input to "hidden" (via width: 0) when the dropdown is
closed, to prevent adding a "blank" line (see:
https://github.com/sagalbot/vue-select/pull/512). In that case, the
flex-grow will still stretch the input to take any available space, on
the same "line."

This really needs https://github.com/sagalbot/vue-select/pull/512 to
work best.
This commit is contained in:
Steven Harman
2018-07-18 12:56:22 -04:00
parent a5555a6c6a
commit 34df80314e
+10 -1
View File
@@ -210,11 +210,20 @@
outline: none;
margin: 0;
padding: 0 .5em;
width: 10em;
max-width: 100%;
background: none;
position: relative;
box-shadow: none;
/* `flex-grow` will stretch the input to take all remaining space, but We
need to ensure a small amount of space so there's room to type input. We'll
set the input to "hidden" (via width: 0) when the dropdown is closed, to
prevent adding a "blank" line (see: https://github.com/sagalbot/vue-select/pull/512).
In that case, the flex-grow will still stretch the input to take any
available space, on the same "line."
*/
flex-grow: 1;
width: 4em;
}
.v-select.unsearchable input[type="search"] {
opacity: 0;