skill
Adom UI Design System
Public Made by Adomby adom
How the AI builds and tests interfaces people love to use in Adom. Ships as one installable skill that bundles focused skills (tooltips, floating-windows, toasts, responsive-ui, app-shell, ai-driven-apps, clickable-paths).
← Commit history
1.14.1: the closed panel state needs breathing room; content padding belongs to the page, not the panel
2 files changed
+23−1
package.json+1−1@@ -1,6 +1,6 @@ { "slug": "adom-ui-design",- "version": "1.14.0",+ "version": "1.14.1", "type": "skill", "description": "The Adom UI Design System plus a bundle of focused UI skills (tooltips, floating-windows, toasts, responsive-ui, app-shell, ai-driven-apps, clickable-paths, dark-default, input-feedback, settings-layout). One install drops the whole set of skill files onto your container, plus shared icon assets (the settings cog) so every Adom app draws the same glyph.", "dependencies": {},
skills/newbie-panel/SKILL.md+22@@ -129,6 +129,28 @@ instead of the boxes around them. - The choice persists across reloads (namespaced localStorage, see **newbie-graduation**), and auto-graduation closes it the same way a dismissal does. +### The CLOSED state still needs breathing room++John, 2026-08-24, looking at pup with the panel closed: *"the spacing when newbie panel is+collapsed is bad."* Closing the panel had left the app's first row jammed against the header+with a few pixels of gap, because the page's top padding lived on the PANEL rather than on+the page.++- **The content region owns its own padding, independent of the panel.** Put+ `padding: 20px 20px 24px` (or your app's content padding) on the region that holds+ everything below the header, and let the panel sit INSIDE that padding as one more block.+ Removing the panel then changes nothing about the page's relationship to the header.+- **Minimum 20px between the header's bottom border and the first thing under it**, in every+ state: panel open, panel closed, demo running.+- The gap must not CHANGE when the panel closes. If your first row sits 20px below the+ header with the panel open and 6px below it with the panel closed, your padding is on the+ wrong element.+- Same rule at the bottom: the last block keeps its padding whether or not the panel is+ there.++Check it by toggling: screenshot with the panel open and closed and compare the distance+from the header to the first content row. It should be identical.+ ## Two traps that keep a full-width panel a column Found by chip-fetcher, the first app to convert: