shkim4
1472e51f47
Combine Task A (e8409ef, SW 0.2.0 integrated improvement) with Task B
(396539d, Figma-based SWHomeMenu / SWHomeMenuSection / SWHomeMenuItem /
SWRecentFiles). Task B's 84 new files are taken unchanged except for the
public-import Storybook update and joining the popup Escape stack.
- Export the home menu from @hm-design/sw
- SWHeader homeMenu / homeMenuOpen / defaultHomeMenuOpen /
onHomeMenuOpenChange: hidden by default, the logo toggles it (onHomeClick
is not called while homeMenu is set), placed from the measured header,
closes with / closes the document and field dropdowns
- Logo aria-expanded / aria-controls; menu layer CSS (z-index 20)
- AI catalog / patterns / design rules, example G, README, usage guide
- Storybook SW/Home Menu uses @hm-design/sw; integration story
Verified: SW typecheck, tsc -b, SW build, Storybook build, AI docs 22/22,
28/28 existing SW shots pixel-identical, regression 96 PASS / 0 FAIL,
home menu checks 22/22. Not run: tarball consumer install.
15 lines
1.2 KiB
CSS
15 lines
1.2 KiB
CSS
/* Storybook layout only for SW / Home Menu (frames, logs, fixtures). The menu itself uses no story class. */
|
|
.sw-home-menu-story__scroll { overflow-x: auto; }
|
|
.sw-home-menu-story__frame { position: relative; min-height: 80px; }
|
|
.sw-home-menu-story__overlay { position: absolute; top: 0; z-index: 3; }
|
|
.sw-home-menu-story__figma { display: block; max-width: none; }
|
|
.sw-home-menu-story__stage { display: flex; flex-wrap: wrap; gap: 16px; padding: 16px; background: #060606; }
|
|
.sw-home-menu-story__single { display: flex; height: 46px; }
|
|
.sw-home-menu-story__toolbar { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 12px; }
|
|
.sw-home-menu-story__toolbar > button { padding: 4px 8px; border: 1px solid #999; border-radius: 4px; background: #fff; font: inherit; font-size: 13px; cursor: pointer; }
|
|
.sw-home-menu-story__log { margin: 12px 0 0; padding-left: 20px; font-family: monospace; font-size: 12px; }
|
|
.sw-home-menu-story__table { border-collapse: collapse; font-size: 13px; }
|
|
.sw-home-menu-story__table :is(th, td) { padding: 4px 8px; border: 1px solid #ccc; text-align: left; }
|
|
.sw-home-menu-story__tall .sw-home-menu-story__frame { height: 860px; }
|
|
.sw-home-menu-story__figma-row { display: flex; align-items: flex-start; gap: 16px; margin-top: 12px; }
|