mark/vibn-agent-runner
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fix(codebase): optimize layout for editor view

Browse Source 
- Removes top PageHeader to maximize vertical space.

- Sets layout padding tighter.

- Dynamically replaces 'Code files' header with the repository name (if single repo).

- Hides redundant nested tile header when there's only one codebase.
This commit is contained in:
mawkone
2026-06-14 13:25:35 -07:00
parent 9766990e70
commit c56a39d763
1 changed files with 55 additions and 29 deletions
Download Patch File Download Diff File Expand all files Collapse all files

84
vibn-frontend/app/[workspace]/project/[projectId]/(home)/code/page.tsx
View File

@@ -53,18 +53,23 @@ export default function CodeTab() {
minHeight: "100vh",
background: THEME.canvasGradient,
fontFamily: THEME.font,
padding: "36px 48px",
padding: "24px",
}}
>
<div style={{ maxWidth: 1400, margin: "0 auto" }}>
<PageHeader title="Codebase" />
<div
style={{
maxWidth: "100%",
margin: "0 auto",
height: "calc(100vh - 48px)",
}}
>
<Card
padding={0}
style={{
overflow: "hidden",
display: "flex",
flexDirection: "column",
minHeight: "calc(100vh - 150px)",
height: "100%",
}}
>
<div style={grid}>
@@ -104,7 +109,14 @@ export default function CodeTab() {
{anatomy && (
<>
{/* Code Files */}
<RailGroup title="Code files" count={codebases?.length ?? 0}>
<RailGroup
title={
codebases?.length === 1
? codebases[0].label
: "Code files"
}
count={codebases?.length ?? 0}
>
{codebases && codebases.length === 0 && (
<RailEmpty>
{reason === "no_repo" ? (
@@ -134,33 +146,47 @@ export default function CodeTab() {
flex: 1,
}}
>
<div
style={{ ...tileHeader, padding: "20px 24px 12px" }}
>
<span style={chevronCell}>
<ChevronDown
size={13}
style={{ color: THEME.mid }}
{codebases.length > 1 && (
<div
style={{
...tileHeader,
padding: "20px 24px 12px",
}}
>
<span style={chevronCell}>
<ChevronDown
size={13}
style={{ color: THEME.mid }}
/>
</span>
<Box
size={14}
style={{ color: THEME.mid, flexShrink: 0 }}
/>
</span>
<Box
size={14}
style={{ color: THEME.mid, flexShrink: 0 }}
/>
<div style={{ minWidth: 0, textAlign: "left" }}>
<div
style={{
fontSize: "0.95rem",
fontWeight: 600,
color: THEME.ink,
}}
>
{cb.label}
<div style={{ minWidth: 0, textAlign: "left" }}>
<div
style={{
fontSize: "0.95rem",
fontWeight: 600,
color: THEME.ink,
}}
>
{cb.label}
</div>
{cb.hint && (
<div style={tileHint}>{cb.hint}</div>
)}
</div>
{cb.hint && <div style={tileHint}>{cb.hint}</div>}
</div>
</div>
<div style={{ padding: "0 10px 24px 10px" }}>
)}
<div
style={{
padding:
codebases.length > 1
? "0 10px 24px 10px"
: "10px 10px 24px 10px",
}}
>
<GiteaFileTree
projectId={projectId}
rootPath={cb.path}