antd
Version:
An enterprise-class UI design language and React components implementation
62 lines • 1.77 kB
JavaScript
import { unit } from '@ant-design/cssinjs';
const genStepsSmallStyle = token => {
const {
componentCls,
iconSizeSM,
// stepsSmallIconMargin,
fontSizeSM,
fontSize,
colorTextDescription
} = token;
return {
[`&${componentCls}-small`]: {
[`&${componentCls}-horizontal:not(${componentCls}-label-vertical) ${componentCls}-item`]: {
paddingInlineStart: token.paddingSM,
'&:first-child': {
paddingInlineStart: 0
}
},
[`${componentCls}-item-icon`]: {
width: iconSizeSM,
height: iconSizeSM,
// margin: stepsSmallIconMargin,
marginTop: 0,
marginBottom: 0,
marginInline: `0 ${unit(token.marginXS)}`,
fontSize: fontSizeSM,
lineHeight: `${unit(iconSizeSM)}`,
textAlign: 'center',
borderRadius: iconSizeSM
},
[`${componentCls}-item-title`]: {
paddingInlineEnd: token.paddingSM,
fontSize,
lineHeight: `${unit(iconSizeSM)}`,
'&::after': {
top: token.calc(iconSizeSM).div(2).equal()
}
},
[`${componentCls}-item-description`]: {
color: colorTextDescription,
fontSize
},
[`${componentCls}-item-tail`]: {
top: token.calc(iconSizeSM).div(2).sub(token.paddingXXS).equal()
},
[`${componentCls}-item-custom ${componentCls}-item-icon`]: {
width: 'inherit',
height: 'inherit',
lineHeight: 'inherit',
background: 'none',
border: 0,
borderRadius: 0,
[`> ${componentCls}-icon`]: {
fontSize: iconSizeSM,
lineHeight: `${unit(iconSizeSM)}`,
transform: 'none'
}
}
}
};
};
export default genStepsSmallStyle;