'Section' component
Component type | Layout element |
---|---|
Component possible inclusions | n/a |
Design source (in Figma) | |
Component status |
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.
Spacing control between sections is required.
The sections with same color themes will collapse by default. This behavior can be disabled.
It is possible to completely disable paddings, for example, for such components as Teaser.