search

carbon-design-system / carbon-components-svelte

Svelte implementation of the Carbon Design System
https://svelte.carbondesignsystem.com
Apache License 2.0
2.68k stars 261 forks source link

feat(stack): add `Stack` component #1963

Closed metonym closed 5 months ago

metonym commented 5 months ago

Related #1384

Adds the Stack component.

Stack is a utility component that can be used to create a stack of elements with a consistent gap between them. It supports both vertical and horizontal orientations.

It uses layout tokens from the Carbon Design System to define the gap between elements. The default gap is 1, which is equivalent to 0.125rem (2px).

The gap scale can be set from 1 to 13.

<Stack gap={2}>
  <p>Item 1</p>
  <p>Item 2</p>
  <p>Item 3</p>
</Stack>