Versions Compared

Key

  • This line was added.
  • This line was removed.
  • Formatting was changed.
Page Properties

Component type

Layout element

Component possible inclusions

n/a

Design source (in Figma)

Section foundation

Component status

Jira Legacy
serverSystem JIRA
serverId37e96b50-f164-323a-a055-92ebe3b20fa7
keyDSD-75

Introduction

'Section' component aims to adjust vertical spacings & color themes.

Semantically can be 'div' | 'article' | 'aside' | 'section', depending on what the section is used for. By default component has three themes 'dark' | 'light' | 'alt', it is also possible to add your own theme, but after own styles adding.

Component can be used within organisms that will be located on the page (the organism will be wrapped into Section component so that the color scheme and paddings are respected).

The section should not be used for small components that are part of a large organism.

Info

Props

Props of the Button base component are also available.

...

Name

...

Control

...

Description

...

children

...

Section text

...

className

...

Set string

...

theme

...

alt

dark

light

...

element

...

article

div

aside

section

...

removeDuplicateSpacing

...

  • This behavior can be disabled.

  • It is possible to completely disable paddings, for example, for such components as Teaser.