azmat1127/yingqing
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Polish navigation and pipeline flow

Browse Source
This commit is contained in:
iye
2026-05-28 15:35:32 +08:00
parent bbe29622c2
commit df7b90934a
8 changed files with 782 additions and 66 deletions
Download Patch File Download Diff File Expand all files Collapse all files
电商AI平台/assets/restraint.css
+100 -3
View File
@@ -218,7 +218,13 @@ img, svg, video { display: block; max-width: 100%; }
.divider { height: 1px; background: var(--border-faint); margin: 16px 0; }
/* ─── App shell ─── */
.app { display: grid; grid-template-columns: 248px 1fr; min-height: 100vh; }
.app {
display: grid;
grid-template-columns: 248px 1fr;
min-height: 100vh;
transition: grid-template-columns var(--t-base);
}
body.sidebar-collapsed .app { grid-template-columns: 96px 1fr; }
/* ─── Sidebar ─── */
aside.sidebar {
@@ -229,12 +235,61 @@ aside.sidebar {
top: 0;
height: 100vh;
overflow-y: auto;
transition: padding var(--t-base);
}
.brand { display: flex; align-items: center; padding: 2px 8px 16px; min-height: 44px; }
.brand-logo { display: block; width: 142px; height: auto; margin: -8px 0 -6px -8px; object-fit: contain; }
.sidebar-head {
display: flex;
align-items: center;
padding: 2px 8px 16px;
min-height: 44px;
}
.brand { display: flex; align-items: center; min-width: 0; color: var(--accent-black); }
.brand-clip {
display: block;
width: 142px;
overflow: hidden;
transition: width var(--t-base);
}
.brand-logo { display: block; width: 142px; max-width: none; height: auto; margin: -8px 0 -6px -8px; object-fit: contain; }
.brand-mark, .flame { width: 22px; height: 22px; color: var(--heat); }
.brand-mark svg, .flame svg { width: 100%; height: 100%; }
.brand .name { font-weight: 600; font-size: 18px; letter-spacing: -.012em; color: var(--accent-black); }
.sidebar-toggle {
position: fixed;
top: 0;
left: 220px;
z-index: 70;
width: 28px;
height: 100vh;
border: 0;
border-radius: 0;
background: transparent;
color: var(--black-alpha-48);
display: flex;
align-items: center;
justify-content: center;
cursor: pointer;
opacity: 1;
pointer-events: auto;
transition: color var(--t-base), background var(--t-base);
}
.sidebar-toggle:hover,
.sidebar-toggle:focus-visible {
background: var(--black-alpha-4);
backdrop-filter: blur(4px);
-webkit-backdrop-filter: blur(4px);
color: var(--accent-black);
outline: none;
}
.sidebar-toggle-icon {
display: block;
opacity: 0;
line-height: 1;
transition: opacity var(--t-base);
}
.sidebar-toggle:hover .sidebar-toggle-icon,
.sidebar-toggle:focus-visible .sidebar-toggle-icon { opacity: 1; }
.sidebar-toggle-icon--expand { display: none; }
/* sidebar search · Ctrl K Inter Bold 平铺 */
.search-box {
@@ -323,6 +378,47 @@ nav a.disabled:hover { background: transparent; color: var(--black-alpha-32); }
}
.user .em { font-size: 13px; color: var(--accent-black); }
body.sidebar-collapsed aside.sidebar { padding: 22px 12px; }
body.sidebar-collapsed .sidebar-head { gap: 6px; padding: 2px 0 16px; }
body.sidebar-collapsed .brand-clip {
width: 34px;
height: 34px;
display: flex;
align-items: center;
}
body.sidebar-collapsed .sidebar-toggle { left: 68px; }
body.sidebar-collapsed .sidebar-toggle-icon--collapse { display: none; }
body.sidebar-collapsed .sidebar-toggle-icon--expand { display: block; }
body.sidebar-collapsed .search-box {
justify-content: center;
gap: 0;
padding: 9px 0;
cursor: pointer;
}
body.sidebar-collapsed .search-box input,
body.sidebar-collapsed .search-box .kbd,
body.sidebar-collapsed aside.sidebar nav a span,
body.sidebar-collapsed aside.sidebar nav a .pill-mini,
body.sidebar-collapsed .user .em { display: none; }
body.sidebar-collapsed .nav-section {
height: 1px;
margin: 10px 0 8px;
padding: 0;
overflow: hidden;
color: transparent;
background: var(--border-faint);
}
body.sidebar-collapsed aside.sidebar nav a {
justify-content: center;
gap: 0;
padding: 10px 0;
}
body.sidebar-collapsed .aside-foot { padding-top: 12px; }
body.sidebar-collapsed .user {
justify-content: center;
padding: 8px 0;
}
/* ─── Main + grid background ─── */
main { position: relative; background: var(--background-base); min-width: 0; }
.grid-bg {
@@ -2028,6 +2124,7 @@ table.t tbody tr:hover { background: var(--black-alpha-4); }
@media (max-width: 1100px) {
.app { grid-template-columns: 1fr; }
aside.sidebar { display: none; }
.sidebar-toggle { display: none; }
.stats { grid-template-columns: repeat(2, 1fr); }
.stat:nth-child(2) { border-right: 0; }
.stat:nth-child(1), .stat:nth-child(2) { border-bottom: 1px solid var(--border-faint); }