devsyncwrld/backspace
1
0
Fork 0
Code Issues Pull Requests Actions 23 Packages Projects Releases Wiki Activity

fix(brand): logo.png uses full badge, not bare mark

Browse Source 
The SpaceSidebar's home tile is a 40×40 rounded-[20px] squircle with
object-cover. The original spec assumed the sidebar provides "the
colour-circle frame," so logo.png shipped as the bare gradient B on
transparent. In practice the tile is a transparent slot — the bare
mark touched the squircle edges (no internal padding), conflicted
with the active-state ring, and read as poorly-integrated.

Switching to the full badge (Element 1 / app-icon.svg): the badge's
own dark squircle bg fills the tile, its internal padding around the
mark keeps the gradient off the edges, and the result reads as a
clean Discord-style "home space" tile alongside the user's other
spaces.

Only logo.png regenerated; remaining 21 outputs byte-identical
(determinism gate verified). Spec output matrix and generator README
updated to reflect the corrected source mapping.
This commit is contained in:
Jannis Braun
2026-04-27 15:06:22 +02:00
parent 37797562d7
commit 6b71aecc28
3 changed files with 8 additions and 4 deletions
Download Patch File Download Diff File Expand all files Collapse all files
scripts/gen-icons.README.md
+2 -2
View File
@@ -39,8 +39,8 @@ git history clean.
| Brand source | Drives |
|---------------------------------|-----------------------------------------------|
| `assets/brand/app-icon.svg` | Every full app icon, all favicons, PWA |
| `assets/brand/mark.svg` | Win/Linux tray, in-app logo, PWA maskable |
| `assets/brand/app-icon.svg` | Every full app icon, all favicons, PWA, in-app `logo.png` |
| `assets/brand/mark.svg` | Win/Linux tray, PWA maskable inner mark |
| `assets/brand/mark-mono-dark.svg` | macOS menu-bar template (alpha + black) |
`Artworks-Backspace/` is the design archive — never read by this script.
scripts/gen-icons.mjs
+6 -2
View File
@@ -200,8 +200,12 @@ async function main() {
);
trace('pwa-maskable', join(WEB_ICONS, 'icon-maskable-512.png'), `512 (60% mark on ${MASKABLE_BG})`);
await writePng(join(WEB_ICONS, 'logo.png'), mark, 256);
trace('in-app-logo', join(WEB_ICONS, 'logo.png'), '256 (transparent)');
// SpaceSidebar's 40×40 rounded-[20px] tile uses object-cover. The full
// badge (Element 1) integrates cleanly because its dark bg fills the tile
// and its internal padding keeps the mark off the tile edges. Bare mark
// on transparent touched the tile edges and conflicted with active rings.
await writePng(join(WEB_ICONS, 'logo.png'), appIcon, 256);
trace('in-app-logo', join(WEB_ICONS, 'logo.png'), '256 (full badge)');
// --- Summary ---
const fmtBytes = (n) => {