liquid-theme-standards 是做什麼的?
Shopify Liquid 主題的 CSS、JavaScript 和 HTML 編碼標準。涵蓋樣式表標籤內的 BEM 命名、設計代碼、CSS 自訂屬性、Web Components、防禦性 CSS 和漸進增強。適用於在 .liquid 檔案或主題資源檔案中撰寫 CSS/JS/HTML 時使用。
Shopify Liquid 主題的 CSS、JavaScript 和 HTML 編碼標準。涵蓋樣式表標籤內的 BEM 命名、設計代碼、CSS 自訂屬性、Web Components、防禦性 CSS 和漸進增強。適用於在 .liquid 檔案或主題資源檔案中撰寫 CSS/JS/HTML 時使用。
這份技能提供了一套完整的 Shopify Liquid 主題開發編碼標準,涵蓋 CSS、JavaScript 和 HTML 三個面向。它定義了 BEM 命名規範(即使在 Liquid 模板的樣式表標籤內也適用)、設計代碼與 CSS 自訂屬性的使用方式,以及如何將 Web Components 應用於主題中。此外,還包含了防禦性 CSS 和漸進增強的實作指導,以確保主題在不同瀏覽器和裝置上都能穩定呈現。此規範適用於任何使用 .liquid 檔案或主題資源檔案的開發場景,支援 Shopify 平台,並能幫助團隊維持一致的程式碼品質與可維護性。
npx skills add https://github.com/benjaminsehl/liquid-skills/tree/main/skills/liquid-theme-standardsShopify Liquid 主題的 CSS、JavaScript 和 HTML 編碼標準。涵蓋樣式表標籤內的 BEM 命名、設計代碼、CSS 自訂屬性、Web Components、防禦性 CSS 和漸進增強。適用於在 .liquid 檔案或主題資源檔案中撰寫 CSS/JS/HTML 時使用。
This repo contains 2 individual skills — each has its own dedicated page.
Implement WCAG 2.2 accessibility patterns in Shopify Liquid themes. Covers e-commerce-specific components including product cards, carousels, cart drawers, price display, forms, filters, and modals. Use when building accessible theme components, fixing accessibility issues, or reviewing ARIA patterns in .liquid files.
Generate Shopify Liquid theme code (sections, blocks, snippets) with correct schema JSON, LiquidDoc headers, translation keys, and CSS/JS patterns. Use when creating or editing .liquid files for Shopify themes, working with schema, doc, stylesheet, javascript tags, or Shopify Liquid objects/filters/tags.
ElevenLabs text-to-speech with mac-style say UX.
Oracle CLI second-model review/debug/refactor/design with selected files, dry-run token checks, API or browser engine.
Capture and automate macOS UI with the Peekaboo CLI.
Generate multiple radically different interface designs for a module using parallel sub-agents. Use when user wants to design an API, explore interface options, compare module shapes, or mentions "design it twice".
Build a throwaway prototype to flesh out a design — a runnable terminal app for state/business-logic questions, or several radically different UI variations toggleable from one route.
Interview the user relentlessly about a plan or design until reaching shared understanding, resolving each branch of the decision tree. Use when user wants to stress-test a plan, get grilled on their design, or mentions "grill me".