fix(mp): 修正 design token 字号对齐原型 + ContentCard margin prop
- tokens.scss: 修正字号 token 对齐 18 份原型稿 fontSize 统计
--tk-font-h1: 26→28px, --tk-font-h2: 24→22px
--tk-font-body-lg: 28→18px, --tk-font-body: 22→16px
--tk-font-body-sm: 16→14px
elder-mode 同步重新计算比例系数
- ContentCard: 新增 margin prop ('none'|'md'),margin-bottom
从 CSS 类移至 inline style,支持列表容器内无间距模式
- Profile 页: 用户卡片添加 profile-user-card flex 布局
菜单组/积分卡片使用 margin="none",修复布局对齐
- Login 页: SCSS 全部改为 design token 引用
This commit is contained in:
@@ -4,7 +4,6 @@
|
||||
background: var(--tk-card-bg);
|
||||
border-radius: var(--tk-card-radius);
|
||||
box-shadow: $shadow-sm;
|
||||
margin-bottom: var(--tk-gap-md);
|
||||
transition: background 0.15s, opacity 0.15s, transform 0.15s;
|
||||
|
||||
&--outlined {
|
||||
|
||||
@@ -7,6 +7,7 @@ interface ContentCardProps {
|
||||
variant?: 'default' | 'outlined' | 'elevated';
|
||||
onPress?: () => void;
|
||||
padding?: 'none' | 'sm' | 'md' | 'lg';
|
||||
margin?: 'none' | 'md';
|
||||
activeFeedback?: 'bg' | 'opacity' | 'scale' | 'none';
|
||||
className?: string;
|
||||
style?: CSSProperties;
|
||||
@@ -20,10 +21,16 @@ const PADDING_MAP = {
|
||||
lg: 'var(--tk-card-padding-lg)',
|
||||
} as const;
|
||||
|
||||
const MARGIN_MAP = {
|
||||
none: '0',
|
||||
md: 'var(--tk-gap-md)',
|
||||
} as const;
|
||||
|
||||
const ContentCard: React.FC<ContentCardProps> = ({
|
||||
variant = 'default',
|
||||
onPress,
|
||||
padding = 'md',
|
||||
margin = 'md',
|
||||
activeFeedback = 'bg',
|
||||
className,
|
||||
style,
|
||||
@@ -31,8 +38,9 @@ const ContentCard: React.FC<ContentCardProps> = ({
|
||||
}) => {
|
||||
const innerStyle = useMemo(() => ({
|
||||
padding: PADDING_MAP[padding],
|
||||
marginBottom: MARGIN_MAP[margin],
|
||||
...style,
|
||||
}), [padding, style]);
|
||||
}), [padding, margin, style]);
|
||||
|
||||
const hasPress = !!onPress;
|
||||
const cls = [
|
||||
|
||||
Reference in New Issue
Block a user