Переключатель 🌓 цветовой схемы: радиокнопки, CSS-фильтры и инверсия, SVG-иконки, JS и localStorage

00:00 Интро 00:53 Постановка задачи 01:12 Обзор основы 02:16 Обзор дизайна 03:28 Разметка контрола 05:18 Добавление стилей 05:48 Позиционирование 06:20 Описание группы 06:59 Радиокнопки 07:47 Инверсные иконки 08:56 Блок статуса 10:35 Индикатор статуса 11:55 Красота инверсии 12:43 Подключение JS 13:13 Обзор работы скрипта 14:43 Форсинг темы 15:39 Сетап скрипта 17:08 Сетап свитчера 18:04 Переключение 18:53 Установка схемы 20:28 Сетап схемы 21:40 И ещё демо 22:06 Вывод 22:47 Аутро Нравится? Становитесь патронами Демо переключателя Светлая и тёмная темы на CSS Свойство filter в CSS Prefers-color-scheme: Hello darkness, my old friend Improved dark mode default styling with the color-scheme