Spaces
Наименования CSS классов для отступов состоят из нескольких частей: {prefix}-{p/m-side}-{size}.
Prefix
prefix - Префикс cds,
P/M
p - padding, используется для внутренних отступов.
m - margin, используется для внешних отступов.
Side
a - all, значение применяется для всех сторон.
t - top, применяется для верхней части элемента.
r - right, применяется только для правой части элемента.
b - bottom, применяется только для нижней части элемента.
l - left, применяется только для левой части элемента.
x - применяется для сторон по оси x.
y - применяется для сторон по оси y.
Примеры
| CSS-класс | Свойство |
|---|---|
.cds-pa-m | padding: 16px; |
.cds-pt-m | padding-top: 16px; |
.cds-pr-xl | padding-right: 32px; |
.cds-mb-xl | margin-bottom: 32px; |
.cds-ml-xs | margin-left: 8px; |
.cds-mx-xs | margin-right: 8px; margin-left: 8px; |
.cds-my-none | margin-top: 0; margin-bottom: 0; |
Значения
| Значение | Size (rem/px) | Mini unit |
|---|---|---|
none | 0px | 0 |
3xs | 0.125 / 2 | 0.25 |
xxs | 0.25 / 4 | 0.5 |
xs | 0.5 / 8 | 1 |
s | 0.75 / 12 | 1.5 |
m | 1 / 16 | 2 |
l | 1.5 / 24 | 3 |
xl | 2 / 32 | 4 |
xxl | 2.5 / 40 | 5 |
3xl | 3 / 48 | 6 |
4xl | 4 / 64 | 8 |
5xl | 5 / 80 | 10 |
6xl | 6 / 96 | 12 |