From 6e2d3d5db4e47fb23a54553d2c61452b90fb743f Mon Sep 17 00:00:00 2001 From: Juan Barbat Date: Sun, 1 Nov 2026 12:01:10 -0300 Subject: [PATCH] feat(herdr): show the Refactoria beard on the collapsed sidebar On the macOS rail the traffic lights fill the header row, so the logo was hidden. The header now grows to 84px while collapsed and draws the beard alone under the traffic lights, then returns to 46px when expanded. --- herdr/desktop/mods/refactoria-chrome/main.js | 25 +++++++++++++++++++- 1 file changed, 24 insertions(+), 1 deletion(-) diff --git a/herdr/desktop/mods/refactoria-chrome/main.js b/herdr/desktop/mods/refactoria-chrome/main.js index a2f590c..aba6a52 100644 --- a/herdr/desktop/mods/refactoria-chrome/main.js +++ b/herdr/desktop/mods/refactoria-chrome/main.js @@ -1,5 +1,6 @@ // Clone of the shipped workspace-chrome mod: same header and footer, with the -// Refactoria beard and wordmark in place of the Herdr logo and name. +// Refactoria beard and wordmark in place of the Herdr logo and name. On the +// macOS rail the header grows so the beard alone fits under the traffic lights. import { View, div, image, svg } from "gpui-kit"; import { h_flex, v_flex } from "gpui-base"; import { theme, run, props, window, shared, setShared, updates, layout } from "herdr"; @@ -25,6 +26,21 @@ function toggleSidebar() { run("layout.resize", { id: "sidebar", px: narrow() ? (shared("sidebar.width") ?? 268) : window()?.platform === "macos" ? 76 : 44 }); } +// Header height: the shipped 46px, taller on the macOS rail to hold the beard. +const BRAND_PX = 46; +const BRAND_RAIL_PX = 84; + +// Keep the brand block's height in step with the rail, whichever way it narrowed +// (the toggle button or dragging the edge). Asks once per change. +let pendingBrandPx = null; +function syncBrandHeight(want) { + const current = find(layout(), "brand")?.size?.px; + if (current === undefined || current === want) { pendingBrandPx = null; return; } + if (pendingBrandPx === want) return; + pendingBrandPx = want; + run("layout.resize", { id: "brand", px: want }); +} + export default class RefactoriaChrome extends View { button(id, label, action) { const t = theme(); @@ -44,6 +60,13 @@ export default class RefactoriaChrome extends View { .when(Boolean(updates().app.ready), el => el.child(div().size(6).rounded_full().bg(t.accent)))) .child(row("machine", "plus", "Add machine", true, () => run("mod.open", { name: "machine-add" }))); } + const macRail = collapsed && window()?.platform === "macos"; + syncBrandHeight(macRail ? BRAND_RAIL_PX : BRAND_PX); + if (macRail) { + // The traffic lights fill the top row; the beard sits under them. + return v_flex().size_full().bg(t.chrome).items_center().justify_end().pb(10) + .child(image("mods/refactoria-chrome/logo.png").size(28).rounded(6)); + } return h_flex().size_full().bg(t.chrome).pl(collapsed ? 6 : 14).pr(10).gap(4).items_center().text_size(13.5) .when(window()?.platform === "macos" && !collapsed, el => el.pl(76)) .when(!collapsed, el => el.child(h_flex().flex_1().gap(8).items_center().child(image("mods/refactoria-chrome/logo.png").size(20).rounded(5)).child(image("mods/refactoria-chrome/wordmark.png").h(16).w(108))))