Используем простой скрипт и CSS-переменные В последние пять лет в интерфейсном дизайне появилось понятие тёмной темы: это когда фон делают тёмным, а текст — светлым. Это полезно в телефонах для энергосбережения и чтения с экрана ночью. Ну и просто красиво. Сегодня мы добавим на страницу переключатель тёмной и светлой темы с помощью CSS. Автопереключение тёмной темы Современные браузеры умеют определять, что на телефоне или компьютере включена тёмная тема. Для этого разработчики используют такой...

Сохраняем тему и добавляем переключатель В прошлой статье мы добавили поддержку тёмной темы на странице. Вот короткая версия: В прошлый раз мы проверили, как работает автопереключение, потом убрали его и добавили ручной режим. Сегодня объединим эти два подхода, а заодно научим браузер сохранять наши настройки. Добавляем автопереключатель на страницу Добавим автопереключение тёмной темы на страницу следующим способом: Чтобы не городить с нуля элементы интерфейса, мы позаимствуем готовые компоненты из фреймворка Bootstrap 5...