VCombobox.css 2.6 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677787980818283848586
  1. .v-combobox .v-field .v-text-field__prefix,
  2. .v-combobox .v-field .v-text-field__suffix,
  3. .v-combobox .v-field .v-field__input, .v-combobox .v-field.v-field {
  4. cursor: text;
  5. }
  6. .v-combobox .v-field .v-field__input > input {
  7. flex: 1 1;
  8. }
  9. .v-combobox .v-field input {
  10. min-width: 64px;
  11. }
  12. .v-combobox .v-field:not(.v-field--focused) input {
  13. min-width: 0;
  14. }
  15. .v-combobox .v-field--dirty .v-combobox__selection {
  16. margin-inline-end: 2px;
  17. }
  18. .v-combobox .v-combobox__selection-text {
  19. overflow: hidden;
  20. text-overflow: ellipsis;
  21. white-space: nowrap;
  22. }
  23. .v-combobox__content {
  24. overflow: hidden;
  25. }
  26. .v-combobox__content {
  27. box-shadow: 0px 2px 4px -1px var(--v-shadow-key-umbra-opacity, rgba(0, 0, 0, 0.2)), 0px 4px 5px 0px var(--v-shadow-key-penumbra-opacity, rgba(0, 0, 0, 0.14)), 0px 1px 10px 0px var(--v-shadow-key-ambient-opacity, rgba(0, 0, 0, 0.12));
  28. }
  29. .v-combobox__content {
  30. border-radius: 4px;
  31. }
  32. .v-combobox__mask {
  33. background: rgb(var(--v-theme-surface-light));
  34. }
  35. .v-combobox__selection {
  36. display: inline-flex;
  37. align-items: center;
  38. height: 1.5rem;
  39. letter-spacing: inherit;
  40. line-height: inherit;
  41. max-width: calc(100% - 2px - 2px);
  42. }
  43. .v-combobox__selection:first-child {
  44. margin-inline-start: 0;
  45. }
  46. .v-combobox--chips.v-input--density-compact .v-field--variant-solo .v-label.v-field-label--floating,
  47. .v-combobox--chips.v-input--density-compact .v-field--variant-solo-inverted .v-label.v-field-label--floating,
  48. .v-combobox--chips.v-input--density-compact .v-field--variant-filled .v-label.v-field-label--floating,
  49. .v-combobox--chips.v-input--density-compact .v-field--variant-solo-filled .v-label.v-field-label--floating {
  50. top: 0px;
  51. }
  52. .v-combobox--selecting-index .v-combobox__selection {
  53. opacity: var(--v-medium-emphasis-opacity);
  54. }
  55. .v-combobox--selecting-index .v-combobox__selection--selected {
  56. opacity: 1;
  57. }
  58. .v-combobox--selecting-index .v-field__input > input {
  59. caret-color: transparent;
  60. }
  61. .v-combobox--single:not(.v-combobox--selection-slot).v-text-field input {
  62. flex: 1 1;
  63. position: absolute;
  64. left: 0;
  65. right: 0;
  66. width: 100%;
  67. padding-inline: inherit;
  68. }
  69. .v-combobox--single:not(.v-combobox--selection-slot) .v-field--active input {
  70. transition: none;
  71. }
  72. .v-combobox--single:not(.v-combobox--selection-slot) .v-field--dirty:not(.v-field--focused) input {
  73. opacity: 0;
  74. }
  75. .v-combobox--single:not(.v-combobox--selection-slot) .v-field--focused .v-combobox__selection {
  76. opacity: 0;
  77. }
  78. .v-combobox__menu-icon {
  79. margin-inline-start: 4px;
  80. transition: 0.2s cubic-bezier(0.4, 0, 0.2, 1);
  81. }
  82. .v-combobox--active-menu .v-combobox__menu-icon {
  83. opacity: var(--v-high-emphasis-opacity);
  84. transform: rotate(180deg);
  85. }