canopy-layout-grid-and-spacing
OfficialGuidance for Canopy's responsive grid and spacing.
AuthorLegal-and-General
Version1.0.0
Installs0
System Documentation
What problem does it solve?
Canopy layouts and spacing often require consistent, scalable guidance to achieve responsive, maintainable pages. This skill provides foundational guidance for implementing Canopy's layout grid and spacing system within Angular projects, reducing guesswork and ensuring design-consistency across applications.
Core Features & Use Cases
- Guidance on breakpoints, container/grid structure, and spacing variables to apply across components.
- Clear recommendations for applying Canopy's grid classes and spacing tokens to achieve responsive, accessible layouts.
- Use Case: When configuring a new page or component, follow these guidelines to align with Canopy's responsive grid and spacing system.
Quick Start
Explain how to structure a page using Canopy's grid and spacing guidelines in an Angular project.
Dependency Matrix
Required Modules
None requiredComponents
Standard package💻 Claude Code Installation
Recommended: Let Claude install automatically. Simply copy and paste the text below to Claude Code.
Please help me install this Skill: Name: canopy-layout-grid-and-spacing Download link: https://github.com/Legal-and-General/canopy/archive/main.zip#canopy-layout-grid-and-spacing Please download this .zip file, extract it, and install it in the .claude/skills/ directory.
Agent Skills Search Helper
Install a tiny helper to your Agent, search and equip skill from 471,000+ vetted skills library on demand.