lism-css
- 4 skills
- 0 followers
- 17 hours ago last updated
- ▌ Lism CSS Guide · lism-css bundleLism CSSでUIやページを実装・修正する時に使う実装ガイド。Primitive選定・トークン照合・Property Class/Lism Props活用・レスポンシブ設計・アンチパターン照合を変更規模に応じて行う。b--*, c--*, l--*, a--*, is--*, has--*, set--*, u--*, -prop:value形式のクラスやトークンの逆引きにも使う。
- ▌ Lism CSS Refactor · lism-css bundle既存のLism CSSコード(React/Astro/HTML/CSS)を、見た目や挙動を変えずにLismらしい書き方へ整理するリファクタ用スキル。対象コードを洗い出し、構造・重複・Property Class化・token・状態表現・命名・レスポンシブ・既定値重複を順番に確認し、提示前に元の見た目や動きを壊していないか確認する。ユーザーがリファクタ・監査・整理を明示的に依頼した時に使う。
- ▌ Lism Mockup Guide · lism-cssLism Mockupを使って画面モックアップを作成するための実装ガイド。@lism-css/mockupのデータディレクトリ(pages/*.jsx|tsx・tokens.json・mockup.config.json)として作成・編集し、lism-mockup init→実装→lism-mockup checkの自己検証ワークフローと、ページID・import許可リスト・トークン上書きのデータ契約に従う。マークアップの書き方自体はlism-css-guideを併用する。lism-mockup / @lism-css/mockup / 画面モックアップの作成・修正で使う。
- ▌ Lism Docs Translation · lism-cssapps/docs の日本語ドキュメントを英語へ翻訳する作業の進め方。日本語ドキュメントをもとに英語版を作成・更新する、ja/ を en/ に翻訳する、英訳する、といった翻訳作業の指示を受けたら読み込む。