Attributes
data-attributes that you can use on any component.
File to include
@import "helpers";| Name | Effect | Example |
|---|---|---|
| data-padding | Add a padding | data-padding="xs" |
| data-padding-top | Add a padding top | data-padding-top="s" |
| data-padding-bottom | Add a padding bottom | data-padding-bottom="l" |
| data-padding-left | Add a padding left | data-padding-left="xl" |
| data-padding-right | Add a padding right | data-padding-right="xxs" |
| data-padding-top-bottom | Add a padding top and bottom | data-padding-top-bottom="m" |
| data-padding-left-right | Add a padding left and right | data-padding-left-right="xl" |
| data-margin | Add a margin | data-margin="xs" |
| data-margin-top | Add a margin top | data-margin-top="s" |
| data-margin-bottom | Add a margin bottom | data-margin-bottom="l" |
| data-margin-left | Add a margin left | data-margin-left="xl" |
| data-margin-right | Add a margin right | data-margin-right="xxs" |
| data-margin-top-bottom | Add a margin top and bottom | data-margin-top-bottom="m" |
| data-margin-left-right | Add a margin left and right | data-margin-left-right="xl" |