global.less 7.4 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408
  1. // Reset default browser styles
  2. * {
  3. box-sizing: border-box;
  4. }
  5. #root {
  6. min-height: 100vh;
  7. }
  8. html,
  9. body,
  10. ul,
  11. ol,
  12. li,
  13. dl,
  14. dt,
  15. dd,
  16. h1,
  17. h2,
  18. h3,
  19. h4,
  20. h5,
  21. h6,
  22. pre,
  23. code,
  24. form,
  25. fieldset,
  26. legend,
  27. input,
  28. textarea,
  29. p,
  30. blockquote,
  31. th,
  32. td,
  33. hr,
  34. button {
  35. margin: 0;
  36. padding: 0;
  37. font-size: 100%;
  38. font-family: inherit;
  39. vertical-align: baseline;
  40. border: 0 none;
  41. color: inherit;
  42. background: transparent;
  43. box-sizing: border-box;
  44. -webkit-font-smoothing: antialiased;
  45. -moz-osx-font-smoothing: grayscale;
  46. }
  47. @font-face {
  48. font-family: 'PangMenZhengDao-3';
  49. src: url('@/assets/fonts/PangMenZhengDao-3.ttf');
  50. font-weight: normal;
  51. font-style: normal;
  52. }
  53. @font-face {
  54. font-family: 'PangMenZhengDao';
  55. src: url('@/assets/fonts/PangMenZhengDao.ttf');
  56. font-weight: normal;
  57. font-style: normal;
  58. }
  59. body {
  60. color: #333;
  61. .ant-collapse-header {
  62. flex-direction: row-reverse;
  63. }
  64. .ant-collapse-item {
  65. background-color: white !important;
  66. border-radius: 0.06rem !important;
  67. border-bottom: none !important;
  68. margin-bottom: 0.1rem;
  69. }
  70. .ant-select-dropdown .ant-select-item {
  71. font-size: 0.3rem;
  72. }
  73. .ant-picker-dropdown {
  74. font-size: 0.3rem;
  75. }
  76. .ant-picker-dropdown .ant-picker-content td {
  77. width: 0.3rem;
  78. }
  79. .ant-picker-dropdown .ant-picker-cell::before {
  80. height: 0.3rem;
  81. }
  82. .ant-picker-dropdown .ant-picker-cell .ant-picker-cell-inner {
  83. min-width: 0.3rem;
  84. height: 0.3rem;
  85. line-height: 0.3rem;
  86. }
  87. .ant-picker-dropdown .ant-picker-date-panel .ant-picker-content {
  88. width: 4rem;
  89. }
  90. .ant-picker-dropdown .ant-picker-date-panel .ant-picker-content th {
  91. width: 0.36rem;
  92. }
  93. .ant-picker-dropdown .ant-picker-content th {
  94. height: 0.36rem;
  95. }
  96. .ant-picker-dropdown .ant-picker-content th,
  97. .ant-picker-dropdown .ant-picker-content td {
  98. min-width: 0.24rem;
  99. }
  100. .ant-picker-dropdown .ant-picker-cell {
  101. padding: 0.06rem 0.06rem;
  102. }
  103. .ant-picker-dropdown .ant-picker-decade-panel,
  104. .ant-picker-dropdown .ant-picker-year-panel,
  105. .ant-picker-dropdown .ant-picker-quarter-panel,
  106. .ant-picker-dropdown .ant-picker-month-panel,
  107. .ant-picker-dropdown .ant-picker-week-panel,
  108. .ant-picker-dropdown .ant-picker-date-panel,
  109. .ant-picker-dropdown .ant-picker-time-panel {
  110. width: 4.5rem;
  111. }
  112. .ant-modal-root .ant-modal-mask {
  113. background-color: rgba(0, 0, 0, 0.2);
  114. }
  115. .ant-modal-wrap {
  116. &::-webkit-scrollbar {
  117. display: none;
  118. }
  119. &::-webkit-scrollbar-thumb {
  120. display: none;
  121. }
  122. &::-webkit-scrollbar-track {
  123. display: none;
  124. }
  125. &::-webkit-scrollbar-thumb:hover {
  126. display: none;
  127. }
  128. }
  129. }
  130. // Remove list styles on ul, ol
  131. ul,
  132. ol {
  133. list-style: none;
  134. }
  135. // Remove link styles
  136. a {
  137. text-decoration: none;
  138. }
  139. // Remove table border
  140. table {
  141. border-collapse: collapse;
  142. border-spacing: 0;
  143. background-color: white;
  144. }
  145. // Remove input styling for IE
  146. input[type='text'],
  147. input[type='password'],
  148. input[type='number'],
  149. textarea {
  150. appearance: none;
  151. -webkit-appearance: none;
  152. -moz-appearance: none;
  153. // border-radius: 0;
  154. }
  155. // Remove button styling for IE
  156. button,
  157. input[type='submit'],
  158. input[type='reset'] {
  159. appearance: none;
  160. -webkit-appearance: none;
  161. -moz-appearance: none;
  162. border: 0 none;
  163. background: none;
  164. padding: 0;
  165. cursor: pointer;
  166. }
  167. // Remove outline on focus
  168. *:focus {
  169. outline: none;
  170. }
  171. .box {
  172. border-radius: 0.08rem;
  173. box-shadow: 0rem 0rem 0.08rem 0.02rem rgba(191, 191, 191, 0.2);
  174. border: 0.01rem solid #eee;
  175. background: rgba(255, 255, 255);
  176. }
  177. .card-box {
  178. border-radius: 0.4rem 0 0.4rem 0;
  179. background: #ffffff;
  180. box-shadow: 0.01rem 0.06rem 0.1rem 0rem rgba(0, 0, 0, 0.1);
  181. }
  182. .card-select {
  183. border: 3px solid #66ccff;
  184. }
  185. .value-number {
  186. margin-bottom: 0.2rem;
  187. font-size: 0.8rem;
  188. font-family: PangMenZhengDao-3, PangMenZhengDao-3;
  189. font-weight: 400;
  190. color: #3b3b3b;
  191. line-height: 0.62rem;
  192. letter-spacing: 0.06rem;
  193. }
  194. .content-tab {
  195. padding-left: 0.05rem;
  196. padding-top: 0.05rem;
  197. padding-right: 0.25rem;
  198. height: calc(100vh - 1.3rem);
  199. overflow-x: hidden;
  200. overflow-y: auto;
  201. }
  202. .content-title {
  203. // padding-left: 0.05rem;
  204. // padding-right: 0.5rem;
  205. // height: calc(100vh - 1.15rem);
  206. // overflow-x: hidden;
  207. // overflow-y: auto;
  208. }
  209. .password-eye {
  210. display: inline-block;
  211. vertical-align: middle;
  212. width: 0.6rem;
  213. height: 0.35rem;
  214. background: url('@/assets/icon-eye1.png') no-repeat center;
  215. background-size: 0.4rem;
  216. &.open {
  217. background-image: url('@/assets/icon-eye2.png');
  218. }
  219. }
  220. .tabs {
  221. display: flex;
  222. width: 100%;
  223. overflow-x: auto;
  224. border: 0.01rem solid #979797;
  225. &::-webkit-scrollbar {
  226. display: none;
  227. }
  228. .tabs-item {
  229. flex: 1;
  230. text-align: center;
  231. padding: 0.16rem 0.24rem;
  232. font-size: 0.24rem;
  233. font-weight: 400;
  234. color: #4a4a4a;
  235. border-right: 0.01rem solid #979797;
  236. white-space: nowrap;
  237. &:last-child {
  238. border-right: none;
  239. }
  240. &.active {
  241. color: #ffffff;
  242. background: #4a90e2;
  243. }
  244. }
  245. }
  246. .section-title {
  247. display: flex;
  248. align-items: center;
  249. font-size: 0.28rem;
  250. font-weight: 400;
  251. color: #4a4a4a;
  252. line-height: 0.4rem;
  253. .section-line {
  254. width: 0.04rem;
  255. height: 0.3rem;
  256. background: #4a90e2;
  257. margin-right: 0.08rem;
  258. }
  259. }
  260. *::-webkit-scrollbar {
  261. width: 0.06rem;
  262. height: 0.06rem;
  263. }
  264. *::-webkit-scrollbar-thumb {
  265. background-color: #999;
  266. }
  267. *::-webkit-scrollbar-thumb:hover {
  268. background-color: #666;
  269. }
  270. *::-webkit-scrollbar-track {
  271. background-color: #eee;
  272. }
  273. .ant-btn {
  274. padding: 0.08rem 0.24rem;
  275. font-size: 0.28rem;
  276. line-height: 1;
  277. height: auto;
  278. }
  279. .ant-btn-primary {
  280. background: #4a90e2;
  281. }
  282. .ant-table {
  283. background: #fff;
  284. }
  285. .ant-table-cell,
  286. .ant-table-placeholder {
  287. background: transparent !important;
  288. }
  289. .ant-table,
  290. .ant-table-container,
  291. .ant-table-wrapper table {
  292. border-radius: 0 !important;
  293. }
  294. .ant-table-container {
  295. border: none !important;
  296. }
  297. .ant-table-cell::before {
  298. display: none;
  299. }
  300. .ant-table-thead {
  301. background: rgba(23, 85, 255, 0.5);
  302. }
  303. .ant-table-wrapper .ant-table-thead > tr > th,
  304. .ant-table-wrapper .ant-table-tbody > tr > td {
  305. border-radius: 0;
  306. padding: 0.16rem 0.18rem;
  307. font-size: 0.28rem;
  308. color: rgba(97, 93, 93, 1);
  309. line-height: 0.32rem;
  310. font-weight: normal;
  311. vertical-align: middle;
  312. border-radius: 0 !important;
  313. }
  314. .ant-table-wrapper .ant-table-thead > tr > th {
  315. border: 0 none !important;
  316. color: #fff;
  317. }
  318. .ant-table-wrapper .ant-table-tbody > tr > td {
  319. border-bottom: 1px solid rgba(188, 186, 186, 1);
  320. }
  321. // .ant-table-tbody > tr:nth-child(even) {
  322. // background: rgba(145, 192, 238, 0.16);
  323. // }
  324. .ant-table-cell::before {
  325. display: none;
  326. }
  327. .ant-picker {
  328. font-size: 0.26rem;
  329. .ant-picker-input > input {
  330. font-size: 0.24rem;
  331. }
  332. .ant-picker-separator {
  333. font-size: 0.24rem;
  334. }
  335. }
  336. .ant-select-selection-item {
  337. font-size: 0.26rem;
  338. }
  339. .ant-select-selector {
  340. // height: 0.4rem;
  341. padding: 0.04rem 0.11rem;
  342. }
  343. .ant-select-single:not(.ant-select-customize-input) .ant-select-selector {
  344. height: auto;
  345. padding: 0.04rem 0.11rem;
  346. }
  347. .ant-select-single .ant-select-selector {
  348. font-size: 0.26rem;
  349. }
  350. .ant-checkbox-wrapper {
  351. font-size: 0.32rem;
  352. color: rgba(29, 131, 255, 1);
  353. }
  354. .ant-checkbox {
  355. .ant-checkbox-inner {
  356. width: 0.32rem;
  357. height: 0.32rem;
  358. &::after {
  359. width: 0.1rem;
  360. height: 0.15rem;
  361. left: 30%;
  362. }
  363. }
  364. // font-size: 0.32rem;
  365. }
  366. .ant-empty {
  367. margin-top: 20px;
  368. .ant-empty-image {
  369. height: 150px;
  370. }
  371. .ant-empty-description {
  372. font-size: 24px;
  373. }
  374. }
  375. // react-zmage样式修改
  376. #zmageControl {
  377. transform: scale(0.4);
  378. transform-origin: 100% 0;
  379. }