label-placement.js 1.4 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051
  1. import { unit } from '@ant-design/cssinjs';
  2. const genStepsLabelPlacementStyle = token => {
  3. const {
  4. componentCls,
  5. iconSize,
  6. lineHeight,
  7. iconSizeSM
  8. } = token;
  9. return {
  10. [`&${componentCls}-label-vertical`]: {
  11. [`${componentCls}-item`]: {
  12. overflow: 'visible',
  13. '&-tail': {
  14. marginInlineStart: token.calc(iconSize).div(2).add(token.controlHeightLG).equal(),
  15. padding: `0 ${unit(token.paddingLG)}`
  16. },
  17. '&-content': {
  18. display: 'block',
  19. width: token.calc(iconSize).div(2).add(token.controlHeightLG).mul(2).equal(),
  20. marginTop: token.marginSM,
  21. textAlign: 'center'
  22. },
  23. '&-icon': {
  24. display: 'inline-block',
  25. marginInlineStart: token.controlHeightLG
  26. },
  27. '&-title': {
  28. paddingInlineEnd: 0,
  29. paddingInlineStart: 0,
  30. '&::after': {
  31. display: 'none'
  32. }
  33. },
  34. '&-subtitle': {
  35. display: 'block',
  36. marginBottom: token.marginXXS,
  37. marginInlineStart: 0,
  38. lineHeight
  39. }
  40. },
  41. [`&${componentCls}-small:not(${componentCls}-dot)`]: {
  42. [`${componentCls}-item`]: {
  43. '&-icon': {
  44. marginInlineStart: token.calc(iconSize).sub(iconSizeSM).div(2).add(token.controlHeightLG).equal()
  45. }
  46. }
  47. }
  48. }
  49. };
  50. };
  51. export default genStepsLabelPlacementStyle;