f192d97ba0db39f80d11e4c7558f6fe6995833c5.svn-base 6.7 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332
  1. .j-vxe-table-box {
  2. @height: 24px;
  3. @lineHeight: 1.5;
  4. @spacing: 4px;
  5. @fontSize: 14px;
  6. @borderRadius: 2px;
  7. &.size--tiny {
  8. .vxe-table--header .vxe-cell--checkbox {
  9. position: relative;
  10. top: 2px;
  11. right: 1px;
  12. }
  13. .vxe-table--body .vxe-cell--checkbox {
  14. line-height: 2;
  15. }
  16. .vxe-cell {
  17. padding: 0 5px;
  18. font-size: @fontSize;
  19. line-height: @lineHeight;
  20. }
  21. .vxe-table .vxe-header--column .vxe-cell {
  22. font-size: 12px;
  23. }
  24. .vxe-body--column.col--actived {
  25. padding: 0;
  26. .vxe-cell {
  27. padding: 0;
  28. }
  29. }
  30. // ant输入框
  31. .ant-input,
  32. // ant下拉框
  33. .ant-select-selection {
  34. padding: 2px @spacing;
  35. height: @height;
  36. font-size: @fontSize;
  37. border-radius: @borderRadius;
  38. line-height: @lineHeight;
  39. }
  40. // 输入框图标对齐
  41. .ant-input-affix-wrapper {
  42. & .ant-input-prefix {
  43. left: 4px;
  44. }
  45. & .ant-input:not(:first-child) {
  46. padding-left: 20px;
  47. }
  48. }
  49. // 按钮 addon
  50. .ant-input-group-addon {
  51. border-color: transparent;
  52. border-radius: @borderRadius;
  53. }
  54. // ant下拉多选框
  55. .ant-select-selection--multiple {
  56. min-height: @height;
  57. & .ant-select-selection__rendered > ul > li {
  58. height: calc(@height - 6px);
  59. font-size: calc(@fontSize - 2px);
  60. margin-top: 0;
  61. line-height: @lineHeight;
  62. padding: 0 18px 0 4px;
  63. }
  64. & .ant-select-selection__clear,
  65. & .ant-select-arrow {
  66. top: 12px;
  67. }
  68. }
  69. // ant按钮
  70. .ant-upload {
  71. width: 100%;
  72. .ant-btn {
  73. width: 100%;
  74. height: @height;
  75. padding: 0 8px;
  76. font-size: @fontSize;
  77. border-color: transparent;
  78. background-color: transparent;
  79. border-radius: @borderRadius;
  80. &:hover {
  81. background-color: rgba(255, 255, 255, 0.3);
  82. }
  83. }
  84. }
  85. .ant-select-selection__rendered {
  86. line-height: @lineHeight;
  87. margin-left: 0;
  88. }
  89. // 工具栏
  90. .j-vxe-toolbar {
  91. margin-bottom: 4px;
  92. .ant-form-item-label,
  93. .ant-form-item-control {
  94. line-height: 22px;
  95. }
  96. .ant-form-inline .ant-form-item {
  97. margin-right: 4px;
  98. }
  99. }
  100. }
  101. /** 内置属性 */
  102. .vxe-table.size--tiny {
  103. & .vxe-table--expanded {
  104. padding-right: 0;
  105. }
  106. & .vxe-body--expanded-cell {
  107. padding: 8px;
  108. }
  109. }
  110. .size--tiny .vxe-loading .vxe-loading--spinner {
  111. width: 38px;
  112. height: 38px
  113. }
  114. .vxe-table.size--tiny .vxe-body--column.col--ellipsis,
  115. .vxe-table.size--tiny .vxe-footer--column.col--ellipsis,
  116. .vxe-table.size--tiny .vxe-header--column.col--ellipsis,
  117. .vxe-table.vxe-editable.size--tiny .vxe-body--column {
  118. height: @height;
  119. }
  120. .vxe-table.size--tiny {
  121. font-size: 12px
  122. }
  123. .vxe-table.size--tiny .vxe-table--empty-block,
  124. .vxe-table.size--tiny .vxe-table--empty-placeholder {
  125. min-height: @height;
  126. }
  127. .vxe-table.size--tiny .vxe-body--column:not(.col--ellipsis),
  128. .vxe-table.size--tiny .vxe-footer--column:not(.col--ellipsis),
  129. .vxe-table.size--tiny .vxe-header--column:not(.col--ellipsis) {
  130. padding: 4px 0
  131. }
  132. .vxe-table.size--tiny .vxe-cell .vxe-default-input,
  133. .vxe-table.size--tiny .vxe-cell .vxe-default-select,
  134. .vxe-table.size--tiny .vxe-cell .vxe-default-textarea {
  135. height: @height;
  136. }
  137. .vxe-table.size--tiny .vxe-cell .vxe-default-input[type=date]::-webkit-inner-spin-button {
  138. margin-top: 1px
  139. }
  140. .vxe-table.size--tiny.virtual--x .col--ellipsis .vxe-cell,
  141. .vxe-table.size--tiny.virtual--y .col--ellipsis .vxe-cell,
  142. .vxe-table.size--tiny .vxe-body--column.col--ellipsis .vxe-cell,
  143. .vxe-table.size--tiny .vxe-footer--column.col--ellipsis .vxe-cell,
  144. .vxe-table.size--tiny .vxe-header--column.col--ellipsis .vxe-cell {
  145. max-height: @height;
  146. }
  147. .vxe-table.size--tiny .vxe-cell--checkbox .vxe-checkbox--icon,
  148. .vxe-table.size--tiny .vxe-cell--radio .vxe-radio--icon {
  149. font-size: 14px
  150. }
  151. .vxe-table.size--tiny .vxe-table--filter-option > .vxe-checkbox--icon,
  152. .vxe-table.size--small .vxe-table--filter-option > .vxe-checkbox--icon {
  153. font-size: 14px
  154. }
  155. .vxe-modal--wrapper.size--tiny .vxe-export--panel-column-option > .vxe-checkbox--icon,
  156. .vxe-modal--wrapper.size--small .vxe-export--panel-column-option > .vxe-checkbox--icon {
  157. font-size: 14px
  158. }
  159. .vxe-grid.size--tiny {
  160. font-size: 12px
  161. }
  162. .vxe-toolbar.size--tiny {
  163. font-size: 12px;
  164. height: 46px
  165. }
  166. .vxe-toolbar.size--tiny .vxe-custom--option > .vxe-checkbox--icon {
  167. font-size: 14px
  168. }
  169. .vxe-pager.size--tiny {
  170. font-size: 12px;
  171. height: @height;
  172. }
  173. .vxe-checkbox.size--tiny {
  174. font-size: 12px
  175. }
  176. .vxe-checkbox.size--tiny .vxe-checkbox--icon {
  177. font-size: 14px
  178. }
  179. .vxe-radio-button.size--tiny .vxe-radio--label {
  180. line-height: 26px
  181. }
  182. .vxe-radio.size--tiny {
  183. font-size: 12px
  184. }
  185. .vxe-radio.size--tiny .vxe-radio--icon {
  186. font-size: 14px
  187. }
  188. .vxe-input.size--tiny {
  189. font-size: 12px;
  190. height: @height;
  191. }
  192. .vxe-input.size--tiny .vxe-input--inner[type=date]::-webkit-inner-spin-button,
  193. .vxe-input.size--tiny .vxe-input--inner[type=month]::-webkit-inner-spin-button,
  194. .vxe-input.size--tiny .vxe-input--inner[type=week]::-webkit-inner-spin-button {
  195. margin-top: 0
  196. }
  197. .vxe-dropdown--panel.size--tiny {
  198. font-size: 12px
  199. }
  200. .vxe-textarea--autosize.size--tiny,
  201. .vxe-textarea.size--tiny {
  202. font-size: 12px
  203. }
  204. .vxe-textarea.size--tiny:not(.is--autosize) {
  205. min-height: @height;
  206. }
  207. .vxe-button.size--tiny {
  208. font-size: 12px
  209. }
  210. .vxe-button.size--tiny.type--button {
  211. height: @height;
  212. }
  213. .vxe-button.size--tiny.type--button.is--circle {
  214. min-width: @height;
  215. }
  216. .vxe-button.size--tiny.type--button.is--round {
  217. border-radius: 14px
  218. }
  219. .vxe-button.size--tiny .vxe-button--icon,
  220. .vxe-button.size--tiny .vxe-button--loading-icon {
  221. min-width: 12px
  222. }
  223. .vxe-modal--wrapper.size--tiny {
  224. font-size: 12px
  225. }
  226. .vxe-form.size--tiny {
  227. font-size: 12px
  228. }
  229. .vxe-form.size--tiny .vxe-form--item-inner {
  230. min-height: 30px
  231. }
  232. .vxe-form.size--tiny .vxe-default-input[type=reset],
  233. .vxe-form.size--tiny .vxe-default-input[type=submit] {
  234. line-height: 26px
  235. }
  236. .vxe-form.size--tiny .vxe-default-input,
  237. .vxe-form.size--tiny .vxe-default-select {
  238. height: @height;
  239. }
  240. .vxe-select--panel.size--tiny,
  241. .vxe-select.size--tiny {
  242. font-size: 12px
  243. }
  244. .vxe-select--panel.size--tiny .vxe-optgroup--title,
  245. .vxe-select--panel.size--tiny .vxe-select-option {
  246. height: 24px;
  247. line-height: 24px
  248. }
  249. .vxe-switch.size--tiny {
  250. font-size: 12px
  251. }
  252. .vxe-pulldown--panel.size--tiny,
  253. .vxe-pulldown.size--tiny {
  254. font-size: 12px
  255. }
  256. }