test/ant-design
1
0
Fork 0
mirror of https://gitee.com/ant-design/ant-design.git synced 2024-12-02 20:19:44 +08:00
Code Issues Actions 84 Packages Projects Releases Wiki Activity

chore: sync master style

Browse Source
This commit is contained in:
zombiej 2022-05-21 22:53:33 +08:00
parent 409eee2254
commit aeafcd5493
1 changed files with 9 additions and 15 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

24
components/anchor/style/index.tsx
View File

@ -1,7 +1,7 @@
// deps-lint-skip-all // deps-lint-skip-all
import type { CSSObject } from '@ant-design/cssinjs'; import type { CSSObject } from '@ant-design/cssinjs';
import type { FullToken, GenerateStyle } from '../../_util/theme';
import { genComponentStyleHook, mergeToken, resetComponent } from '../../_util/theme'; import { genComponentStyleHook, mergeToken, resetComponent } from '../../_util/theme';
import type { GenerateStyle, FullToken } from '../../_util/theme';
export interface ComponentToken {} export interface ComponentToken {}
@ -10,7 +10,6 @@ interface AnchorToken extends FullToken<'Anchor'> {
anchorPaddingBlock: number; anchorPaddingBlock: number;
anchorPaddingBlockSecondary: number; anchorPaddingBlockSecondary: number;
anchorPaddingInline: number; anchorPaddingInline: number;
anchorLineHeight: number;
anchorBallSize: number; anchorBallSize: number;
anchorTitleBlock: number; anchorTitleBlock: number;
} }
@ -74,7 +73,6 @@ const genSharedAnchorStyle: GenerateStyle<AnchorToken> = (token): CSSObject => {
[`${componentCls}-link`]: { [`${componentCls}-link`]: {
paddingBlock: token.anchorPaddingBlock, paddingBlock: token.anchorPaddingBlock,
paddingInline: `${token.anchorPaddingInline}px 0`, paddingInline: `${token.anchorPaddingInline}px 0`,
lineHeight: token.anchorLineHeight,
'&-title': { '&-title': {
position: 'relative', position: 'relative',
@ -111,24 +109,20 @@ const genSharedAnchorStyle: GenerateStyle<AnchorToken> = (token): CSSObject => {
// ============================== Export ============================== // ============================== Export ==============================
export default genComponentStyleHook('Anchor', token => { export default genComponentStyleHook('Anchor', token => {
const { controlHeight, controlLineWidth, fontSize, lineHeight, fontSizeLG, padding, paddingXXS } = const { fontSize, lineHeight, fontSizeLG, padding, paddingXXS } = token;
token;
const linkHeight = controlHeight - 2 * controlLineWidth;
const anchorLineHeight = fontSizeLG / fontSize; // Anchor is special that use less height
const paddingBlock = Math.round(linkHeight - fontSizeLG) / 2;
// Still a magic number: 22 - 16 const fontHeight = Math.round(fontSize * lineHeight);
const titleBlock = Math.round(fontSize * lineHeight - fontSizeLG);
const paddingBlockSecondary = Math.round(linkHeight - paddingXXS - fontSizeLG) / 2; // Still a magic number: 36 & 26
const titleHeight = (fontSize / 14) * 36;
const subTitleHeight = (fontSize / 14) * 26;
const anchorToken = mergeToken<AnchorToken>(token, { const anchorToken = mergeToken<AnchorToken>(token, {
holderOffsetBlock: paddingXXS, holderOffsetBlock: paddingXXS,
anchorPaddingBlock: paddingBlock, anchorPaddingBlock: (titleHeight - fontHeight) / 2,
anchorPaddingBlockSecondary: paddingBlockSecondary, anchorPaddingBlockSecondary: (subTitleHeight - fontHeight) / 2,
anchorPaddingInline: padding, anchorPaddingInline: padding,
anchorLineHeight, anchorTitleBlock: (fontSize / 14) * 3,
anchorTitleBlock: titleBlock,
anchorBallSize: fontSizeLG / 2, anchorBallSize: fontSizeLG / 2,
}); });
return [genSharedAnchorStyle(anchorToken)]; return [genSharedAnchorStyle(anchorToken)];