css-grid-math

Derive and debug CSS Grid layout math for grid coordinates, line placement, spans, negative indexes, fr units, minmax(), fit-content(), repeat(), auto-fill, and auto-fit. Use when building grid systems, explaining track sizing, troubleshooting fr distribution, placing items by line numbers, or converting a layout sketch into CSS Grid formulas.

Ir para a instalação

Repositório: hashgraph-online/awesome-codex-plugins
Última atividade na origem: 30 de junho de 2026 às 21:30
Idioma detectado do SKILL.md: inglês
Estrelas: 771
Forks: 236

Opções de instalação

Por padrão, está selecionado o prompt que primeiro revisa a origem. Você pode mudar para um comando direto ou baixar uma cópia local.

Instalar com Codex ou Claude Copie este prompt, cole no Codex, Claude ou outro assistente e deixe que ele revise a página da skill e instale para você.

Um comando direto ignora o prompt de revisão. Verifique a origem antes de executá-lo.

npx skills add https://github.com/hashgraph-online/awesome-codex-plugins --skill css-grid-math

O comando permanece em uma só linha. Role horizontalmente para revisá-lo antes de copiar.

Prefere uma cópia local? Baixe os arquivos disponíveis atualmente no SkillsMP.

Revise os arquivos de origem

Leia o SKILL.md e os arquivos complementares exibidos pelo SkillsMP antes de decidir se vai instalar.

Explorador de arquivos

10 arquivos

SKILL.md

Instruções da origem · Visualização somente leitura

Voltar à pesquisa Voltar à instalação

amq-cli

Coordinate agents via the AMQ CLI for file-based inter-agent messaging. Use this skill whenever you need to send messages to another agent (codex, claude, or any named handle), check your inbox, drain queued messages, set up co-op mode between agents, join a swarm team, route messages across projects, or diagnose delivery issues. Also use it when you receive a message and need to know how to reply, inspect receipts, or handle priority. Covers any multi-agent coordination task where agents need to talk to each other — review requests, questions, status updates, decision threads, wake notifications, and orchestrator integration (Symphony, Kanban). For collaborative spec/design workflows specifically, prefer the /amq-spec skill which provides structured phase-by-phase guidance. Not intended for distributed systems design (RabbitMQ, Kafka), CI/CD pipelines, or single-agent tasks with no partner.

2026-08-05

amq-spec

Parallel-research-then-converge design workflow between two agents. Use this skill when the user wants two agents to independently think through a design problem before aligning on a solution — "spec X with codex", "design X together", "both agents think through X", "brainstorm architecture together", "parallel research then joint proposal", "think through separately then align", "careful thought from both sides before coding", or any variation where the user wants collaborative design rather than just splitting implementation work. Also use this when you receive a message labeled workflow:spec and need to know the correct receiver-side protocol. Not for sending simple messages or reviews (use /amq-cli), implementing completed designs, or creating document templates.

2026-08-05

brainstorming

Use when defining new features, product behavior, UI/component design, architecture choices, contract changes, or ambiguous medium/high-complexity work before implementation, or when the user asks to grill or pressure-test a plan or design.

2026-08-05

Ver todas deste repositório

name	css-grid-math
description	Derive and debug CSS Grid layout math for grid coordinates, line placement, spans, negative indexes, fr units, minmax(), fit-content(), repeat(), auto-fill, and auto-fit. Use when building grid systems, explaining track sizing, troubleshooting fr distribution, placing items by line numbers, or converting a layout sketch into CSS Grid formulas.
license	MIT
compatibility	Codex, Claude Code, and other Agent Skills-compatible clients.
metadata	{"version":"0.1.0","displayName":"CSS Grid Math","category":"Frontend","tags":"frontend,css,grid,layout,math"}

CSS Grid Math

Use this skill when a grid needs to be reasoned about as a coordinate and sizing system. It helps calculate where items land, how tracks divide space, and why flexible tracks do not always produce expected widths.

Quick Start

Read guidelines.md to select the smallest relevant file set.
Load references/grid-layout/rules.md for implementation decisions.
Load references/grid-layout/examples.md when editing code.
Use workflows/debug-grid-layout.md for multi-step derivation or debugging.

Resource	Purpose
`guidelines.md`	Routes tasks to the right reference files
`references/source-map.md`	Book source and chapter/section traceability
`references/grid-layout/knowledge.md`	Core concepts and terminology
`references/grid-layout/rules.md`	Practical rules, guidelines, and exceptions
`references/grid-layout/examples.md`	Bad/good examples and refactoring approach
`references/grid-layout/patterns.md`	Reusable formula and implementation patterns
`references/grid-layout/checklist.md`	Review checklist and red flags
`workflows/debug-grid-layout.md`	Step-by-step workflow

Source

Derived from Math for Web Design by Paul McFedries, Chapter 4: CSS Grid math. Citations are tracked in references/source-map.md.

css-grid-math

Opções de instalação

Revise os arquivos de origem

CSS Grid Math

Quick Start

Contents

Source

CSS Grid Math

Quick Start

Contents

Source

css-grid-math

Informações da origem

Opções de instalação

Revise os arquivos de origem

Mais deste repositório

Mais deste repositório

CSS Grid Math

Quick Start

Contents

Source

CSS Grid Math

Quick Start

Contents

Source