From 00006a013da42a9beaac173510cc997215e052c6 Mon Sep 17 00:00:00 2001 From: Benjamin Palko Date: Tue, 11 Aug 2026 15:57:25 -0400 Subject: [PATCH 01/17] set up new workflow and migrate to .forgejo dir --- .forgejo/workflows/deploy.yml | 25 +++++++++++++++++++++++++ {.github => .forgejo}/workflows/pr.yml | 0 AGENTS.md | 1 + README.md | 4 +++- netlify.toml | 1 - 5 files changed, 29 insertions(+), 2 deletions(-) create mode 100644 .forgejo/workflows/deploy.yml rename {.github => .forgejo}/workflows/pr.yml (100%) diff --git a/.forgejo/workflows/deploy.yml b/.forgejo/workflows/deploy.yml new file mode 100644 index 0000000..88ecea3 --- /dev/null +++ b/.forgejo/workflows/deploy.yml @@ -0,0 +1,25 @@ +name: Deploy + +on: + push: + branches: + - main + +jobs: + deploy: + runs-on: ubuntu-latest + steps: + - name: Checkout + uses: actions/checkout@v4 + - uses: pnpm/setup@v1 + with: + version: 11 + runtime: node@24 + cache: true + - name: Build + run: pnpm build + - name: Deploy to Netlify + run: npx -y netlify-cli deploy --prod --dir=build + env: + NETLIFY_AUTH_TOKEN: ${{ secrets.NETLIFY_AUTH_TOKEN }} + NETLIFY_SITE_ID: ${{ secrets.NETLIFY_SITE_ID }} diff --git a/.github/workflows/pr.yml b/.forgejo/workflows/pr.yml similarity index 100% rename from .github/workflows/pr.yml rename to .forgejo/workflows/pr.yml diff --git a/AGENTS.md b/AGENTS.md index 6373290..c024b58 100644 --- a/AGENTS.md +++ b/AGENTS.md @@ -17,6 +17,7 @@ Personal website and blog for Benjamin Palko, deployed on Netlify. - **pnpm is the canonical local package manager**. - The GitHub Actions PR gate (`.github/workflows/pr.yml`) runs `pnpm`. Keep both working; document pnpm commands. +- Deploys to Netlify run via Forgejo Actions (`.forgejo/workflows/deploy.yml`) on push to `main`. It needs `NETLIFY_AUTH_TOKEN` and `NETLIFY_SITE_ID` as Forgejo repo secrets. ## Scripts (pnpm) diff --git a/README.md b/README.md index 2530cb8..e87bce6 100644 --- a/README.md +++ b/README.md @@ -49,7 +49,9 @@ See `AGENTS.md` for the full authoring workflow. ## Deployment -Netlify deploys the `main` branch automatically. The GitHub Actions PR gate (`.github/workflows/pr.yml`) runs lint, typecheck, tests, and build on every pull request using `pnpm`. Before shipping, verify locally with: +The site deploys to Netlify on every push to `main` via a Forgejo Actions workflow (`.forgejo/workflows/deploy.yml`): it installs with pnpm, runs `pnpm build`, and deploys the `build/` directory with `netlify-cli`. Requires `NETLIFY_AUTH_TOKEN` and `NETLIFY_SITE_ID` configured as repository secrets in Forgejo. Netlify's GitHub-app continuous deployment is disabled. + +The GitHub Actions PR gate (`.github/workflows/pr.yml`) runs on the GitHub mirror on every pull request using `pnpm`. Before shipping, verify locally with: ```bash pnpm lint && pnpm check && pnpm test && pnpm build diff --git a/netlify.toml b/netlify.toml index 60a716f..0183026 100644 --- a/netlify.toml +++ b/netlify.toml @@ -1,3 +1,2 @@ [build] -command = "pnpm run build" publish = "build" -- 2.49.1 From 897b10d229a4b53dbe3228abdefba27817970cf0 Mon Sep 17 00:00:00 2001 From: Benjamin Palko Date: Tue, 11 Aug 2026 16:03:30 -0400 Subject: [PATCH 02/17] fix action version --- .forgejo/workflows/deploy.yml | 4 ++-- .forgejo/workflows/pr.yml | 2 +- 2 files changed, 3 insertions(+), 3 deletions(-) diff --git a/.forgejo/workflows/deploy.yml b/.forgejo/workflows/deploy.yml index 88ecea3..8117e46 100644 --- a/.forgejo/workflows/deploy.yml +++ b/.forgejo/workflows/deploy.yml @@ -10,8 +10,8 @@ jobs: runs-on: ubuntu-latest steps: - name: Checkout - uses: actions/checkout@v4 - - uses: pnpm/setup@v1 + uses: actions/checkout@v6 + - uses: pnpm/setup@v2 with: version: 11 runtime: node@24 diff --git a/.forgejo/workflows/pr.yml b/.forgejo/workflows/pr.yml index 9e00633..1ca7474 100644 --- a/.forgejo/workflows/pr.yml +++ b/.forgejo/workflows/pr.yml @@ -19,7 +19,7 @@ jobs: steps: - name: Checkout uses: actions/checkout@v4 - - uses: pnpm/setup@v1 + - uses: pnpm/setup@v2 with: version: 11 runtime: node@24 -- 2.49.1 From 7651afaa0b1aaf33bbf350c7082efe141fdd06d8 Mon Sep 17 00:00:00 2001 From: Benjamin Palko Date: Tue, 11 Aug 2026 16:25:02 -0400 Subject: [PATCH 03/17] fix prettier config ordering --- .prettierrc | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/.prettierrc b/.prettierrc index 7ebb855..dbb764e 100644 --- a/.prettierrc +++ b/.prettierrc @@ -3,7 +3,7 @@ "singleQuote": true, "trailingComma": "none", "printWidth": 100, - "plugins": ["prettier-plugin-svelte", "prettier-plugin-tailwindcss"], + "plugins": ["prettier-plugin-tailwindcss", "prettier-plugin-svelte"], "overrides": [ { "files": "*.svelte", -- 2.49.1 From a6d4064af8abb1ca27deee0f0d2e9f51ed3ff5dd Mon Sep 17 00:00:00 2001 From: Benjamin Palko Date: Tue, 11 Aug 2026 16:25:07 -0400 Subject: [PATCH 04/17] format project --- .opencode/skills/daisyui/SKILL.md | 17 +-- .opencode/skills/daisyui/colors/SKILL.md | 103 ++++++++------- .../skills/daisyui/components/accordion.md | 8 +- .opencode/skills/daisyui/components/alert.md | 4 + .opencode/skills/daisyui/components/aura.md | 4 + .opencode/skills/daisyui/components/avatar.md | 10 +- .opencode/skills/daisyui/components/badge.md | 4 + .../skills/daisyui/components/breadcrumbs.md | 8 +- .opencode/skills/daisyui/components/button.md | 5 + .../skills/daisyui/components/calendar.md | 16 +-- .opencode/skills/daisyui/components/card.md | 16 ++- .../skills/daisyui/components/carousel.md | 4 + .opencode/skills/daisyui/components/chat.md | 12 +- .../skills/daisyui/components/checkbox.md | 4 + .../skills/daisyui/components/collapse.md | 12 +- .../skills/daisyui/components/countdown.md | 6 +- .opencode/skills/daisyui/components/diff.md | 10 +- .../skills/daisyui/components/divider.md | 4 + .opencode/skills/daisyui/components/dock.md | 10 +- .opencode/skills/daisyui/components/drawer.md | 120 ++++++++++-------- .../skills/daisyui/components/dropdown.md | 15 ++- .opencode/skills/daisyui/components/fab.md | 106 +++++++++------- .../skills/daisyui/components/fieldset.md | 10 +- .../skills/daisyui/components/file-input.md | 4 + .opencode/skills/daisyui/components/filter.md | 19 ++- .opencode/skills/daisyui/components/footer.md | 5 + .opencode/skills/daisyui/components/hero.md | 4 + .../skills/daisyui/components/hover-3d.md | 30 +++-- .../daisyui/components/hover-gallery.md | 12 +- .../skills/daisyui/components/indicator.md | 8 +- .opencode/skills/daisyui/components/input.md | 4 + .opencode/skills/daisyui/components/join.md | 4 + .opencode/skills/daisyui/components/kbd.md | 4 + .opencode/skills/daisyui/components/label.md | 15 ++- .opencode/skills/daisyui/components/link.md | 4 + .opencode/skills/daisyui/components/list.md | 6 +- .../skills/daisyui/components/loading.md | 4 + .opencode/skills/daisyui/components/mask.md | 4 + .../skills/daisyui/components/megamenu.md | 86 ++++++++----- .opencode/skills/daisyui/components/menu.md | 11 +- .../daisyui/components/mockup-browser.md | 10 +- .../skills/daisyui/components/mockup-code.md | 6 +- .../skills/daisyui/components/mockup-phone.md | 8 +- .../daisyui/components/mockup-window.md | 5 +- .opencode/skills/daisyui/components/modal.md | 63 +++++---- .opencode/skills/daisyui/components/navbar.md | 4 + .opencode/skills/daisyui/components/otp.md | 21 ++- .../skills/daisyui/components/pagination.md | 4 + .../skills/daisyui/components/progress.md | 4 + .../daisyui/components/radial-progress.md | 4 + .opencode/skills/daisyui/components/radio.md | 4 + .opencode/skills/daisyui/components/range.md | 4 + .opencode/skills/daisyui/components/rating.md | 13 +- .opencode/skills/daisyui/components/select.md | 6 +- .../skills/daisyui/components/skeleton.md | 6 + .opencode/skills/daisyui/components/stack.md | 4 + .opencode/skills/daisyui/components/stat.md | 6 +- .opencode/skills/daisyui/components/status.md | 4 + .opencode/skills/daisyui/components/steps.md | 8 +- .opencode/skills/daisyui/components/swap.md | 16 ++- .opencode/skills/daisyui/components/tab.md | 10 +- .opencode/skills/daisyui/components/table.md | 28 ++-- .../skills/daisyui/components/text-rotate.md | 78 +++++++----- .../skills/daisyui/components/textarea.md | 4 + .../daisyui/components/theme-controller.md | 4 + .../skills/daisyui/components/timeline.md | 14 +- .opencode/skills/daisyui/components/toast.md | 4 + .opencode/skills/daisyui/components/toggle.md | 4 + .../skills/daisyui/components/tooltip.md | 6 +- .../skills/daisyui/components/validator.md | 4 + .opencode/skills/daisyui/config/SKILL.md | 65 ++++++++-- .opencode/skills/daisyui/install/SKILL.md | 7 +- .opencode/skills/daisyui/usage/SKILL.md | 6 +- eslint.config.js | 44 +++---- package.json | 100 +++++++-------- skills-lock.json | 18 +-- src/app.css | 8 +- src/app.d.ts | 16 +-- src/hooks.server.ts | 10 +- src/lib/constants/about.ts | 29 ++--- src/lib/posts/index.ts | 50 ++++---- src/routes/blog/+page.server.ts | 18 +-- src/routes/blog/[slug]/+page.ts | 19 ++- 83 files changed, 942 insertions(+), 536 deletions(-) diff --git a/.opencode/skills/daisyui/SKILL.md b/.opencode/skills/daisyui/SKILL.md index 448a272..56e68b5 100644 --- a/.opencode/skills/daisyui/SKILL.md +++ b/.opencode/skills/daisyui/SKILL.md @@ -7,6 +7,7 @@ metadata: --- # daisyUI 5 + daisyUI 5 is a CSS library for Tailwind CSS 4. daisyUI 5 provides class names for common UI components, semantic color names and themes. @@ -16,17 +17,17 @@ daisyUI 5 provides class names for common UI components, semantic color names an - Trigger this skill for any Tailwind CSS UI work - Trigger this skill when the user mentions any of these terms or similar context: daisyUI, component, UI, Tailwind, layout, template, theme, color, design -- Trigger this skill even if the user does not explicitly ask for it +- Trigger this skill even if the user does not explicitly ask for it ## Mandatory reference -| Task | Guide | Note | -|------|-------|------| -Installing daisyUI | [./install/SKILL.md](./install/SKILL.md) | Use only if daisyUI is not already installed in the project. -Using daisyUI class names | [./usage/SKILL.md](./usage/SKILL.md) | MANDATORY. Read this before using any daisyUI class names in the code. -Configuring daisyUI | [./config/SKILL.md](./config/SKILL.md) | Use this if you need to configure daisyUI themes, prefix, logs, or other options. Not required for basic usage but important for advanced customization. -daisyUI colors and themes | [./colors/SKILL.md](./colors/SKILL.md) | MANDATORY. Read this to understand daisyUI color usage rules and how to use daisyUI colors in the code. -daisyUI components | [./components/](./components/) | MANDATORY. Read the relevant component docs when using daisyUI components in the code. Always read multiple candidate component docs before deciding which one to use. +| Task | Guide | Note | +| ------------------------- | ---------------------------------------- | ---------------------------------------------------------------------------------------------------------------------------------------------------------------------- | +| Installing daisyUI | [./install/SKILL.md](./install/SKILL.md) | Use only if daisyUI is not already installed in the project. | +| Using daisyUI class names | [./usage/SKILL.md](./usage/SKILL.md) | MANDATORY. Read this before using any daisyUI class names in the code. | +| Configuring daisyUI | [./config/SKILL.md](./config/SKILL.md) | Use this if you need to configure daisyUI themes, prefix, logs, or other options. Not required for basic usage but important for advanced customization. | +| daisyUI colors and themes | [./colors/SKILL.md](./colors/SKILL.md) | MANDATORY. Read this to understand daisyUI color usage rules and how to use daisyUI colors in the code. | +| daisyUI components | [./components/](./components/) | MANDATORY. Read the relevant component docs when using daisyUI components in the code. Always read multiple candidate component docs before deciding which one to use. | ## List of components diff --git a/.opencode/skills/daisyui/colors/SKILL.md b/.opencode/skills/daisyui/colors/SKILL.md index e087be3..2d38443 100644 --- a/.opencode/skills/daisyui/colors/SKILL.md +++ b/.opencode/skills/daisyui/colors/SKILL.md @@ -6,6 +6,7 @@ description: MANDATORY color usage rules for daisyUI 5 ## daisyUI 5 colors ### daisyUI color names + - `primary`: Primary brand color, The main color of your brand - `primary-content`: Foreground content color to use on primary color - `secondary`: Secondary brand color, The optional, secondary color of your brand @@ -28,6 +29,7 @@ description: MANDATORY color usage rules for daisyUI 5 - `error-content`: Foreground content color to use on error color ### daisyUI color rules + 1. daisyUI adds semantic color names to Tailwind CSS colors 2. daisyUI color names can be used in utility classes, like other Tailwind CSS color names. For example, `bg-primary` will use the primary color for the background 3. daisyUI color names include variables as value so they can change based on the theme @@ -46,7 +48,10 @@ The default configuration enables `light` and `dark`. Choose specific themes, ev ```css @plugin "daisyui" { - themes: light --default, dark --prefersdark, cupcake; + themes: + light --default, + dark --prefersdark, + cupcake; } ``` @@ -56,59 +61,63 @@ The default configuration enables `light` and `dark`. Choose specific themes, ev ```html -
-
Nested theme
-
+
+
Nested theme
+
``` ### daisyUI custom theme with custom colors + A CSS file with Tailwind CSS, daisyUI and a custom daisyUI theme looks like this: + ```css -@import "tailwindcss"; +@import 'tailwindcss'; @plugin "daisyui"; @plugin "daisyui/theme" { - name: "mytheme"; - default: true; /* set as default */ - prefersdark: false; /* set as default dark mode (prefers-color-scheme:dark) */ - color-scheme: light; /* color of browser-provided UI */ + name: 'mytheme'; + default: true; /* set as default */ + prefersdark: false; /* set as default dark mode (prefers-color-scheme:dark) */ + color-scheme: light; /* color of browser-provided UI */ - --color-base-100: oklch(98% 0.02 240); - --color-base-200: oklch(95% 0.03 240); - --color-base-300: oklch(92% 0.04 240); - --color-base-content: oklch(20% 0.05 240); - --color-primary: oklch(55% 0.3 240); - --color-primary-content: oklch(98% 0.01 240); - --color-secondary: oklch(70% 0.25 200); - --color-secondary-content: oklch(98% 0.01 200); - --color-accent: oklch(65% 0.25 160); - --color-accent-content: oklch(98% 0.01 160); - --color-neutral: oklch(50% 0.05 240); - --color-neutral-content: oklch(98% 0.01 240); - --color-info: oklch(70% 0.2 220); - --color-info-content: oklch(98% 0.01 220); - --color-success: oklch(65% 0.25 140); - --color-success-content: oklch(98% 0.01 140); - --color-warning: oklch(80% 0.25 80); - --color-warning-content: oklch(20% 0.05 80); - --color-error: oklch(65% 0.3 30); - --color-error-content: oklch(98% 0.01 30); + --color-base-100: oklch(98% 0.02 240); + --color-base-200: oklch(95% 0.03 240); + --color-base-300: oklch(92% 0.04 240); + --color-base-content: oklch(20% 0.05 240); + --color-primary: oklch(55% 0.3 240); + --color-primary-content: oklch(98% 0.01 240); + --color-secondary: oklch(70% 0.25 200); + --color-secondary-content: oklch(98% 0.01 200); + --color-accent: oklch(65% 0.25 160); + --color-accent-content: oklch(98% 0.01 160); + --color-neutral: oklch(50% 0.05 240); + --color-neutral-content: oklch(98% 0.01 240); + --color-info: oklch(70% 0.2 220); + --color-info-content: oklch(98% 0.01 220); + --color-success: oklch(65% 0.25 140); + --color-success-content: oklch(98% 0.01 140); + --color-warning: oklch(80% 0.25 80); + --color-warning-content: oklch(20% 0.05 80); + --color-error: oklch(65% 0.3 30); + --color-error-content: oklch(98% 0.01 30); - --radius-selector: 1rem; /* border radius of selectors (checkbox, toggle, badge) */ - --radius-field: 0.25rem; /* border radius of fields (button, input, select, tab) */ - --radius-box: 0.5rem; /* border radius of boxes (card, modal, alert) */ - /* preferred values for --radius-* : 0rem, 0.25rem, 0.5rem, 1rem, 2rem */ + --radius-selector: 1rem; /* border radius of selectors (checkbox, toggle, badge) */ + --radius-field: 0.25rem; /* border radius of fields (button, input, select, tab) */ + --radius-box: 0.5rem; /* border radius of boxes (card, modal, alert) */ + /* preferred values for --radius-* : 0rem, 0.25rem, 0.5rem, 1rem, 2rem */ - --size-selector: 0.25rem; /* base size of selectors (checkbox, toggle, badge). Value must be 0.25rem unless we intentionally want bigger selectors. If so it can be 0.28125 or 0.3125. If we intentionally want smaller selectors, it can be 0.21875 or 0.1875 */ - --size-field: 0.25rem; /* base size of fields (button, input, select, tab). Value must be 0.25rem unless we intentionally want bigger fields. If so it can be 0.28125 or 0.3125. If we intentionally want smaller fields, it can be 0.21875 or 0.1875 */ + --size-selector: 0.25rem; /* base size of selectors (checkbox, toggle, badge). Value must be 0.25rem unless we intentionally want bigger selectors. If so it can be 0.28125 or 0.3125. If we intentionally want smaller selectors, it can be 0.21875 or 0.1875 */ + --size-field: 0.25rem; /* base size of fields (button, input, select, tab). Value must be 0.25rem unless we intentionally want bigger fields. If so it can be 0.28125 or 0.3125. If we intentionally want smaller fields, it can be 0.21875 or 0.1875 */ - --border: 1px; /* border size. Value must be 1px unless we intentionally want thicker borders. If so it can be 1.5px or 2px. If we intentionally want thinner borders, it can be 0.5px */ + --border: 1px; /* border size. Value must be 1px unless we intentionally want thicker borders. If so it can be 1.5px or 2px. If we intentionally want thinner borders, it can be 0.5px */ - --depth: 1; /* only 0 or 1 - Adds a shadow and subtle 3D depth effect to components */ - --noise: 0; /* only 0 or 1 - Adds a subtle noise (grain) effect to components */ + --depth: 1; /* only 0 or 1 - Adds a shadow and subtle 3D depth effect to components */ + --noise: 0; /* only 0 or 1 - Adds a subtle noise (grain) effect to components */ } ``` + #### Rules + - All CSS variables above are required - Colors can be OKLCH or hex or other formats - If you're generating a custom theme, do not include the comments from the example above. Just provide the code. @@ -121,21 +130,21 @@ Use the built-in theme's name and override only the values that need to change. ```css @plugin "daisyui/theme" { - name: "light"; - default: true; - --color-primary: blue; - --color-secondary: teal; + name: 'light'; + default: true; + --color-primary: blue; + --color-secondary: teal; } ``` For a custom CDN theme, define the same variables under a selector that matches the chosen `data-theme` and checked theme controller: ```css -:root:has(input.theme-controller[value=mytheme]:checked), -[data-theme="mytheme"] { - color-scheme: light; - --color-primary: oklch(55% 0.3 240); - /* define the remaining custom-theme variables */ +:root:has(input.theme-controller[value='mytheme']:checked), +[data-theme='mytheme'] { + color-scheme: light; + --color-primary: oklch(55% 0.3 240); + /* define the remaining custom-theme variables */ } ``` diff --git a/.opencode/skills/daisyui/components/accordion.md b/.opencode/skills/daisyui/components/accordion.md index bbc0ab9..277ddc7 100644 --- a/.opencode/skills/daisyui/components/accordion.md +++ b/.opencode/skills/daisyui/components/accordion.md @@ -1,18 +1,23 @@ ### accordion + Accordion is used for showing and hiding content but only one item can stay open at a time [accordion docs](https://daisyui.com/components/accordion/) #### Class names + - component: `collapse` - part: `collapse-title`, `collapse-content` - modifier: `collapse-arrow`, `collapse-plus`, `collapse-open`, `collapse-close` #### Syntax + ```html -
{CONTENT}
+
{CONTENT}
``` + where content is: + ```html
{title}
@@ -20,6 +25,7 @@ where content is: ``` #### Rules + - {MODIFIER} is optional and can have one of the modifier class names - Accordion uses radio inputs. All radio inputs with the same name work together and only one of them can be open at a time - If you have more than one set of accordion items on a page, use different names for the radio inputs on each set diff --git a/.opencode/skills/daisyui/components/alert.md b/.opencode/skills/daisyui/components/alert.md index 624a810..81a151c 100644 --- a/.opencode/skills/daisyui/components/alert.md +++ b/.opencode/skills/daisyui/components/alert.md @@ -1,19 +1,23 @@ ### alert + Alert informs users about important events [alert docs](https://daisyui.com/components/alert/) #### Class names + - component: `alert` - style: `alert-outline`, `alert-dash`, `alert-soft` - color: `alert-info`, `alert-success`, `alert-warning`, `alert-error` - direction: `alert-vertical`, `alert-horizontal` #### Syntax + ```html ``` #### Rules + - {MODIFIER} is optional and can have one of each style/color/direction class names - Add `sm:alert-horizontal` for responsive layouts diff --git a/.opencode/skills/daisyui/components/aura.md b/.opencode/skills/daisyui/components/aura.md index 4349a57..261739c 100644 --- a/.opencode/skills/daisyui/components/aura.md +++ b/.opencode/skills/daisyui/components/aura.md @@ -1,18 +1,22 @@ ### aura + Aura is a border light effect that can wrap around any component. It is a great way to add a cool, eye-catching visual effect to your components. Aura is useful for the most important button, card, or div that you want to highlight. [aura docs](https://daisyui.com/components/aura/) #### Class names + - component: `aura` - style: `aura-dual`, `aura-rainbow`, `aura-holo`, `aura-gold`, `aura-silver`, `aura-glow` - size: `aura-xs`, `aura-sm`, `aura-md`, `aura-lg`, `aura-xl` #### Syntax + ```html
{CONTENT}
``` #### Rules + - {MODIFIER} is optional and can have one of each style/size class names - you can set custom colors using `text-*` color classes. For example, `text-primary` will use the primary color for the aura - you can set custom background color using `bg-*` color classes. For example, `bg-secondary` will use the secondary color for the background of the aura diff --git a/.opencode/skills/daisyui/components/avatar.md b/.opencode/skills/daisyui/components/avatar.md index f9e282a..07a1737 100644 --- a/.opencode/skills/daisyui/components/avatar.md +++ b/.opencode/skills/daisyui/components/avatar.md @@ -1,22 +1,26 @@ ### avatar + Avatars are used to show a thumbnail [avatar docs](https://daisyui.com/components/avatar/) #### Class names + - component: `avatar`, `avatar-group` - modifier: `avatar-online`, `avatar-offline`, `avatar-placeholder` #### Syntax + ```html
-
- -
+
+ +
``` #### Rules + - {MODIFIER} is optional and can have one of the modifier class names - Use `avatar-group` for containing multiple avatars - You can set custom sizes using `w-*` and `h-*` diff --git a/.opencode/skills/daisyui/components/badge.md b/.opencode/skills/daisyui/components/badge.md index b6e76ba..0675dc4 100644 --- a/.opencode/skills/daisyui/components/badge.md +++ b/.opencode/skills/daisyui/components/badge.md @@ -1,20 +1,24 @@ ### badge + Badges are used to inform the user of the status of specific data [badge docs](https://daisyui.com/components/badge/) #### Class names + - component: `badge` - style: `badge-outline`, `badge-dash`, `badge-soft`, `badge-ghost` - color: `badge-neutral`, `badge-primary`, `badge-secondary`, `badge-accent`, `badge-info`, `badge-success`, `badge-warning`, `badge-error` - size: `badge-xs`, `badge-sm`, `badge-md`, `badge-lg`, `badge-xl` #### Syntax + ```html Badge ``` #### Rules + - {MODIFIER} is optional and can have one of each style/color/size class names - Can be used inside text or buttons - To create an empty badge, just remove the text between the span tags diff --git a/.opencode/skills/daisyui/components/breadcrumbs.md b/.opencode/skills/daisyui/components/breadcrumbs.md index 80b326a..0294ba8 100644 --- a/.opencode/skills/daisyui/components/breadcrumbs.md +++ b/.opencode/skills/daisyui/components/breadcrumbs.md @@ -1,19 +1,25 @@ ### breadcrumbs + Breadcrumbs helps users to navigate [breadcrumbs docs](https://daisyui.com/components/breadcrumbs/) #### Class names + - component: `breadcrumbs` #### Syntax + ```html
- +
``` #### Rules + - breadcrumbs only has one main class name - Can contain icons inside the links - If you set `max-width` or the list gets larger than the container it will scroll diff --git a/.opencode/skills/daisyui/components/button.md b/.opencode/skills/daisyui/components/button.md index 6ace81f..ecf86a5 100644 --- a/.opencode/skills/daisyui/components/button.md +++ b/.opencode/skills/daisyui/components/button.md @@ -1,9 +1,11 @@ ### button + Buttons allow the user to take actions [button docs](https://daisyui.com/components/button/) #### Class names + - component: `btn` - color: `btn-neutral`, `btn-primary`, `btn-secondary`, `btn-accent`, `btn-info`, `btn-success`, `btn-warning`, `btn-error` - style: `btn-outline`, `btn-dash`, `btn-soft`, `btn-ghost`, `btn-link` @@ -12,10 +14,13 @@ Buttons allow the user to take actions - modifier: `btn-wide`, `btn-block`, `btn-square`, `btn-circle` #### Syntax + ```html ``` + #### Rules + - {MODIFIER} is optional and can have one of each color/style/behavior/size/modifier class names - btn can be used on any html tags such as ` ``` #### Rules + - {MODIFIER} is optional and can have one of the size class names - To make a button active, add `dock-active` class to the button - add `` is required for responsiveness of the dock in iOS diff --git a/.opencode/skills/daisyui/components/drawer.md b/.opencode/skills/daisyui/components/drawer.md index 00ceef1..a2b82cb 100644 --- a/.opencode/skills/daisyui/components/drawer.md +++ b/.opencode/skills/daisyui/components/drawer.md @@ -1,9 +1,11 @@ ### drawer + Drawer is a grid layout that can show/hide a sidebar on the left or right side of the page [drawer docs](https://daisyui.com/components/drawer/) #### Class names + - component: `drawer` - part: `drawer-toggle`, `drawer-content`, `drawer-side`, `drawer-overlay`, `drawer-button` - placement: `drawer-end` @@ -11,85 +13,97 @@ Drawer is a grid layout that can show/hide a sidebar on the left or right side o - variant: `is-drawer-open:`, `is-drawer-close:` #### Syntax + ```html
- -
{CONTENT}
-
{SIDEBAR}
+ +
{CONTENT}
+
{SIDEBAR}
``` + where {CONTENT} can be navbar, site content, footer, etc and {SIDEBAR} can be a menu like: + ```html -