archipelago
7ba3109b6d
git-subtree-dir: aiui git-subtree-mainline:0c4826f8ccgit-subtree-split:e30ac1d106
1.0 KiB
1.0 KiB
name, description, allowed-tools
| name | description | allowed-tools |
|---|---|---|
| new-grid | Generate a content grid component following AIUI glass-morphism patterns | Read, Write, Edit, Glob, Grep |
Create a new content grid component at packages/app/src/components/content/{Name}Grid.vue.
Requirements
-
Read a reference: Read
BookGrid.vueorPlaceGrid.vueas a template — they show the standard pattern. -
Follow conventions:
<script setup lang="ts">with props and emits- Glass morphism styling (bg-white/5, rounded-xl, hover:bg-white/10)
- Dark/light mode support via
useTheme() - Search input at top (if the content type has enough items)
- Grid of cards with image fallback, title, subtitle, metadata
- Touch targets min 44x44px
- Empty state message when no items match
- Custom scrollbar class
-
Props: Accept array of items + title string
-
Emits:
select-{type}event when a card is clicked -
Responsive: Works on mobile (full width) and desktop (sidebar width)
The user will specify the content type and its fields.