Skip to content

Commit 2603a99

Browse files
committed
fix(desktop): span status bar full viewport width
Move the status bar out of #main-col so it sits at the #app root like VS Code, spanning edge-to-edge under the icon rail and section panel.
1 parent def2ad7 commit 2603a99

2 files changed

Lines changed: 41 additions & 26 deletions

File tree

libs/naas-abi/naas_abi/apps/desktop/gui/web/index.html

Lines changed: 27 additions & 25 deletions
Original file line numberDiff line numberDiff line change
@@ -9,6 +9,7 @@
99
</head>
1010
<body>
1111
<div id="app">
12+
<div id="app-shell">
1213
<!-- Icon rail (Nexus Sidebar, collapsed w-14) -->
1314
<nav id="rail" class="glass">
1415
<div class="rail-top">
@@ -359,32 +360,33 @@ <h2>Models</h2>
359360
</div>
360361
</section>
361362
</main>
362-
363-
<footer id="status-bar" aria-label="Status bar">
364-
<div class="status-bar-left">
365-
<button
366-
id="workspace-switcher"
367-
class="workspace-switcher status-segment status-segment-clickable"
368-
type="button"
369-
title="Switch workspace"
370-
aria-haspopup="menu"
371-
aria-expanded="false"
372-
>
373-
<span id="workspace-name">workspace</span>
374-
<span class="workspace-chevron" data-icon="chevron-down" data-size="12"></span>
375-
</button>
376-
<button type="button" id="status-git" class="status-segment status-segment-mono" title="Git branch"></button>
377-
</div>
378-
<div class="status-bar-right">
379-
<button type="button" id="status-harness" class="status-segment status-segment-clickable" title="Harness"></button>
380-
<span id="status-harness-dot" class="status-dot" title="Harness connection"></span>
381-
<span id="status-agent" class="status-segment" title="Active agent"></span>
382-
<button type="button" id="status-model" class="status-segment status-segment-clickable" title="Default model"></button>
383-
<span id="status-cpu" class="status-segment status-segment-optional hidden" title="CPU usage"></span>
384-
<span id="status-context" class="status-segment status-segment-optional hidden" title="Context window usage"></span>
385-
</div>
386-
</footer>
387363
</div>
364+
</div>
365+
366+
<footer id="status-bar" aria-label="Status bar">
367+
<div class="status-bar-left">
368+
<button
369+
id="workspace-switcher"
370+
class="workspace-switcher status-segment status-segment-clickable"
371+
type="button"
372+
title="Switch workspace"
373+
aria-haspopup="menu"
374+
aria-expanded="false"
375+
>
376+
<span id="workspace-name">workspace</span>
377+
<span class="workspace-chevron" data-icon="chevron-down" data-size="12"></span>
378+
</button>
379+
<button type="button" id="status-git" class="status-segment status-segment-mono" title="Git branch"></button>
380+
</div>
381+
<div class="status-bar-right">
382+
<button type="button" id="status-harness" class="status-segment status-segment-clickable" title="Harness"></button>
383+
<span id="status-harness-dot" class="status-dot" title="Harness connection"></span>
384+
<span id="status-agent" class="status-segment" title="Active agent"></span>
385+
<button type="button" id="status-model" class="status-segment status-segment-clickable" title="Default model"></button>
386+
<span id="status-cpu" class="status-segment status-segment-optional hidden" title="CPU usage"></span>
387+
<span id="status-context" class="status-segment status-segment-optional hidden" title="Context window usage"></span>
388+
</div>
389+
</footer>
388390
</div>
389391

390392
<!-- Workspace switcher dropdown (portal, Nexus-inspired) -->

libs/naas-abi/naas_abi/apps/desktop/gui/web/style.css

Lines changed: 14 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -76,7 +76,18 @@ input, textarea, select { font: inherit; color: inherit; }
7676
-webkit-backdrop-filter: blur(12px);
7777
}
7878

79-
#app { display: flex; height: 100vh; }
79+
#app {
80+
display: flex;
81+
flex-direction: column;
82+
height: 100vh;
83+
}
84+
85+
#app-shell {
86+
display: flex;
87+
flex: 1;
88+
min-height: 0;
89+
min-width: 0;
90+
}
8091

8192
svg.icon { flex-shrink: 0; }
8293

@@ -516,6 +527,7 @@ svg.icon { flex-shrink: 0; }
516527
/* ============ Status bar (VS Code inspired) ============ */
517528

518529
#status-bar {
530+
width: 100%;
519531
height: 22px;
520532
flex-shrink: 0;
521533
display: flex;
@@ -528,6 +540,7 @@ svg.icon { flex-shrink: 0; }
528540
font-size: 11px;
529541
color: var(--muted-foreground);
530542
user-select: none;
543+
border-radius: 0;
531544
}
532545

533546
.status-bar-left,

0 commit comments

Comments
 (0)