ant-design/components/statistic/style/index.tsx
MadCcc 8e27cf986f
chore: rm component less file (#36244)
* chore: rm component less file

* refactor: less file

* refactor: rm less

* refactor: rm page-header and comment

* chore: rm less in components

* chore: update dist config

* chore: update image test

* chore: update dekko

* chore: rm lib dekko

* chore: update dist dekko

* chore: udpate bundle size

* test: update snapshot

* test: rm theme test

* test: update snapshot

* test: update snapshot

* chore: copy reset.css

* test: update image test

* chore: copy reset.css to es

* chore: update site script
2022-07-05 21:55:21 +08:00

69 lines
2.0 KiB
TypeScript

import type { CSSObject } from '@ant-design/cssinjs';
import type { FullToken, GenerateStyle } from '../../theme';
import { genComponentStyleHook, mergeToken, resetComponent } from '../../theme';
interface StatisticToken extends FullToken<'Statistic'> {
statisticTitleFontSize: number;
statisticContentFontSize: number;
statisticFontFamily: string;
}
const genStatisticStyle: GenerateStyle<StatisticToken> = (token: StatisticToken): CSSObject => {
const {
componentCls,
marginXXS,
padding,
colorTextSecondary,
statisticTitleFontSize,
colorTextHeading,
statisticContentFontSize,
statisticFontFamily,
} = token;
return {
[`${componentCls}`]: {
...resetComponent(token),
[`${componentCls}-title`]: {
marginBottom: marginXXS,
color: colorTextSecondary,
fontSize: statisticTitleFontSize,
},
[`${componentCls}-skeleton`]: {
paddingTop: padding,
},
[`${componentCls}-content`]: {
color: colorTextHeading,
fontSize: statisticContentFontSize,
fontFamily: statisticFontFamily,
[`${componentCls}-content-value`]: {
display: 'inline-block',
direction: 'ltr',
},
[`${componentCls}-content-prefix, ${componentCls}-content-suffix`]: {
display: 'inline-block',
},
[`${componentCls}-content-prefix`]: {
marginInlineEnd: marginXXS,
},
[`${componentCls}-content-suffix`]: {
marginInlineStart: marginXXS,
},
},
},
};
};
// ============================== Export ==============================
export default genComponentStyleHook('Statistic', token => {
const { fontSizeHeading3, fontSize, fontFamily } = token;
const statisticToken = mergeToken<StatisticToken>(token, {
statisticTitleFontSize: fontSize,
statisticContentFontSize: fontSizeHeading3,
statisticFontFamily: fontFamily,
});
return [genStatisticStyle(statisticToken)];
});