home chevron_right
Полосы chevron_right
Цвет полос

Цвет полосlink

https://dev.ru.simai.io/ru/ui/utility/stripe/stripe-color.php

С помощью модификаторов stripe-{color} можно задать цвет полос паттерна фона.

Таблица классовlink

Класс Значение
.stripe-transparent --sf-stripe--color: var(--sf-transparent)
.stripe-current --sf-stripe--color: currentColor
.stripe-surface --sf-stripe--color: var(--sf-surface)
.stripe-on-surface --sf-stripe--color: var(--sf-on-surface)
.stripe-primary --sf-stripe--color: var(--sf-primary)
.stripe-secondary --sf-stripe--color: var(--sf-secondary)
.stripe-tertiary --sf-stripe--color: var(--sf-tertiary)

Описаниеlink

Модификаторы stripe-{color} устанавливают переменную --sf-stripe--color, которая используется в узорах stripe-1...stripe-4.

Синтаксисlink

  • stripe-{color} — задать цвет полос.

Пример использованияlink

<div class="stripe-1 stripe-primary p-3">Полоски primary в стиле stripe-1</div>
<div class="stripe-2 stripe-on-surface p-3">Полоски on-surface в стиле stripe-2</div>
<div class="stripe-3 stripe-tertiary p-3">Полоски tertiary в стиле stripe-3</div>
<div class="stripe-4 stripe-current p-3">Полоски currentColor в стиле stripe-4</div>

Playgroundlink