style.css 2.4 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990
  1. /*toolbar*/
  2. .vxe-toolbar {
  3. position: relative;
  4. display: flex;
  5. flex-direction: row;
  6. align-items: center;
  7. padding: 0.6em 0;
  8. color: var(--vxe-ui-font-color);
  9. font-family: var(--vxe-ui-font-family);
  10. background-color: var(--vxe-ui-layout-background-color);
  11. }
  12. .vxe-toolbar:after {
  13. content: "";
  14. display: block;
  15. clear: both;
  16. height: 0;
  17. overflow: hidden;
  18. visibility: hidden;
  19. }
  20. .vxe-toolbar.is--perfect {
  21. border: 1px solid var(--vxe-ui-table-border-color);
  22. border-bottom-width: 0;
  23. background-color: var(--vxe-ui-table-header-background-color);
  24. }
  25. .vxe-toolbar.is--loading:before {
  26. content: "";
  27. position: absolute;
  28. top: 0;
  29. left: 0;
  30. width: 100%;
  31. height: 100%;
  32. z-index: 999;
  33. -webkit-user-select: none;
  34. -moz-user-select: none;
  35. user-select: none;
  36. background-color: var(--vxe-ui-loading-background-color);
  37. }
  38. .vxe-toolbar .vxe-buttons--wrapper {
  39. flex-grow: 1;
  40. }
  41. .vxe-toolbar .vxe-buttons--wrapper > .vxe-button + .vxe-button--item, .vxe-toolbar .vxe-buttons--wrapper > .vxe-button--item + .vxe-button, .vxe-toolbar .vxe-buttons--wrapper > .vxe-button--item + .vxe-button--item {
  42. margin-left: 0.8em;
  43. }
  44. .vxe-toolbar .vxe-buttons--wrapper > .vxe-button--item {
  45. display: inline-block;
  46. }
  47. .vxe-toolbar .vxe-tools--wrapper > .vxe-button + .vxe-tool--item, .vxe-toolbar .vxe-tools--wrapper > .vxe-tool--item + .vxe-button, .vxe-toolbar .vxe-tools--wrapper > .vxe-tool--item + .vxe-tool--item {
  48. margin-left: 0.8em;
  49. }
  50. .vxe-toolbar .vxe-tools--wrapper > .vxe-tool--item {
  51. display: inline-block;
  52. }
  53. .vxe-toolbar .vxe-tools--wrapper > .vxe-button {
  54. display: flex;
  55. align-items: center;
  56. justify-content: center;
  57. }
  58. .vxe-toolbar .vxe-buttons--wrapper,
  59. .vxe-toolbar .vxe-tools--wrapper,
  60. .vxe-toolbar .vxe-tools--operate {
  61. display: flex;
  62. align-items: center;
  63. }
  64. .vxe-toolbar .vxe-buttons--wrapper,
  65. .vxe-toolbar .vxe-tools--wrapper {
  66. flex-wrap: wrap;
  67. }
  68. .vxe-toolbar .vxe-tools--operate {
  69. flex-shrink: 0;
  70. }
  71. .vxe-toolbar .vxe-custom--wrapper {
  72. position: relative;
  73. }
  74. .vxe-toolbar .vxe-custom--wrapper.is--active > .vxe-button {
  75. background-color: var(--vxe-ui-toolbar-custom-active-background-color);
  76. border-radius: 50%;
  77. }
  78. .vxe-toolbar {
  79. font-size: var(--vxe-ui-font-size-default);
  80. }
  81. .vxe-toolbar.size--medium {
  82. font-size: var(--vxe-ui-font-size-medium);
  83. }
  84. .vxe-toolbar.size--small {
  85. font-size: var(--vxe-ui-font-size-small);
  86. }
  87. .vxe-toolbar.size--mini {
  88. font-size: var(--vxe-ui-font-size-mini);
  89. }