progress.js 2.7 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475
  1. "use strict";
  2. Object.defineProperty(exports, "__esModule", {
  3. value: true
  4. });
  5. exports.default = void 0;
  6. var _cssinjs = require("@ant-design/cssinjs");
  7. const genStepsProgressStyle = token => {
  8. const {
  9. antCls,
  10. componentCls,
  11. iconSize,
  12. iconSizeSM,
  13. processIconColor,
  14. marginXXS,
  15. lineWidthBold,
  16. lineWidth,
  17. paddingXXS
  18. } = token;
  19. const progressSize = token.calc(iconSize).add(token.calc(lineWidthBold).mul(4).equal()).equal();
  20. const progressSizeSM = token.calc(iconSizeSM).add(token.calc(token.lineWidth).mul(4).equal()).equal();
  21. return {
  22. [`&${componentCls}-with-progress`]: {
  23. [`${componentCls}-item`]: {
  24. paddingTop: paddingXXS,
  25. [`&-process ${componentCls}-item-container ${componentCls}-item-icon ${componentCls}-icon`]: {
  26. color: processIconColor
  27. }
  28. },
  29. [`&${componentCls}-vertical > ${componentCls}-item `]: {
  30. paddingInlineStart: paddingXXS,
  31. [`> ${componentCls}-item-container > ${componentCls}-item-tail`]: {
  32. top: marginXXS,
  33. insetInlineStart: token.calc(iconSize).div(2).sub(lineWidth).add(paddingXXS).equal()
  34. }
  35. },
  36. [`&, &${componentCls}-small`]: {
  37. [`&${componentCls}-horizontal ${componentCls}-item:first-child`]: {
  38. paddingBottom: paddingXXS,
  39. paddingInlineStart: paddingXXS
  40. }
  41. },
  42. [`&${componentCls}-small${componentCls}-vertical > ${componentCls}-item > ${componentCls}-item-container > ${componentCls}-item-tail`]: {
  43. insetInlineStart: token.calc(iconSizeSM).div(2).sub(lineWidth).add(paddingXXS).equal()
  44. },
  45. [`&${componentCls}-label-vertical ${componentCls}-item ${componentCls}-item-tail`]: {
  46. top: token.calc(iconSize).div(2).add(paddingXXS).equal()
  47. },
  48. [`${componentCls}-item-icon`]: {
  49. position: 'relative',
  50. [`${antCls}-progress`]: {
  51. position: 'absolute',
  52. insetInlineStart: '50%',
  53. top: '50%',
  54. transform: 'translate(-50%, -50%)',
  55. '&-inner': {
  56. width: `${(0, _cssinjs.unit)(progressSize)} !important`,
  57. height: `${(0, _cssinjs.unit)(progressSize)} !important`
  58. }
  59. }
  60. },
  61. // ============================== Small size ==============================
  62. [`&${componentCls}-small`]: {
  63. [`&${componentCls}-label-vertical ${componentCls}-item ${componentCls}-item-tail`]: {
  64. top: token.calc(iconSizeSM).div(2).add(paddingXXS).equal()
  65. },
  66. [`${componentCls}-item-icon ${antCls}-progress-inner`]: {
  67. width: `${(0, _cssinjs.unit)(progressSizeSM)} !important`,
  68. height: `${(0, _cssinjs.unit)(progressSizeSM)} !important`
  69. }
  70. }
  71. }
  72. };
  73. };
  74. var _default = exports.default = genStepsProgressStyle;