← スキル一覧に戻る
enhancing-progressively
by thkt
⭐ 3🍴 0📅 2026年1月24日
Manusで実行SKILL.md
name: enhancing-progressively description: > CSS-first approach - use CSS before JavaScript. Use when implementing layouts, animations, or toggles, or when user mentions レイアウト, スタイル, 位置, アニメーション, 表示/非表示, トグル, レスポンシブ, CSS Grid, Flexbox, transforms, transitions, CSSのみ, JavaScript不要, シンプル allowed-tools: [Read, Grep, Glob] user-invocable: false
Progressive Enhancement
Priority
| Priority | Approach | Examples |
|---|---|---|
| 1 | HTML | Semantic elements, native inputs |
| 2 | CSS | Grid, Flexbox, :has(), transitions |
| 3 | JS | Only when truly necessary |
Detection
| JS Pattern | CSS Alternative |
|---|---|
element.style.display | CSS :has(), [open], <dialog> |
addEventListener('resize') | CSS @media, clamp(), min() |
getBoundingClientRect | CSS Grid, Flexbox, gap |
setInterval for animation | CSS transition, @keyframes |
classList.toggle | CSS :checked, :target |
scrollTo, scrollIntoView | CSS scroll-behavior: smooth |
matchMedia | CSS @media, @container |
スコア
総合スコア
50/100
リポジトリの品質指標に基づく評価
✓SKILL.md
SKILL.mdファイルが含まれている
+20
○LICENSE
ライセンスが設定されている
0/10
○説明文
100文字以上の説明がある
0/10
○人気
GitHub Stars 100以上
0/15
○最近の活動
3ヶ月以内に更新がある
0/10
○フォーク
10回以上フォークされている
0/5
✓Issue管理
オープンIssueが50未満
+5
✓言語
プログラミング言語が設定されている
+5
○タグ
1つ以上のタグが設定されている
0/5
レビュー
💬
レビュー機能は近日公開予定です