style.css 5.6 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193
  1. /*font*/
  2. /*size*/
  3. /*icon*/
  4. /*color*/
  5. /*input/radio/checkbox*/
  6. /*popup*/
  7. /*table*/
  8. /*filter*/
  9. /*menu*/
  10. /*loading*/
  11. /*validate*/
  12. /*grid*/
  13. /*toolbar*/
  14. /*tooltip*/
  15. /*pager*/
  16. /*modal*/
  17. /*checkbox*/
  18. /*radio*/
  19. /*button*/
  20. /*input*/
  21. /*textarea*/
  22. /*form*/
  23. /*select*/
  24. /*switch*/
  25. /*pulldown*/
  26. .vxe-select {
  27. position: relative;
  28. display: inline-block;
  29. width: 180px;
  30. color: #606266;
  31. text-align: left; }
  32. .vxe-select > .vxe-input .vxe-input--inner {
  33. cursor: pointer; }
  34. .vxe-select.is--disabled > .vxe-input .vxe-input--inner {
  35. cursor: no-drop; }
  36. .vxe-select.is--loading > .vxe-input .vxe-input--inner {
  37. cursor: progress; }
  38. .vxe-select > .vxe-input {
  39. width: 100%; }
  40. .vxe-select > .vxe-input .vxe-input--suffix-icon {
  41. display: inline-block;
  42. -webkit-transition: -webkit-transform 0.2s ease-in-out;
  43. transition: -webkit-transform 0.2s ease-in-out;
  44. transition: transform 0.2s ease-in-out;
  45. transition: transform 0.2s ease-in-out, -webkit-transform 0.2s ease-in-out; }
  46. .vxe-select.is--active:not(.is--filter) > .vxe-input .vxe-input--inner {
  47. border: 1px solid #409eff; }
  48. .vxe-select-slots {
  49. display: none; }
  50. .vxe-select--panel {
  51. display: none;
  52. position: absolute;
  53. left: 0;
  54. padding: 4px 0;
  55. color: #606266;
  56. text-align: left; }
  57. .vxe-select--panel:not(.is--transfer) {
  58. min-width: 100%; }
  59. .vxe-select--panel.is--transfer {
  60. position: fixed; }
  61. .vxe-select--panel.animat--leave {
  62. display: block;
  63. opacity: 0;
  64. -webkit-transform: scaleY(0.5);
  65. transform: scaleY(0.5);
  66. -webkit-transition: opacity 0.3s cubic-bezier(0.23, 1, 0.32, 1), -webkit-transform 0.3s cubic-bezier(0.23, 1, 0.32, 1);
  67. transition: opacity 0.3s cubic-bezier(0.23, 1, 0.32, 1), -webkit-transform 0.3s cubic-bezier(0.23, 1, 0.32, 1);
  68. transition: transform 0.3s cubic-bezier(0.23, 1, 0.32, 1), opacity 0.3s cubic-bezier(0.23, 1, 0.32, 1);
  69. transition: transform 0.3s cubic-bezier(0.23, 1, 0.32, 1), opacity 0.3s cubic-bezier(0.23, 1, 0.32, 1), -webkit-transform 0.3s cubic-bezier(0.23, 1, 0.32, 1);
  70. -webkit-transform-origin: center top;
  71. transform-origin: center top;
  72. -webkit-backface-visibility: hidden;
  73. backface-visibility: hidden;
  74. -webkit-transform-style: preserve-3d;
  75. transform-style: preserve-3d; }
  76. .vxe-select--panel.animat--leave[placement="top"] {
  77. -webkit-transform-origin: center bottom;
  78. transform-origin: center bottom; }
  79. .vxe-select--panel.animat--enter {
  80. opacity: 1;
  81. -webkit-transform: scaleY(1);
  82. transform: scaleY(1); }
  83. .vxe-select-filter--wrapper {
  84. display: block; }
  85. .vxe-select-filter--wrapper .vxe-select-filter--input {
  86. width: 100%; }
  87. .vxe-select-option--wrapper {
  88. position: relative;
  89. overflow-x: hidden;
  90. overflow-y: auto;
  91. padding: 4px 0;
  92. max-height: 200px;
  93. border-radius: 4px;
  94. border: 1px solid #DADCE0;
  95. -webkit-box-shadow: 0 0 6px 2px rgba(0, 0, 0, 0.1);
  96. box-shadow: 0 0 6px 2px rgba(0, 0, 0, 0.1);
  97. background-color: #fff; }
  98. .vxe-optgroup .vxe-optgroup--title {
  99. padding: 0 6px;
  100. color: #909399;
  101. font-size: 12px; }
  102. .vxe-optgroup--wrapper .vxe-select-option {
  103. padding: 0 20px; }
  104. .vxe-select-option {
  105. padding: 0 0.6em;
  106. max-width: 600px;
  107. white-space: nowrap;
  108. overflow: hidden;
  109. text-overflow: ellipsis;
  110. white-space: nowrap;
  111. -webkit-user-select: none;
  112. -moz-user-select: none;
  113. -ms-user-select: none;
  114. user-select: none; }
  115. .vxe-select-option.is--selected {
  116. font-weight: 700;
  117. color: #409eff; }
  118. .vxe-select-option:not(.is--disabled) {
  119. cursor: pointer; }
  120. .vxe-select-option:not(.is--disabled).is--hover {
  121. background-color: #f5f7fa; }
  122. .vxe-select-option.is--disabled {
  123. color: #BFBFBF;
  124. cursor: no-drop; }
  125. .vxe-select--search-icon {
  126. margin-right: 0.5em; }
  127. .vxe-select--search-loading,
  128. .vxe-select--empty-placeholder {
  129. padding: 0 0.6em;
  130. text-align: center;
  131. color: #C0C4CC; }
  132. .vxe-select,
  133. .vxe-select--panel {
  134. font-size: 14px; }
  135. .vxe-select.size--medium,
  136. .vxe-select--panel.size--medium {
  137. font-size: 14px; }
  138. .vxe-select.size--small,
  139. .vxe-select--panel.size--small {
  140. font-size: 13px; }
  141. .vxe-select.size--mini,
  142. .vxe-select--panel.size--mini {
  143. font-size: 12px; }
  144. .vxe-select--panel .vxe-optgroup--title,
  145. .vxe-select--panel .vxe-select-option {
  146. height: 30px; }
  147. .vxe-select--panel .vxe-optgroup--title,
  148. .vxe-select--panel .vxe-select-option,
  149. .vxe-select--panel .vxe-select--search-loading,
  150. .vxe-select--panel .vxe-select--empty-placeholder {
  151. line-height: 30px; }
  152. .vxe-select--panel.size--medium .vxe-optgroup--title,
  153. .vxe-select--panel.size--medium .vxe-select-option {
  154. height: 28px; }
  155. .vxe-select--panel.size--medium .vxe-optgroup--title,
  156. .vxe-select--panel.size--medium .vxe-select-option,
  157. .vxe-select--panel.size--medium .vxe-select--search-loading,
  158. .vxe-select--panel.size--medium .vxe-select--empty-placeholder {
  159. line-height: 28px; }
  160. .vxe-select--panel.size--small .vxe-optgroup--title,
  161. .vxe-select--panel.size--small .vxe-select-option {
  162. height: 26px; }
  163. .vxe-select--panel.size--small .vxe-optgroup--title,
  164. .vxe-select--panel.size--small .vxe-select-option,
  165. .vxe-select--panel.size--small .vxe-select--search-loading,
  166. .vxe-select--panel.size--small .vxe-select--empty-placeholder {
  167. line-height: 26px; }
  168. .vxe-select--panel.size--mini .vxe-optgroup--title,
  169. .vxe-select--panel.size--mini .vxe-select-option {
  170. height: 24px; }
  171. .vxe-select--panel.size--mini .vxe-optgroup--title,
  172. .vxe-select--panel.size--mini .vxe-select-option,
  173. .vxe-select--panel.size--mini .vxe-select--search-loading,
  174. .vxe-select--panel.size--mini .vxe-select--empty-placeholder {
  175. line-height: 24px; }