vertical.js 2.5 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970717273
  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 genStepsVerticalStyle = token => {
  8. const {
  9. componentCls,
  10. iconSizeSM,
  11. iconSize
  12. } = token;
  13. return {
  14. [`&${componentCls}-vertical`]: {
  15. display: 'flex',
  16. flexDirection: 'column',
  17. [`> ${componentCls}-item`]: {
  18. display: 'block',
  19. flex: '1 0 auto',
  20. paddingInlineStart: 0,
  21. overflow: 'visible',
  22. [`${componentCls}-item-icon`]: {
  23. float: 'left',
  24. marginInlineEnd: token.margin
  25. },
  26. [`${componentCls}-item-content`]: {
  27. display: 'block',
  28. minHeight: token.calc(token.controlHeight).mul(1.5).equal(),
  29. overflow: 'hidden'
  30. },
  31. [`${componentCls}-item-title`]: {
  32. lineHeight: (0, _cssinjs.unit)(iconSize)
  33. },
  34. [`${componentCls}-item-description`]: {
  35. paddingBottom: token.paddingSM
  36. }
  37. },
  38. [`> ${componentCls}-item > ${componentCls}-item-container > ${componentCls}-item-tail`]: {
  39. position: 'absolute',
  40. top: 0,
  41. insetInlineStart: token.calc(iconSize).div(2).sub(token.lineWidth).equal(),
  42. width: token.lineWidth,
  43. height: '100%',
  44. padding: `${(0, _cssinjs.unit)(token.calc(token.marginXXS).mul(1.5).add(iconSize).equal())} 0 ${(0, _cssinjs.unit)(token.calc(token.marginXXS).mul(1.5).equal())}`,
  45. '&::after': {
  46. width: token.lineWidth,
  47. height: '100%'
  48. }
  49. },
  50. [`> ${componentCls}-item:not(:last-child) > ${componentCls}-item-container > ${componentCls}-item-tail`]: {
  51. display: 'block'
  52. },
  53. [` > ${componentCls}-item > ${componentCls}-item-container > ${componentCls}-item-content > ${componentCls}-item-title`]: {
  54. '&::after': {
  55. display: 'none'
  56. }
  57. },
  58. [`&${componentCls}-small ${componentCls}-item-container`]: {
  59. [`${componentCls}-item-tail`]: {
  60. position: 'absolute',
  61. top: 0,
  62. insetInlineStart: token.calc(iconSizeSM).div(2).sub(token.lineWidth).equal(),
  63. padding: `${(0, _cssinjs.unit)(token.calc(token.marginXXS).mul(1.5).add(iconSizeSM).equal())} 0 ${(0, _cssinjs.unit)(token.calc(token.marginXXS).mul(1.5).equal())}`
  64. },
  65. [`${componentCls}-item-title`]: {
  66. lineHeight: (0, _cssinjs.unit)(iconSizeSM)
  67. }
  68. }
  69. }
  70. };
  71. };
  72. var _default = exports.default = genStepsVerticalStyle;