Продолжаем изучать движок Sass (и синтаксис SCSS). В этой части изучим основные модули, с помощью которых мы научимся аки клятые волшебники преобразовывать цвета, создавать и использовать сложные объекты, а также брать квадратные корни и пользоваться другими достижениями математики! Для освоения материала достаточно базовых знаний таблиц стилей CSS и HTML (или Pug). Предыдущая часть: • CSS БОЛЬШЕ НЕ НУЖЕН! Sass и SCSS. Часть 1 Следующая часть: • SASS В РЕАЛЬНЫХ ПРОЕКТАХ. Sass и SCSS. Час... Материалы ролика: • Основы языка разметки Pug (используется в ролике вместо HTML): • HTML БОЛЬШЕ НЕ НУЖЕН! Pug. Полный курс. Ча... • Редактор CodePen:
Полезные ссылки • Официальный сайт Sass (документация с примерами):
• Sass на npm:
• Sass на GitHub:
• Программа для работы с цветами (используется в ролике):
Содержание: 0:00 Вступление 1:18 Редактор CodePen 2:06 Что такое SASS модуль? 3:12 Подключение модулей. Правило use 4:14 Подключение модуля color 4:46 RGB данные цвета 6:56 Прозрачность цвета 7:27 Тон цвета 8:11 Яркость цвета 8:49 Пример: Использование данных о цвете 10:53 Абсолютное изменение цвета. Функция change 13:27 Относительное изменение цвета. Функция adjust 14:38 Относительное изменение цвета. Функция scale 15:32 Смешивание цветов 16:33 Пример: Акцент-блоки с авто-цветами 28:42 Что такое map? 30:16 Подключение модуля map 30:34 Обращение к полям. Функция get 32:05 Проверка наличия поля. Функция has-key 33:21 Объединение объектов. Функция merge 35:17 Итерация через цикл each 36:58 Массивы ключей и значений 37:34 Пример: Адаптивная верстка 57:28 Про остальные модули 57:51 Математические константы 58:23 Математические функции 59:51 Пример: Геометрический логотип 1:05:10 Функция content-exists 1:07:06 Заключение #sass #scss #css
