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

fix(logs): fix terminal layout

Browse Source
This commit is contained in:
mawkone
2026-06-14 12:44:19 -07:00
parent 7e67e480bb
commit 4c0754de33
2 changed files with 39 additions and 38 deletions
Download Patch File Download Diff File Expand all files Collapse all files

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

@@ -153,41 +153,42 @@ export default function LogsPage() {
position: "relative", position: "relative",
}} }}
> >
<Terminal <div
sequence={false} style={{
className="w-full max-w-none h-full max-h-none border-gray-200 dark:border-gray-800 shadow-sm" display: "flex",
justifyContent: "space-between",
alignItems: "center",
marginBottom: 16,
}}
> >
<div <span
style={{ style={{
display: "flex", fontSize: "0.85rem",
justifyContent: "space-between", fontWeight: 600,
alignItems: "center", color: THEME.ink,
marginBottom: 16,
}} }}
> >
<span {live.find((a) => a.uuid === activeUuid)?.name ?? "Logs"}
style={{ </span>
fontSize: "0.85rem", <SecondaryButton
fontWeight: 600, icon={
color: "#fff", logsLoading ? (
}} <Loader2 size={14} className="animate-spin" />
> ) : (
{live.find((a) => a.uuid === activeUuid)?.name ?? "Logs"} <RefreshCw size={14} />
</span> )
<SecondaryButton }
icon={ onClick={() => activeUuid && fetchLogs(activeUuid)}
logsLoading ? ( disabled={logsLoading}
<Loader2 size={14} className="animate-spin" /> >
) : ( Refresh
<RefreshCw size={14} /> </SecondaryButton>
) </div>
}
onClick={() => activeUuid && fetchLogs(activeUuid)} <Terminal
disabled={logsLoading} sequence={false}
> className="w-full max-w-none shadow-sm flex-1"
Refresh >
</SecondaryButton>
</div>
<div <div
style={{ style={{
color: "#e5e5e5", color: "#e5e5e5",

14
vibn-frontend/components/ui/terminal.tsx
View File

@@ -275,19 +275,19 @@ export const Terminal = ({
<div <div
ref={containerRef} ref={containerRef}
className={cn( className={cn(
"z-0 h-full max-h-100 w-full max-w-lg rounded-xl border border-[#27272a] bg-[#0a0a0a] text-white", "z-0 h-full w-full rounded-xl border border-[#27272a] bg-[#0a0a0a] text-white flex flex-col overflow-hidden",
className, className,
)} )}
> >
<div className="flex flex-col gap-y-2 border-b border-[#27272a] p-4"> <div className="flex flex-col gap-y-2 border-b border-[#27272a] p-4 shrink-0">
<div className="flex flex-row gap-x-2"> <div className="flex flex-row gap-x-2">
<div className="h-2 w-2 rounded-full bg-red-500"></div> <div className="h-3 w-3 rounded-full bg-[#ff5f56]"></div>
<div className="h-2 w-2 rounded-full bg-yellow-500"></div> <div className="h-3 w-3 rounded-full bg-[#ffbd2e]"></div>
<div className="h-2 w-2 rounded-full bg-green-500"></div> <div className="h-3 w-3 rounded-full bg-[#27c93f]"></div>
</div> </div>
</div> </div>
<pre className="p-4"> <pre className="p-4 flex-1 overflow-auto m-0">
<code className="grid gap-y-1 overflow-auto">{wrappedChildren}</code> <code className="grid gap-y-1">{wrappedChildren}</code>
</pre> </pre>
</div> </div>
); );