| Table of Contents | ||||||||
|---|---|---|---|---|---|---|---|---|
|
| Panel | ||||||||
|---|---|---|---|---|---|---|---|---|
| ||||||||
| Panel | ||||||||
|---|---|---|---|---|---|---|---|---|
| ||||||||
The Spacer is a simple invisible utility component that allows you to space out content when creating your own components or blocks. Spacer’s sizes are tied to css variables which can be overridden, changing the spacing across the whole site.
| Table of Contents | ||||||||||
|---|---|---|---|---|---|---|---|---|---|---|
|
Usage
| Tip |
|---|
Do’s |
Enter text here
Dont’s
Enter text here
Anatomy
|
| Warning |
|---|
Dont’s
|
Anatomy
Item | Component type | Content type | Notes | |
|---|---|---|---|---|
1 | Spacer | n/a | n/a |
Visual style
Spacer css variable | Default value |
--cds-space-0 | 0 |
--cds-space-1 | 0.25rem |
--cds-space-2 | 0.5rem |
--cds-space-3 |
Visual style
Editorial
Behaviour
Accessibility
Related components
Component
A very brief description
Component
A very brief description
Component
A very brief description1rem | |
--cds-space-4 | 1.25rem |
--cds-space-5 | 1.5rem |
--cds-space-6 | 2rem |
--cds-space-7 | 3rem |
--cds-space-8 | 4rem |
--cds-space-9 | 6rem |
--cds-space-10 | 9rem |
Editorial
n/a
Behaviour
n/a
Accessibility
n/a