fix(group): 分组页面包屑与详情页统一
分组页改用 @stash/ui 的 Breadcrumb,去掉带边框的按钮样式和独立分隔符
This commit is contained in:
@@ -358,17 +358,6 @@
|
||||
margin-top: var(--su-space-4);
|
||||
}
|
||||
|
||||
.group-crumbs {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: var(--su-space-2);
|
||||
padding: var(--su-space-2) var(--su-space-3);
|
||||
}
|
||||
|
||||
.group-crumb-sep {
|
||||
color: var(--su-text-muted);
|
||||
}
|
||||
|
||||
.group-child-block {
|
||||
margin-top: var(--su-space-2);
|
||||
}
|
||||
|
||||
+12
-17
@@ -1,4 +1,5 @@
|
||||
import {
|
||||
Breadcrumb,
|
||||
Empty,
|
||||
EngineIcon,
|
||||
Layout,
|
||||
@@ -606,23 +607,17 @@ export default function AppNext() {
|
||||
|
||||
return (
|
||||
<div className="detail-view">
|
||||
<nav className="detail-breadcrumb group-crumbs">
|
||||
<button type="button" className="link-button" onClick={() => navigate('/')}>
|
||||
首页
|
||||
</button>
|
||||
{trail.map((node) => (
|
||||
<span key={node.key}>
|
||||
<span className="group-crumb-sep">/</span>
|
||||
<button
|
||||
type="button"
|
||||
className="link-button"
|
||||
onClick={() => navigate(`/g/${encodeURIComponent(node.key)}`)}
|
||||
>
|
||||
{node.title}
|
||||
</button>
|
||||
</span>
|
||||
))}
|
||||
</nav>
|
||||
<Breadcrumb
|
||||
className="detail-breadcrumb"
|
||||
items={[
|
||||
{ label: '首页', href: '/' },
|
||||
...trail.map((node) => ({
|
||||
label: node.title,
|
||||
href: `/g/${encodeURIComponent(node.key)}`,
|
||||
})),
|
||||
]}
|
||||
onNavigate={navigate}
|
||||
/>
|
||||
|
||||
<div className="detail-hero">
|
||||
<span className="detail-hero-icon" aria-hidden="true">
|
||||
|
||||
Reference in New Issue
Block a user