Menü
Use when writing, debugging, or reviewing Tailwind CSS utilities, generated CSS drift, theme tokens, responsive variants, dark mode variants, or Goshtoso Tailwind v4 build behavior.
Mit Codex oder Claude installieren Kopieren Sie diesen Prompt, fügen Sie ihn in Codex, Claude oder einen anderen Assistant ein und lassen Sie die Skill-Seite prüfen und installieren.
Basierend auf der SOC-Berufsklassifikation
Use when integrating or updating Goshtoso in an external Go/templ application, including installing github.com/araihu/goshtoso, serving bundled assets, wiring head.Dependencies, importing components, choosing a Tailwind CSS strategy, or debugging missing Goshtoso styles, Alpine.js, HTMX, combobox behavior, or component config fields.
Use when writing, debugging, or reviewing Alpine.js markup — any x-* directive (x-data, x-init, x-show, x-bind/`:`, x-on/`@`, x-text, x-html, x-model, x-modelable, x-for, x-transition, x-effect, x-ignore, x-ref, x-cloak, x-teleport, x-if, x-id), magics ($el, $refs, $store, $watch, $dispatch, $nextTick, $root, $data, $id), globals (Alpine.data, Alpine.store, Alpine.bind), the init()/destroy() lifecycle, alpine:init, Alpine plugins (persist, intersect, collapse, focus, mask, morph), extending via Alpine.directive/Alpine.magic, the CSP build, or Alpine interacting with templ attribute escaping / htmx swaps.
Use when writing, debugging, or reviewing htmx markup — any hx-* attribute (hx-get/post/put/patch/delete, hx-swap, hx-target, hx-trigger, hx-vals, hx-boost, hx-swap-oob, hx-include, hx-sync, hx-indicator), htmx request/response headers (HX-Trigger, HX-Redirect, HX-Retarget, HX-Reswap, HX-Location, HX-Push-Url), the htmx JS API (htmx.ajax/process/on/swap/trigger), htmx events, polling, infinite scroll, lazy load, inline edit, active search, out-of-band swaps, or htmx interacting with Alpine.js / templ attribute escaping. Server returns HTML fragments, not JSON.
Use when writing, generating, debugging, or reviewing templ (.templ) files — Go's typed HTML templating. Covers the templ keyword, components, expressions { }, control flow (if/else/switch/for), attributes (conditional/boolean/spread/URL/JSON/class/style), template composition and { children... }, css blocks, script templates and passing Go data to JS (templ.JSFuncCall/JSONString/JSONScript/JSExpression), templ.Raw, render-once, context, the templ CLI (generate/fmt/lsp/--watch), code generation into *_templ.go, and templ's escaping/injection security model (SafeURL/SafeCSS/SafeClass). Also covers templ + Alpine.js / htmx attribute-escaping bugs.
| name | tailwindcss |
| description | Use when writing, debugging, or reviewing Tailwind CSS utilities, generated CSS drift, theme tokens, responsive variants, dark mode variants, or Goshtoso Tailwind v4 build behavior. |
Use this skill whenever a change touches Tailwind utility classes, css/main.css,
theme tokens, responsive behavior, dark mode styles, generated CSS, or the
Tailwind build.
assets/tailwind.version.just css after editing CSS, theme sources, or introducing new utility
classes in templ/Go code.just css regenerates the theme source and assets/styles.css.assets/styles.css is generated. Never hand-edit it.bg-surface text-on-surface dark:bg-surface-dark dark:text-on-surface-dark.0 unless the existing component pattern requires
otherwise.For Tailwind-affecting changes, run:
just css
go build -o bin/server ./site/cmd/server
Use focused tests or screenshots when the change affects layout, themes, responsive behavior, or component states.