fix(web): 分区头恢复 44px 圆形图标、24/700 标题与 [n] 计数
- 图标:44×44 圆形 + 主色浅底(原来是裸字形 40px) - 标题:24/700(原来用 Title level=2 的 18/500) - 计数:改回旧版 [12] 文本(原来用了 Badge 胶囊) - 间距:图标下 8、标题行高 1.5、计数上 4,与原版逐像素一致
This commit is contained in:
+22
-1
@@ -334,10 +334,31 @@
|
|||||||
}
|
}
|
||||||
|
|
||||||
.detail-hero-icon {
|
.detail-hero-icon {
|
||||||
font-size: 40px;
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: center;
|
||||||
|
width: 44px;
|
||||||
|
height: 44px;
|
||||||
|
margin-bottom: var(--su-space-2);
|
||||||
|
border-radius: 50%;
|
||||||
|
background-color: var(--su-color-primary-soft);
|
||||||
|
color: var(--su-color-primary);
|
||||||
|
font-size: 24px;
|
||||||
line-height: 1;
|
line-height: 1;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.detail-hero-title {
|
||||||
|
font-size: var(--su-font-size-xl);
|
||||||
|
font-weight: var(--su-font-weight-strong);
|
||||||
|
line-height: 1.5;
|
||||||
|
}
|
||||||
|
|
||||||
|
.detail-hero-count {
|
||||||
|
margin-top: var(--su-space-1);
|
||||||
|
font-size: var(--su-font-size-md);
|
||||||
|
color: var(--su-text-muted);
|
||||||
|
}
|
||||||
|
|
||||||
.item-card {
|
.item-card {
|
||||||
display: flex;
|
display: flex;
|
||||||
flex-direction: column;
|
flex-direction: column;
|
||||||
|
|||||||
@@ -1,4 +1,4 @@
|
|||||||
import { Badge, Breadcrumb, Card, Empty, Space, Title } from '@stash/ui'
|
import { Breadcrumb, Card, Empty, Space, Title } from '@stash/ui'
|
||||||
import { categoryCount, type Category } from '../../data/types'
|
import { categoryCount, type Category } from '../../data/types'
|
||||||
import { AppGrid } from './AppGrid'
|
import { AppGrid } from './AppGrid'
|
||||||
import { CesCardGrid } from './CesCardGrid'
|
import { CesCardGrid } from './CesCardGrid'
|
||||||
@@ -83,8 +83,10 @@ export function DetailView({ category, groupId, onBack, onOpenItem }: DetailView
|
|||||||
<span className="detail-hero-icon" aria-hidden="true">
|
<span className="detail-hero-icon" aria-hidden="true">
|
||||||
{category.icon}
|
{category.icon}
|
||||||
</span>
|
</span>
|
||||||
<Title level={2}>{title}</Title>
|
<Title level={1} as="h2" weight="strong" className="detail-hero-title">
|
||||||
<Badge count={count} tone="neutral" />
|
{title}
|
||||||
|
</Title>
|
||||||
|
<span className="detail-hero-count">[{count}]</span>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
{renderBody()}
|
{renderBody()}
|
||||||
|
|||||||
Reference in New Issue
Block a user