Uh oh!
There was an error while loading. Please reload this page.
fix(desktop): pad dock icon to macOS safe area - #75
Merged
Conversation
icon.png shipped as a 1254² full-bleed image (artwork edge-to-edge, zero transparent margin), so macOS rendered it noticeably larger than sibling dock icons. Regenerate on the standard 1024² canvas with the squircle scaled to ~80% (824px) and centered, leaving the ~100px transparent margin macOS expects. Affects the dev `npm start` dock icon (app.dock.setIcon) and the BrowserWindow title-bar icon, both of which load assets/icon.png. Claude-Session: https://claude.ai/code/session_01KtNufPddivogjCYaQijf5t
jackwener added a commit
that referenced
this pull request
Jun 21, 2026
BIG VISIBLE redesign per WAWQAQ msg 5a461e0c — Skills page and 定时任务 (Plan/ Reminder) page now render as lifted white cards on the gray plate, matching the upstream reference design's aux-panel signature instead of sitting flat. Each page shell gets: - 1px solid var(--border) outline - 10px border-radius - soft lift shadow: 0 1px 2px + 0 8px 24px -16px (foreground-tinted) - generous inner padding (16/18px Skills, 18px Plan) - 320ms cubic-bezier(.16,1,.3,1) entrance (opacity 0->1, translateY 6->0) Surfaces touched: - .maka-skill-library outer container — new card chrome + padding 16/18, gap 12 -> 14, page-shell entrance animation - .maka-plan-shell outer container — new card chrome + padding 18, gap 10 -> 12, top padding tightened from clamp(16,3vh,32) to (16,3vh,24) - new shared @Keyframes maka-page-shell-enter - prefers-reduced-motion + visual-smoke fixture both drop the animation This is the structural pivot WAWQAQ asked for: pages no longer read as flat lists on a flat canvas — they read as composed cards on a plate. Inner sub-cards (.maka-skill-library-list, individual reminder cards) keep their existing 1px borders, giving the reference layout's nested card hierarchy. NOTE: icon test (dist/main/__tests__/localized-main-shell-contract.test.js:341) is pre-existing red on origin/main after the icon PR #75 merged, unrelated to this change. Verified by stashing this change and re-running — same red.
This was referenced Jun 21, 2026
jackwener pushed a commit
that referenced
this pull request
Jun 21, 2026
icon.png shipped as a 1254² full-bleed image (artwork edge-to-edge, zero transparent margin), so macOS rendered it noticeably larger than sibling dock icons. Regenerate on the standard 1024² canvas with the squircle scaled to ~80% (824px) and centered, leaving the ~100px transparent margin macOS expects. Affects the dev `npm start` dock icon (app.dock.setIcon) and the BrowserWindow title-bar icon, both of which load assets/icon.png. Claude-Session: https://claude.ai/code/session_01KtNufPddivogjCYaQijf5t
jackwener added a commit
that referenced
this pull request
Jun 21, 2026
BIG VISIBLE redesign per WAWQAQ msg 5a461e0c — Skills page and 定时任务 (Plan/ Reminder) page now render as lifted white cards on the gray plate, matching the upstream reference design's aux-panel signature instead of sitting flat. Each page shell gets: - 1px solid var(--border) outline - 10px border-radius - soft lift shadow: 0 1px 2px + 0 8px 24px -16px (foreground-tinted) - generous inner padding (16/18px Skills, 18px Plan) - 320ms cubic-bezier(.16,1,.3,1) entrance (opacity 0->1, translateY 6->0) Surfaces touched: - .maka-skill-library outer container — new card chrome + padding 16/18, gap 12 -> 14, page-shell entrance animation - .maka-plan-shell outer container — new card chrome + padding 18, gap 10 -> 12, top padding tightened from clamp(16,3vh,32) to (16,3vh,24) - new shared @Keyframes maka-page-shell-enter - prefers-reduced-motion + visual-smoke fixture both drop the animation This is the structural pivot WAWQAQ asked for: pages no longer read as flat lists on a flat canvas — they read as composed cards on a plate. Inner sub-cards (.maka-skill-library-list, individual reminder cards) keep their existing 1px borders, giving the reference layout's nested card hierarchy. NOTE: icon test (dist/main/__tests__/localized-main-shell-contract.test.js:341) is pre-existing red on origin/main after the icon PR #75 merged, unrelated to this change. Verified by stashing this change and re-running — same red.
jackwener pushed a commit
that referenced
this pull request
Jun 21, 2026
icon.png shipped as a 1254² full-bleed image (artwork edge-to-edge, zero transparent margin), so macOS rendered it noticeably larger than sibling dock icons. Regenerate on the standard 1024² canvas with the squircle scaled to ~80% (824px) and centered, leaving the ~100px transparent margin macOS expects. Affects the dev `npm start` dock icon (app.dock.setIcon) and the BrowserWindow title-bar icon, both of which load assets/icon.png. Claude-Session: https://claude.ai/code/session_01KtNufPddivogjCYaQijf5t
jackwener added a commit
that referenced
this pull request
Jun 21, 2026
BIG VISIBLE redesign per WAWQAQ msg 5a461e0c — Skills page and 定时任务 (Plan/ Reminder) page now render as lifted white cards on the gray plate, matching the upstream reference design's aux-panel signature instead of sitting flat. Each page shell gets: - 1px solid var(--border) outline - 10px border-radius - soft lift shadow: 0 1px 2px + 0 8px 24px -16px (foreground-tinted) - generous inner padding (16/18px Skills, 18px Plan) - 320ms cubic-bezier(.16,1,.3,1) entrance (opacity 0->1, translateY 6->0) Surfaces touched: - .maka-skill-library outer container — new card chrome + padding 16/18, gap 12 -> 14, page-shell entrance animation - .maka-plan-shell outer container — new card chrome + padding 18, gap 10 -> 12, top padding tightened from clamp(16,3vh,32) to (16,3vh,24) - new shared @Keyframes maka-page-shell-enter - prefers-reduced-motion + visual-smoke fixture both drop the animation This is the structural pivot WAWQAQ asked for: pages no longer read as flat lists on a flat canvas — they read as composed cards on a plate. Inner sub-cards (.maka-skill-library-list, individual reminder cards) keep their existing 1px borders, giving the reference layout's nested card hierarchy. NOTE: icon test (dist/main/__tests__/localized-main-shell-contract.test.js:341) is pre-existing red on origin/main after the icon PR #75 merged, unrelated to this change. Verified by stashing this change and re-running — same red.
jackwener pushed a commit
that referenced
this pull request
Jun 21, 2026
icon.png shipped as a 1254² full-bleed image (artwork edge-to-edge, zero transparent margin), so macOS rendered it noticeably larger than sibling dock icons. Regenerate on the standard 1024² canvas with the squircle scaled to ~80% (824px) and centered, leaving the ~100px transparent margin macOS expects. Affects the dev `npm start` dock icon (app.dock.setIcon) and the BrowserWindow title-bar icon, both of which load assets/icon.png. Claude-Session: https://claude.ai/code/session_01KtNufPddivogjCYaQijf5t
jackwener added a commit
that referenced
this pull request
Jun 21, 2026
BIG VISIBLE redesign per WAWQAQ msg 5a461e0c — Skills page and 定时任务 (Plan/ Reminder) page now render as lifted white cards on the gray plate, matching the upstream reference design's aux-panel signature instead of sitting flat. Each page shell gets: - 1px solid var(--border) outline - 10px border-radius - soft lift shadow: 0 1px 2px + 0 8px 24px -16px (foreground-tinted) - generous inner padding (16/18px Skills, 18px Plan) - 320ms cubic-bezier(.16,1,.3,1) entrance (opacity 0->1, translateY 6->0) Surfaces touched: - .maka-skill-library outer container — new card chrome + padding 16/18, gap 12 -> 14, page-shell entrance animation - .maka-plan-shell outer container — new card chrome + padding 18, gap 10 -> 12, top padding tightened from clamp(16,3vh,32) to (16,3vh,24) - new shared @Keyframes maka-page-shell-enter - prefers-reduced-motion + visual-smoke fixture both drop the animation This is the structural pivot WAWQAQ asked for: pages no longer read as flat lists on a flat canvas — they read as composed cards on a plate. Inner sub-cards (.maka-skill-library-list, individual reminder cards) keep their existing 1px borders, giving the reference layout's nested card hierarchy. NOTE: icon test (dist/main/__tests__/localized-main-shell-contract.test.js:341) is pre-existing red on origin/main after the icon PR #75 merged, unrelated to this change. Verified by stashing this change and re-running — same red.
jackwener pushed a commit
that referenced
this pull request
Jun 21, 2026
icon.png shipped as a 1254² full-bleed image (artwork edge-to-edge, zero transparent margin), so macOS rendered it noticeably larger than sibling dock icons. Regenerate on the standard 1024² canvas with the squircle scaled to ~80% (824px) and centered, leaving the ~100px transparent margin macOS expects. Affects the dev `npm start` dock icon (app.dock.setIcon) and the BrowserWindow title-bar icon, both of which load assets/icon.png. Claude-Session: https://claude.ai/code/session_01KtNufPddivogjCYaQijf5t
jackwener added a commit
that referenced
this pull request
Jun 21, 2026
BIG VISIBLE redesign per WAWQAQ msg 5a461e0c — Skills page and 定时任务 (Plan/ Reminder) page now render as lifted white cards on the gray plate, matching the upstream reference design's aux-panel signature instead of sitting flat. Each page shell gets: - 1px solid var(--border) outline - 10px border-radius - soft lift shadow: 0 1px 2px + 0 8px 24px -16px (foreground-tinted) - generous inner padding (16/18px Skills, 18px Plan) - 320ms cubic-bezier(.16,1,.3,1) entrance (opacity 0->1, translateY 6->0) Surfaces touched: - .maka-skill-library outer container — new card chrome + padding 16/18, gap 12 -> 14, page-shell entrance animation - .maka-plan-shell outer container — new card chrome + padding 18, gap 10 -> 12, top padding tightened from clamp(16,3vh,32) to (16,3vh,24) - new shared @Keyframes maka-page-shell-enter - prefers-reduced-motion + visual-smoke fixture both drop the animation This is the structural pivot WAWQAQ asked for: pages no longer read as flat lists on a flat canvas — they read as composed cards on a plate. Inner sub-cards (.maka-skill-library-list, individual reminder cards) keep their existing 1px borders, giving the reference layout's nested card hierarchy. NOTE: icon test (dist/main/__tests__/localized-main-shell-contract.test.js:341) is pre-existing red on origin/main after the icon PR #75 merged, unrelated to this change. Verified by stashing this change and re-running — same red.
jackwener pushed a commit
that referenced
this pull request
Jun 21, 2026
icon.png shipped as a 1254² full-bleed image (artwork edge-to-edge, zero transparent margin), so macOS rendered it noticeably larger than sibling dock icons. Regenerate on the standard 1024² canvas with the squircle scaled to ~80% (824px) and centered, leaving the ~100px transparent margin macOS expects. Affects the dev `npm start` dock icon (app.dock.setIcon) and the BrowserWindow title-bar icon, both of which load assets/icon.png. Claude-Session: https://claude.ai/code/session_01KtNufPddivogjCYaQijf5t
jackwener added a commit
that referenced
this pull request
Jun 21, 2026
BIG VISIBLE redesign per WAWQAQ msg 5a461e0c — Skills page and 定时任务 (Plan/ Reminder) page now render as lifted white cards on the gray plate, matching the upstream reference design's aux-panel signature instead of sitting flat. Each page shell gets: - 1px solid var(--border) outline - 10px border-radius - soft lift shadow: 0 1px 2px + 0 8px 24px -16px (foreground-tinted) - generous inner padding (16/18px Skills, 18px Plan) - 320ms cubic-bezier(.16,1,.3,1) entrance (opacity 0->1, translateY 6->0) Surfaces touched: - .maka-skill-library outer container — new card chrome + padding 16/18, gap 12 -> 14, page-shell entrance animation - .maka-plan-shell outer container — new card chrome + padding 18, gap 10 -> 12, top padding tightened from clamp(16,3vh,32) to (16,3vh,24) - new shared @Keyframes maka-page-shell-enter - prefers-reduced-motion + visual-smoke fixture both drop the animation This is the structural pivot WAWQAQ asked for: pages no longer read as flat lists on a flat canvas — they read as composed cards on a plate. Inner sub-cards (.maka-skill-library-list, individual reminder cards) keep their existing 1px borders, giving the reference layout's nested card hierarchy. NOTE: icon test (dist/main/__tests__/localized-main-shell-contract.test.js:341) is pre-existing red on origin/main after the icon PR #75 merged, unrelated to this change. Verified by stashing this change and re-running — same red.
jackwener pushed a commit
that referenced
this pull request
Jun 21, 2026
icon.png shipped as a 1254² full-bleed image (artwork edge-to-edge, zero transparent margin), so macOS rendered it noticeably larger than sibling dock icons. Regenerate on the standard 1024² canvas with the squircle scaled to ~80% (824px) and centered, leaving the ~100px transparent margin macOS expects. Affects the dev `npm start` dock icon (app.dock.setIcon) and the BrowserWindow title-bar icon, both of which load assets/icon.png. Claude-Session: https://claude.ai/code/session_01KtNufPddivogjCYaQijf5t
jackwener added a commit
that referenced
this pull request
Jun 21, 2026
BIG VISIBLE redesign per WAWQAQ msg 5a461e0c — Skills page and 定时任务 (Plan/ Reminder) page now render as lifted white cards on the gray plate, matching the upstream reference design's aux-panel signature instead of sitting flat. Each page shell gets: - 1px solid var(--border) outline - 10px border-radius - soft lift shadow: 0 1px 2px + 0 8px 24px -16px (foreground-tinted) - generous inner padding (16/18px Skills, 18px Plan) - 320ms cubic-bezier(.16,1,.3,1) entrance (opacity 0->1, translateY 6->0) Surfaces touched: - .maka-skill-library outer container — new card chrome + padding 16/18, gap 12 -> 14, page-shell entrance animation - .maka-plan-shell outer container — new card chrome + padding 18, gap 10 -> 12, top padding tightened from clamp(16,3vh,32) to (16,3vh,24) - new shared @Keyframes maka-page-shell-enter - prefers-reduced-motion + visual-smoke fixture both drop the animation This is the structural pivot WAWQAQ asked for: pages no longer read as flat lists on a flat canvas — they read as composed cards on a plate. Inner sub-cards (.maka-skill-library-list, individual reminder cards) keep their existing 1px borders, giving the reference layout's nested card hierarchy. NOTE: icon test (dist/main/__tests__/localized-main-shell-contract.test.js:341) is pre-existing red on origin/main after the icon PR #75 merged, unrelated to this change. Verified by stashing this change and re-running — same red.
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for freeto join this conversation on GitHub.
Already have an account?
Sign in to comment
1 participant
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
Problem
The dev dock icon looked noticeably larger than sibling macOS app icons.
apps/desktop/assets/icon.pngshipped as a 1254² full-bleed image: the squircle artwork ran edge-to-edge with zero transparent margin. macOS does not add the safe-area margin itself, so it rendered the icon at the full dock footprint instead of the ~80% sibling apps reserve.It loads via
app.dock.setIcon(main.ts:4217, devnpm start) and theBrowserWindowicon (main.ts:1415).Fix
Regenerate on the standard 1024² canvas with the squircle scaled to ~80% (824px) and centered, leaving the ~100px transparent margin macOS expects.
Artwork is unchanged — only safe-area padding was added. Asset-only change; no code touched.
Verify
Restart Electron (
npm run -w @maka/desktop start) and check the dock icon now matches the size of neighboring apps.https://claude.ai/code/session_01KtNufPddivogjCYaQijf5t