fix: strip Aura .p-drawer-content padding in mobile drawer (switcher stays bottom-anchored) #29

bert.hausmans · 2026-06-03T14:49:51+02:00

bert.hausmans commented

2026-06-03 14:49:51 +02:00

Corrects the mobile drawer spacing per Bert's clarification.

Two things:

WorkspaceSwitcher stays bottom-anchored (like the desktop sidebar / "normal" menu). The previous PR #28 wrongly grouped it under the menu — that grow prop is fully reverted (SidebarNav's <nav> is unconditionally flex-1 again).
The real spacing was Aura's .p-drawer-content padding (0 {modal.padding} {modal.padding} {modal.padding} ≈ 20px sides + bottom), insetting the whole logo/menu/switcher block from the drawer edges. Plain p-0 lost to it in stylesheet order, so force it off with !p-0 (same pattern as the existing header !hidden). The drawer content is now edge-to-edge like the desktop <aside>; children keep their own intrinsic padding.

Changes: SidebarNav.vue (revert grow), AppSidebar.vue (p-0→!p-0, drop :grow), AppSidebar.spec.ts (swap the 2 grow tests for a !p-0 contract assertion).

Gate: crewli-reviewer PASS (no MUST/SHOULD FIX). Full Vitest 84 files / 582 passing, typecheck exit 0, eslint clean. Rendered at 375px via Storybook — switcher bottom-anchored, wrapper padding gone, desktop untouched.

🤖 Generated with Claude Code

Corrects the mobile drawer spacing per Bert's clarification. **Two things:** 1. **WorkspaceSwitcher stays bottom-anchored** (like the desktop sidebar / "normal" menu). The previous PR #28 wrongly grouped it under the menu — that `grow` prop is fully reverted (`SidebarNav`'s `<nav>` is unconditionally `flex-1` again). 2. **The real spacing was Aura's `.p-drawer-content` padding** (`0 {modal.padding} {modal.padding} {modal.padding}` ≈ 20px sides + bottom), insetting the whole logo/menu/switcher block from the drawer edges. Plain `p-0` lost to it in stylesheet order, so force it off with `!p-0` (same pattern as the existing header `!hidden`). The drawer content is now edge-to-edge like the desktop `<aside>`; children keep their own intrinsic padding. **Changes:** `SidebarNav.vue` (revert grow), `AppSidebar.vue` (`p-0`→`!p-0`, drop `:grow`), `AppSidebar.spec.ts` (swap the 2 grow tests for a `!p-0` contract assertion). **Gate:** crewli-reviewer **PASS** (no MUST/SHOULD FIX). Full Vitest **84 files / 582 passing**, typecheck exit 0, eslint clean. Rendered at 375px via Storybook — switcher bottom-anchored, wrapper padding gone, desktop untouched. 🤖 Generated with [Claude Code](https://claude.com/claude-code)

bert.hausmans added 1 commit 2026-06-03 14:49:53 +02:00

fix: strip Aura .p-drawer-content padding in mobile drawer, keep switcher bottom-anchored 9c32f5b069

Correct the mobile drawer spacing fix. The real spacing was Aura's
.p-drawer-content padding (0 {modal.padding} {modal.padding} {modal.padding},
~20px sides+bottom) insetting the whole logo/menu/switcher block from the
drawer edges — plain p-0 lost to it in stylesheet order, so force it off with
!p-0 (same fix pattern as header !hidden). The WorkspaceSwitcher stays
bottom-anchored exactly like the desktop sidebar: revert the SidebarNav 'grow'
prop and the mobile grow=false (the nav is flex-1 again). Children keep their
own intrinsic padding; the drawer content is now edge-to-edge like desktop.

Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>

bert.hausmans merged commit dba5250691 into main

2026-06-03 14:50:30 +02:00

bert.hausmans referenced this issue from a commit

2026-06-03 14:50:33 +02:00

Merge pull request 'fix: strip Aura .p-drawer-content padding in mobile drawer (switcher stays bottom-anchored)' (#29) from fix/mobile-drawer-content-padding into main

bert.hausmans deleted branch fix/mobile-drawer-content-padding

2026-06-03 14:50:35 +02:00

Sign in to join this conversation.

1 Participants

Notifications

Due Date

No due date set.

Dependencies

No dependencies set.

Reference: bert.hausmans/crewli#29