القائمة
11ty component structure — pair Nunjucks/HTML partials in _includes/components/ with scoped CSS in css/components/ using BEM and theme tokens.
التثبيت باستخدام Codex أو Claude انسخ هذا Prompt والصقه في Codex أو Claude أو مساعد آخر ليراجع صفحة Skill ويثبّتها لك.
استنادا إلى تصنيف SOC المهني
Work case study gallery figures — multi-image layouts (hero-secondary, email-duo, sidebar-quad, integrations-stack, experiment-grid), CSS atmosphere backdrops, and palette modifiers. Use when adding, editing, or styling work gallery figures in case study HTML.
Proposes a title-only Conventional Commit subject, then runs git status/diff, stages changes, and git commit -m. Use when the user asks for a commit message, to stage and commit, or to save work locally — not when they only want to push.
Pushes the current branch to origin on GitHub (git push, set upstream when missing). Use when the user asks to push, publish the branch, or ship to GitHub — not for composing commit messages or local commits only.
| name | component-pattern |
| description | 11ty component structure — pair Nunjucks/HTML partials in _includes/components/ with scoped CSS in css/components/ using BEM and theme tokens. |
11ty components consist of a Nunjucks or HTML partial in _includes/components/ paired with a scoped CSS file in css/components/.
Partial:
CSS:
Exception — click-to-play video (work gallery): The partial lives in _includes/components/click-to-play-video.njk, but styles are in the main stylesheet (src/assets/css/styles.css) next to other .work-gallery rules, and behavior JS is bundled only on the work layout. See AGENTS.md (Work gallery: video figures) for the full file map and authoring shortcode.
Exception — multi-image gallery figures: Layout and atmosphere backdrops are BEM classes in the same stylesheet, authored as HTML in case studies. See .cursor/skills/work-gallery-figures/SKILL.md and AGENTS.md (Work gallery: multi-image layouts).
