Урок 02 · 10 хв
$змінні
$ink: #111 — до збірки. Це не var(--ink): у браузері вже підставлено значення.
$radius: 8px; і border-radius: $radius. Змінюєш в одному місці — перезбираєш. У CSS кастом-властивостях var(--radius) живе в браузері й уміє тему на льоту. SCSS-$ — для збірки: брейкпоінти, сітка, те, що не змінюють у runtime.
#{$name}— вставити змінну в ім'я:.icon-#{$size}. Без#{}усередині рядка селектора не склеїться.- Імена з
-:$color-brand. Не$c1, за місяць не згадаєш. - Дефолт:
$gap: 1rem !default;— файл теми може перевизначити до імпорту.
Перевірка
Закріпи, поки не пішов далі
1. Після збірки $ink у CSS буде
2. Перемикач світла/темна без перезбирання — це
3.
.btn-#{$size}навіщо #{}