export.scss 3.4 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161
  1. /**Variable**/
  2. @import './base/checked.scss';
  3. .vxe-export--panel-column > ul {
  4. list-style-type: none;
  5. overflow: auto;
  6. margin: 0;
  7. padding: 0;
  8. user-select: none;
  9. & > li {
  10. overflow: hidden;
  11. text-overflow: ellipsis;
  12. white-space: nowrap;
  13. cursor: pointer;
  14. }
  15. }
  16. .vxe-export--panel {
  17. & > table {
  18. width: 100%;
  19. border: 0;
  20. table-layout: fixed;
  21. tr {
  22. td {
  23. padding: 0 10px;
  24. &:nth-child(1) {
  25. text-align: right;
  26. width: 30%;
  27. font-weight: 700;
  28. padding: 8px 10px;
  29. }
  30. &:nth-child(2) {
  31. width: 70%;
  32. }
  33. & > .vxe-input,
  34. & > .vxe-select {
  35. width: 80%;
  36. }
  37. & > .vxe-export--panel-option-row {
  38. padding: 0.25em 0;
  39. }
  40. }
  41. }
  42. }
  43. .vxe-export--panel-column {
  44. width: 80%;
  45. border: 1px solid $vxe-input-border-color;
  46. margin: 3px 0;
  47. border-radius: $vxe-border-radius;
  48. user-select: none;
  49. & > ul {
  50. & > li {
  51. padding: 0.2em 1em 0.2em 2.3em;
  52. @for $i from 2 through 8 {
  53. $interval: $i - 1 + 0.2;
  54. &.level--#{$i}{
  55. padding-left: #{$interval + 2.3}em;
  56. .vxe-checkbox--icon {
  57. left: #{$interval + 0.6}em;
  58. }
  59. }
  60. }
  61. }
  62. }
  63. .vxe-export--panel-column-header {
  64. padding: 0.1em 0;
  65. background-color: $vxe-table-header-background-color;
  66. font-weight: 700;
  67. border-bottom: 1px solid $vxe-table-border-color;
  68. }
  69. .vxe-export--panel-column-body {
  70. padding: 0.2em 0;
  71. min-height: 10em;
  72. max-height: 17.6em;
  73. }
  74. }
  75. .vxe-import-selected--file {
  76. padding-right: 40px;
  77. position: relative;
  78. overflow: hidden;
  79. text-overflow: ellipsis;
  80. white-space: nowrap;
  81. user-select: none;
  82. & > i {
  83. display: none;
  84. position: absolute;
  85. top: 50%;
  86. right: 15px;
  87. transform: translateY(-50%);
  88. font-size: 16px;
  89. cursor: pointer;
  90. }
  91. &:hover {
  92. & > i {
  93. display: block;
  94. }
  95. color: $vxe-primary-color;
  96. }
  97. }
  98. .vxe-import-select--file {
  99. border: 1px dashed $vxe-input-border-color;
  100. padding: 6px 34px;
  101. outline: 0;
  102. border-radius: $vxe-border-radius;
  103. background-color: $vxe-input-background-color;
  104. user-select: none;
  105. cursor: pointer;
  106. &:focus {
  107. border-color: $vxe-primary-color;
  108. box-shadow: 0 0 0.25em 0 $vxe-primary-color;
  109. }
  110. &:hover {
  111. color: $vxe-primary-color;
  112. border-color: $vxe-primary-color;
  113. }
  114. }
  115. .vxe-export--panel-btns {
  116. text-align: right;
  117. padding: 0.25em;
  118. }
  119. }
  120. .vxe-export--panel-column-option {
  121. @extend %XECheckbox;
  122. .vxe-checkbox--icon {
  123. left: 0.6em;
  124. top: 0.38em;
  125. }
  126. &:hover {
  127. background-color: $vxe-table-row-hover-background-color;
  128. }
  129. }
  130. .vxe-modal--wrapper {
  131. .vxe-export--panel-column-option {
  132. & > .vxe-checkbox--icon {
  133. font-size: $vxe-checkbox-font-size-default;
  134. }
  135. }
  136. &.size--medium {
  137. .vxe-export--panel-column-option {
  138. & > .vxe-checkbox--icon {
  139. font-size: $vxe-checkbox-font-size-medium;
  140. }
  141. }
  142. }
  143. &.size--small {
  144. .vxe-export--panel-column-option {
  145. & > .vxe-checkbox--icon {
  146. font-size: $vxe-checkbox-font-size-small;
  147. }
  148. }
  149. }
  150. &.size--mini {
  151. .vxe-export--panel-column-option {
  152. & > .vxe-checkbox--icon {
  153. font-size: $vxe-checkbox-font-size-mini;
  154. }
  155. }
  156. }
  157. }