app模板、应用模板、组件模板、widget模板
You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.

693 lines
16 KiB

4 years ago
  1. [data-theme="blue"] {
  2. /* BEM support Func
  3. -------------------------- */
  4. /* Element Chalk Variables */
  5. /* Transition
  6. -------------------------- */
  7. /* Color
  8. -------------------------- */
  9. /* 53a8ff */
  10. /* 66b1ff */
  11. /* 79bbff */
  12. /* 8cc5ff */
  13. /* a0cfff */
  14. /* b3d8ff */
  15. /* c6e2ff */
  16. /* d9ecff */
  17. /* ecf5ff */
  18. /* Link
  19. -------------------------- */
  20. /* Border
  21. -------------------------- */
  22. /* Fill
  23. -------------------------- */
  24. /* Typography
  25. -------------------------- */
  26. /* Size
  27. -------------------------- */
  28. /* z-index
  29. -------------------------- */
  30. /* Disable base
  31. -------------------------- */
  32. /* Icon
  33. -------------------------- */
  34. /* Checkbox
  35. -------------------------- */
  36. /* Radio
  37. -------------------------- */
  38. /* Select
  39. -------------------------- */
  40. /* Alert
  41. -------------------------- */
  42. /* MessageBox
  43. -------------------------- */
  44. /* Message
  45. -------------------------- */
  46. /* Notification
  47. -------------------------- */
  48. /* Input
  49. -------------------------- */
  50. /* Cascader
  51. -------------------------- */
  52. /* Group
  53. -------------------------- */
  54. /* Tab
  55. -------------------------- */
  56. /* Button
  57. -------------------------- */
  58. /* cascader
  59. -------------------------- */
  60. /* Switch
  61. -------------------------- */
  62. /* Dialog
  63. -------------------------- */
  64. /* Table
  65. -------------------------- */
  66. /* Pagination
  67. -------------------------- */
  68. /* Popup
  69. -------------------------- */
  70. /* Popover
  71. -------------------------- */
  72. /* Tooltip
  73. -------------------------- */
  74. /* Tag
  75. -------------------------- */
  76. /* Tree
  77. -------------------------- */
  78. /* Dropdown
  79. -------------------------- */
  80. /* Badge
  81. -------------------------- */
  82. /* Card
  83. --------------------------*/
  84. /* Slider
  85. --------------------------*/
  86. /* Steps
  87. --------------------------*/
  88. /* Menu
  89. --------------------------*/
  90. /* Rate
  91. --------------------------*/
  92. /* DatePicker
  93. --------------------------*/
  94. /* Loading
  95. --------------------------*/
  96. /* Scrollbar
  97. --------------------------*/
  98. /* Carousel
  99. --------------------------*/
  100. /* Collapse
  101. --------------------------*/
  102. /* Transfer
  103. --------------------------*/
  104. /* Header
  105. --------------------------*/
  106. /* Footer
  107. --------------------------*/
  108. /* Main
  109. --------------------------*/
  110. /* Timeline
  111. --------------------------*/
  112. /* Backtop
  113. --------------------------*/
  114. /* Link
  115. --------------------------*/
  116. /* Calendar
  117. --------------------------*/
  118. /* Form
  119. -------------------------- */
  120. /* Avatar
  121. --------------------------*/
  122. /* Break-point
  123. --------------------------*/
  124. /* Break-points
  125. -------------------------- */
  126. /* Scrollbar
  127. -------------------------- */
  128. /* Placeholder
  129. -------------------------- */
  130. /* BEM
  131. -------------------------- */
  132. /* Element Chalk Variables */
  133. /* Transition
  134. -------------------------- */
  135. /* Color
  136. -------------------------- */
  137. /* 53a8ff */
  138. /* 66b1ff */
  139. /* 79bbff */
  140. /* 8cc5ff */
  141. /* a0cfff */
  142. /* b3d8ff */
  143. /* c6e2ff */
  144. /* d9ecff */
  145. /* ecf5ff */
  146. /* Link
  147. -------------------------- */
  148. /* Border
  149. -------------------------- */
  150. /* Fill
  151. -------------------------- */
  152. /* Typography
  153. -------------------------- */
  154. /* Size
  155. -------------------------- */
  156. /* z-index
  157. -------------------------- */
  158. /* Disable base
  159. -------------------------- */
  160. /* Icon
  161. -------------------------- */
  162. /* Checkbox
  163. -------------------------- */
  164. /* Radio
  165. -------------------------- */
  166. /* Select
  167. -------------------------- */
  168. /* Alert
  169. -------------------------- */
  170. /* MessageBox
  171. -------------------------- */
  172. /* Message
  173. -------------------------- */
  174. /* Notification
  175. -------------------------- */
  176. /* Input
  177. -------------------------- */
  178. /* Cascader
  179. -------------------------- */
  180. /* Group
  181. -------------------------- */
  182. /* Tab
  183. -------------------------- */
  184. /* Button
  185. -------------------------- */
  186. /* cascader
  187. -------------------------- */
  188. /* Switch
  189. -------------------------- */
  190. /* Dialog
  191. -------------------------- */
  192. /* Table
  193. -------------------------- */
  194. /* Pagination
  195. -------------------------- */
  196. /* Popup
  197. -------------------------- */
  198. /* Popover
  199. -------------------------- */
  200. /* Tooltip
  201. -------------------------- */
  202. /* Tag
  203. -------------------------- */
  204. /* Tree
  205. -------------------------- */
  206. /* Dropdown
  207. -------------------------- */
  208. /* Badge
  209. -------------------------- */
  210. /* Card
  211. --------------------------*/
  212. /* Slider
  213. --------------------------*/
  214. /* Steps
  215. --------------------------*/
  216. /* Menu
  217. --------------------------*/
  218. /* Rate
  219. --------------------------*/
  220. /* DatePicker
  221. --------------------------*/
  222. /* Loading
  223. --------------------------*/
  224. /* Scrollbar
  225. --------------------------*/
  226. /* Carousel
  227. --------------------------*/
  228. /* Collapse
  229. --------------------------*/
  230. /* Transfer
  231. --------------------------*/
  232. /* Header
  233. --------------------------*/
  234. /* Footer
  235. --------------------------*/
  236. /* Main
  237. --------------------------*/
  238. /* Timeline
  239. --------------------------*/
  240. /* Backtop
  241. --------------------------*/
  242. /* Link
  243. --------------------------*/
  244. /* Calendar
  245. --------------------------*/
  246. /* Form
  247. -------------------------- */
  248. /* Avatar
  249. --------------------------*/
  250. /* Break-point
  251. --------------------------*/ }
  252. [data-theme="blue"] .el-progress {
  253. position: relative;
  254. line-height: 1; }
  255. .el-progress__text {
  256. font-size: 14px;
  257. color: #FFFFFF;
  258. display: inline-block;
  259. vertical-align: middle;
  260. margin-left: 10px;
  261. line-height: 1; }
  262. .el-progress__text i {
  263. vertical-align: middle;
  264. display: block; }
  265. [data-theme="blue"] .el-progress--circle, [data-theme="blue"] .el-progress--dashboard {
  266. display: inline-block; }
  267. [data-theme="blue"] .el-progress--circle .el-progress__text, [data-theme="blue"] .el-progress--dashboard .el-progress__text {
  268. position: absolute;
  269. top: 50%;
  270. left: 0;
  271. width: 100%;
  272. text-align: center;
  273. margin: 0;
  274. -webkit-transform: translate(0, -50%);
  275. transform: translate(0, -50%); }
  276. [data-theme="blue"] .el-progress--circle .el-progress__text i, [data-theme="blue"] .el-progress--dashboard .el-progress__text i {
  277. vertical-align: middle;
  278. display: inline-block; }
  279. [data-theme="blue"] .el-progress--without-text .el-progress__text {
  280. display: none; }
  281. [data-theme="blue"] .el-progress--without-text .el-progress-bar {
  282. padding-right: 0;
  283. margin-right: 0;
  284. display: block; }
  285. [data-theme="blue"] .el-progress--text-inside .el-progress-bar {
  286. padding-right: 0;
  287. margin-right: 0; }
  288. [data-theme="blue"] .el-progress.is-success .el-progress-bar__inner {
  289. background-color: #92D9FF; }
  290. [data-theme="blue"] .el-progress.is-success .el-progress__text {
  291. color: #92D9FF; }
  292. [data-theme="blue"] .el-progress.is-warning .el-progress-bar__inner {
  293. background-color: #FFCE6D; }
  294. [data-theme="blue"] .el-progress.is-warning .el-progress__text {
  295. color: #FFCE6D; }
  296. [data-theme="blue"] .el-progress.is-exception .el-progress-bar__inner {
  297. background-color: #FF6D6D; }
  298. [data-theme="blue"] .el-progress.is-exception .el-progress__text {
  299. color: #FF6D6D; }
  300. [data-theme="blue"] .el-progress-bar {
  301. padding-right: 50px;
  302. display: inline-block;
  303. vertical-align: middle;
  304. width: 100%;
  305. margin-right: -55px;
  306. -webkit-box-sizing: border-box;
  307. box-sizing: border-box; }
  308. .el-progress-bar__outer {
  309. height: 6px;
  310. border-radius: 100px;
  311. background-color: #EBEEF5;
  312. overflow: hidden;
  313. position: relative;
  314. vertical-align: middle; }
  315. .el-progress-bar__inner {
  316. position: absolute;
  317. left: 0;
  318. top: 0;
  319. height: 100%;
  320. background-color: #92D9FF;
  321. text-align: right;
  322. border-radius: 100px;
  323. line-height: 1;
  324. white-space: nowrap;
  325. -webkit-transition: width 0.6s ease;
  326. transition: width 0.6s ease; }
  327. .el-progress-bar__inner::after {
  328. display: inline-block;
  329. content: "";
  330. height: 100%;
  331. vertical-align: middle; }
  332. .el-progress-bar__innerText {
  333. display: inline-block;
  334. vertical-align: middle;
  335. color: #000000;
  336. font-size: 12px;
  337. margin: 0 5px; }
  338. @-webkit-keyframes progress {
  339. 0% {
  340. background-position: 0 0; }
  341. 100% {
  342. background-position: 32px 0; } }
  343. @keyframes progress {
  344. 0% {
  345. background-position: 0 0; }
  346. 100% {
  347. background-position: 32px 0; } }
  348. /* BEM support Func
  349. -------------------------- */
  350. /* Element Chalk Variables */
  351. /* Transition
  352. -------------------------- */
  353. /* Color
  354. -------------------------- */
  355. /* 53a8ff */
  356. /* 66b1ff */
  357. /* 79bbff */
  358. /* 8cc5ff */
  359. /* a0cfff */
  360. /* b3d8ff */
  361. /* c6e2ff */
  362. /* d9ecff */
  363. /* ecf5ff */
  364. /* Link
  365. -------------------------- */
  366. /* Border
  367. -------------------------- */
  368. /* Fill
  369. -------------------------- */
  370. /* Typography
  371. -------------------------- */
  372. /* Size
  373. -------------------------- */
  374. /* z-index
  375. -------------------------- */
  376. /* Disable base
  377. -------------------------- */
  378. /* Icon
  379. -------------------------- */
  380. /* Checkbox
  381. -------------------------- */
  382. /* Radio
  383. -------------------------- */
  384. /* Select
  385. -------------------------- */
  386. /* Alert
  387. -------------------------- */
  388. /* MessageBox
  389. -------------------------- */
  390. /* Message
  391. -------------------------- */
  392. /* Notification
  393. -------------------------- */
  394. /* Input
  395. -------------------------- */
  396. /* Cascader
  397. -------------------------- */
  398. /* Group
  399. -------------------------- */
  400. /* Tab
  401. -------------------------- */
  402. /* Button
  403. -------------------------- */
  404. /* cascader
  405. -------------------------- */
  406. /* Switch
  407. -------------------------- */
  408. /* Dialog
  409. -------------------------- */
  410. /* Table
  411. -------------------------- */
  412. /* Pagination
  413. -------------------------- */
  414. /* Popup
  415. -------------------------- */
  416. /* Popover
  417. -------------------------- */
  418. /* Tooltip
  419. -------------------------- */
  420. /* Tag
  421. -------------------------- */
  422. /* Tree
  423. -------------------------- */
  424. /* Dropdown
  425. -------------------------- */
  426. /* Badge
  427. -------------------------- */
  428. /* Card
  429. --------------------------*/
  430. /* Slider
  431. --------------------------*/
  432. /* Steps
  433. --------------------------*/
  434. /* Menu
  435. --------------------------*/
  436. /* Rate
  437. --------------------------*/
  438. /* DatePicker
  439. --------------------------*/
  440. /* Loading
  441. --------------------------*/
  442. /* Scrollbar
  443. --------------------------*/
  444. /* Carousel
  445. --------------------------*/
  446. /* Collapse
  447. --------------------------*/
  448. /* Transfer
  449. --------------------------*/
  450. /* Header
  451. --------------------------*/
  452. /* Footer
  453. --------------------------*/
  454. /* Main
  455. --------------------------*/
  456. /* Timeline
  457. --------------------------*/
  458. /* Backtop
  459. --------------------------*/
  460. /* Link
  461. --------------------------*/
  462. /* Calendar
  463. --------------------------*/
  464. /* Form
  465. -------------------------- */
  466. /* Avatar
  467. --------------------------*/
  468. /* Break-point
  469. --------------------------*/
  470. /* Break-points
  471. -------------------------- */
  472. /* Scrollbar
  473. -------------------------- */
  474. /* Placeholder
  475. -------------------------- */
  476. /* BEM
  477. -------------------------- */
  478. /* Element Chalk Variables */
  479. /* Transition
  480. -------------------------- */
  481. /* Color
  482. -------------------------- */
  483. /* 53a8ff */
  484. /* 66b1ff */
  485. /* 79bbff */
  486. /* 8cc5ff */
  487. /* a0cfff */
  488. /* b3d8ff */
  489. /* c6e2ff */
  490. /* d9ecff */
  491. /* ecf5ff */
  492. /* Link
  493. -------------------------- */
  494. /* Border
  495. -------------------------- */
  496. /* Fill
  497. -------------------------- */
  498. /* Typography
  499. -------------------------- */
  500. /* Size
  501. -------------------------- */
  502. /* z-index
  503. -------------------------- */
  504. /* Disable base
  505. -------------------------- */
  506. /* Icon
  507. -------------------------- */
  508. /* Checkbox
  509. -------------------------- */
  510. /* Radio
  511. -------------------------- */
  512. /* Select
  513. -------------------------- */
  514. /* Alert
  515. -------------------------- */
  516. /* MessageBox
  517. -------------------------- */
  518. /* Message
  519. -------------------------- */
  520. /* Notification
  521. -------------------------- */
  522. /* Input
  523. -------------------------- */
  524. /* Cascader
  525. -------------------------- */
  526. /* Group
  527. -------------------------- */
  528. /* Tab
  529. -------------------------- */
  530. /* Button
  531. -------------------------- */
  532. /* cascader
  533. -------------------------- */
  534. /* Switch
  535. -------------------------- */
  536. /* Dialog
  537. -------------------------- */
  538. /* Table
  539. -------------------------- */
  540. /* Pagination
  541. -------------------------- */
  542. /* Popup
  543. -------------------------- */
  544. /* Popover
  545. -------------------------- */
  546. /* Tooltip
  547. -------------------------- */
  548. /* Tag
  549. -------------------------- */
  550. /* Tree
  551. -------------------------- */
  552. /* Dropdown
  553. -------------------------- */
  554. /* Badge
  555. -------------------------- */
  556. /* Card
  557. --------------------------*/
  558. /* Slider
  559. --------------------------*/
  560. /* Steps
  561. --------------------------*/
  562. /* Menu
  563. --------------------------*/
  564. /* Rate
  565. --------------------------*/
  566. /* DatePicker
  567. --------------------------*/
  568. /* Loading
  569. --------------------------*/
  570. /* Scrollbar
  571. --------------------------*/
  572. /* Carousel
  573. --------------------------*/
  574. /* Collapse
  575. --------------------------*/
  576. /* Transfer
  577. --------------------------*/
  578. /* Header
  579. --------------------------*/
  580. /* Footer
  581. --------------------------*/
  582. /* Main
  583. --------------------------*/
  584. /* Timeline
  585. --------------------------*/
  586. /* Backtop
  587. --------------------------*/
  588. /* Link
  589. --------------------------*/
  590. /* Calendar
  591. --------------------------*/
  592. /* Form
  593. -------------------------- */
  594. /* Avatar
  595. --------------------------*/
  596. /* Break-point
  597. --------------------------*/
  598. .el-progress {
  599. position: relative;
  600. line-height: 1; }
  601. .el-progress__text {
  602. font-size: 14px;
  603. color: #FFFFFF;
  604. display: inline-block;
  605. vertical-align: middle;
  606. margin-left: 10px;
  607. line-height: 1; }
  608. .el-progress__text i {
  609. vertical-align: middle;
  610. display: block; }
  611. .el-progress--circle, .el-progress--dashboard {
  612. display: inline-block; }
  613. .el-progress--circle .el-progress__text, .el-progress--dashboard .el-progress__text {
  614. position: absolute;
  615. top: 50%;
  616. left: 0;
  617. width: 100%;
  618. text-align: center;
  619. margin: 0;
  620. -webkit-transform: translate(0, -50%);
  621. transform: translate(0, -50%); }
  622. .el-progress--circle .el-progress__text i, .el-progress--dashboard .el-progress__text i {
  623. vertical-align: middle;
  624. display: inline-block; }
  625. .el-progress--without-text .el-progress__text {
  626. display: none; }
  627. .el-progress--without-text .el-progress-bar {
  628. padding-right: 0;
  629. margin-right: 0;
  630. display: block; }
  631. .el-progress--text-inside .el-progress-bar {
  632. padding-right: 0;
  633. margin-right: 0; }
  634. .el-progress.is-success .el-progress-bar__inner {
  635. background-color: #92D9FF; }
  636. .el-progress.is-success .el-progress__text {
  637. color: #92D9FF; }
  638. .el-progress.is-warning .el-progress-bar__inner {
  639. background-color: #FFCE6D; }
  640. .el-progress.is-warning .el-progress__text {
  641. color: #FFCE6D; }
  642. .el-progress.is-exception .el-progress-bar__inner {
  643. background-color: #FF6D6D; }
  644. .el-progress.is-exception .el-progress__text {
  645. color: #FF6D6D; }
  646. .el-progress-bar {
  647. padding-right: 50px;
  648. display: inline-block;
  649. vertical-align: middle;
  650. width: 100%;
  651. margin-right: -55px;
  652. -webkit-box-sizing: border-box;
  653. box-sizing: border-box; }
  654. .el-progress-bar__outer {
  655. height: 6px;
  656. border-radius: 100px;
  657. background-color: #EBEEF5;
  658. overflow: hidden;
  659. position: relative;
  660. vertical-align: middle; }
  661. .el-progress-bar__inner {
  662. position: absolute;
  663. left: 0;
  664. top: 0;
  665. height: 100%;
  666. background-color: #92D9FF;
  667. text-align: right;
  668. border-radius: 100px;
  669. line-height: 1;
  670. white-space: nowrap;
  671. -webkit-transition: width 0.6s ease;
  672. transition: width 0.6s ease; }
  673. .el-progress-bar__inner::after {
  674. display: inline-block;
  675. content: "";
  676. height: 100%;
  677. vertical-align: middle; }
  678. .el-progress-bar__innerText {
  679. display: inline-block;
  680. vertical-align: middle;
  681. color: #000000;
  682. font-size: 12px;
  683. margin: 0 5px; }
  684. @keyframes progress {
  685. 0% {
  686. background-position: 0 0; }
  687. 100% {
  688. background-position: 32px 0; } }