Fix Stage-1 layout regressions; ListView fills the pane
Three layouts collapsed in fe028a9, where the isMacChrome branches were
removed by a scripted edit that was wrong in two ways. The *bindings* were
dead by construction; the layout classes inside them were not, and nothing
replaced them.
- tab-bar: the edit appended a second `class` attribute to an element that
already had one. A duplicate attribute is silently dropped, so the
workspace strip lost h-9/pt-1/pl-1.5 entirely and collapsed under the
title bar. Merged into one attribute, with a comment saying why there is
exactly one. A template sweep found no other element carrying two.
- connection-manager + editor-window <header>: the edit deleted all five
[class.h-*]/[class.pl-*] bindings and put nothing back, leaving both
headers with no height and no left padding. Restored h-9 pl-3 (the
non-mac arm) and dropped the now-false "on macOS this row IS the
titlebar" comments — every window is frameless now.
Separately, the ListView never filled its panel: 7.css sets table-layout:
fixed but declares no width, so the table shrank to content and left a dead
grey gutter down the right of each pane. w-full is safe as a utility
precisely because 7.css declares no width for `skin` to outrank it with;
the unsized first <col> then absorbs the slack, which is what makes Name
elastic.
Verified on a live window capture, not from a build log: the tab strip has
its height back and both tables reach the pane edge. The connection-manager
window needs a click to reach and is unverified visually — its fix is a
verbatim copy of the editor-window one.
Co-Authored-By: Claude <noreply@anthropic.com>
This commit is contained in:
@@ -5,10 +5,10 @@
|
|||||||
[resizable]="false"
|
[resizable]="false"
|
||||||
(closeRequested)="close()"
|
(closeRequested)="close()"
|
||||||
/>
|
/>
|
||||||
<!-- header: on macOS this row IS the titlebar (hiddenInset + drag region),
|
<!-- Toolbar strip under the title bar. h-9/pl-3 are load-bearing: without a
|
||||||
elsewhere the native titlebar sits above and this is a compact strip -->
|
height this row collapses onto the icon and the screen reads as broken. -->
|
||||||
<header
|
<header
|
||||||
class="w7-toolbar flex shrink-0 items-center gap-2 border-b border-border bg-chrome pr-2"
|
class="w7-toolbar flex h-9 shrink-0 items-center gap-2 border-b border-border bg-chrome pr-2 pl-3"
|
||||||
>
|
>
|
||||||
<ng-icon name="mynaServers" size="0.95rem" class="shrink-0 text-muted-foreground" />
|
<ng-icon name="mynaServers" size="0.95rem" class="shrink-0 text-muted-foreground" />
|
||||||
<h1 class="text-sm font-semibold">{{ i18n.t('connMgr.title') }}</h1>
|
<h1 class="text-sm font-semibold">{{ i18n.t('connMgr.title') }}</h1>
|
||||||
|
|||||||
@@ -13,10 +13,10 @@
|
|||||||
<!-- The window is frameless. The X runs the SAME dirty prompt as ⌘W and
|
<!-- The window is frameless. The X runs the SAME dirty prompt as ⌘W and
|
||||||
the Close button — never a raw window close. -->
|
the Close button — never a raw window close. -->
|
||||||
<app-title-bar [title]="ctx.name + (dirty() ? ' *' : '')" (closeRequested)="requestClose()" />
|
<app-title-bar [title]="ctx.name + (dirty() ? ' *' : '')" (closeRequested)="requestClose()" />
|
||||||
<!-- header: on macOS this row IS the titlebar (hiddenInset + drag region),
|
<!-- Toolbar strip under the title bar. h-9/pl-3 are load-bearing: without a
|
||||||
elsewhere the native titlebar sits above and this is a compact strip -->
|
height this row collapses onto the icon and the screen reads as broken. -->
|
||||||
<header
|
<header
|
||||||
class="w7-toolbar flex shrink-0 items-center gap-2 border-b border-border bg-chrome pr-2"
|
class="w7-toolbar flex h-9 shrink-0 items-center gap-2 border-b border-border bg-chrome pr-2 pl-3"
|
||||||
>
|
>
|
||||||
<ng-icon name="mynaFileText" size="0.95rem" class="shrink-0 text-muted-foreground" />
|
<ng-icon name="mynaFileText" size="0.95rem" class="shrink-0 text-muted-foreground" />
|
||||||
<h1 class="min-w-0 truncate font-mono text-sm font-semibold">
|
<h1 class="min-w-0 truncate font-mono text-sm font-semibold">
|
||||||
|
|||||||
@@ -241,8 +241,13 @@
|
|||||||
<!-- 7.css ListView: a plain <table>. The header is <thead> (7.css makes it
|
<!-- 7.css ListView: a plain <table>. The header is <thead> (7.css makes it
|
||||||
position:sticky, which is why it moved in here), the sorted column is
|
position:sticky, which is why it moved in here), the sorted column is
|
||||||
.highlighted.indicator[.up], and the selection band is tr.highlighted.
|
.highlighted.indicator[.up], and the selection band is tr.highlighted.
|
||||||
Widths come from <colgroup> because 7.css sets table-layout:fixed. -->
|
Widths come from <colgroup> because 7.css sets table-layout:fixed.
|
||||||
<table [class.is-active]="isActive()">
|
`w-full` is Tailwind's job and safe here: 7.css never declares `width` on
|
||||||
|
table, so the `skin` layer has nothing to outrank `utilities` with.
|
||||||
|
Without it the fixed layout shrinks to content and leaves a dead grey
|
||||||
|
gutter down the right of the pane; with it the unsized first <col>
|
||||||
|
absorbs the slack, which is what makes Name the elastic column. -->
|
||||||
|
<table class="w-full" [class.is-active]="isActive()">
|
||||||
<colgroup>
|
<colgroup>
|
||||||
<col />
|
<col />
|
||||||
@for (col of visibleColumns(); track col.key) {
|
@for (col of visibleColumns(); track col.key) {
|
||||||
|
|||||||
@@ -38,11 +38,12 @@ const CONCURRENCY_CHOICES = [2, 3, 4, 6, 8] as const;
|
|||||||
selector: 'app-tab-bar',
|
selector: 'app-tab-bar',
|
||||||
imports: [NgIcon],
|
imports: [NgIcon],
|
||||||
template: `
|
template: `
|
||||||
<!-- On macOS this row IS the titlebar (hiddenInset): taller, padded past the
|
<!-- The workspace strip, directly under the title bar. Draggable so the
|
||||||
traffic lights, and draggable. Elsewhere it's a normal compact row. -->
|
empty stretch between the tabs and the right-hand tools still moves the
|
||||||
|
frameless window. ONE class attribute: a second one is silently dropped
|
||||||
|
by the template parser, which is exactly how this row lost its height. -->
|
||||||
<div
|
<div
|
||||||
class="w7-toolbar relative flex items-center gap-0.5 border-b border-border bg-chrome pr-1.5 electrobun-webkit-app-region-drag"
|
class="w7-toolbar relative flex h-9 items-center gap-0.5 border-b border-border bg-chrome pt-1 pr-1.5 pl-1.5 electrobun-webkit-app-region-drag"
|
||||||
class="h-9 pt-1 pl-1.5"
|
|
||||||
>
|
>
|
||||||
<div
|
<div
|
||||||
#tabScroll
|
#tabScroll
|
||||||
|
|||||||
Reference in New Issue
Block a user