Автоматическое переключение между светлой и темной темой

В видеоролике Vaadin Tips этой недели Алехандро Дуарте показывает, как определить предпочтительную цветовую настройку операционной системы для автоматического переключения между темной и светлой темами в веб-приложении с использованием CSS и JavaScript, как в обычных HTML-приложениях Vaadin Flow, так и в Java-приложениях.

0:00 — Вступление
0:13 — Простая HTML-страница с темной темой
1:02 — Медиа-запросы и медиа-функции
3:02 — Темные темы в приложениях с наборами веб-компонентов
4:14 — Слушатели медиа-запросов с помощью JavaScript
6:16 — Конфигурация Vaadin Flow с Java
6:48 — Переключение темного и светлого в ОС (функция в действии)
7:04 — Темная тема в начале
8:18 — Аутро

Ссылки:
Подпишитесь на Алехандро в Twitter: https://twitter.com/alejandro_du
См. также https://dzone.com/articles/switching-between-light-and-dark-themes-automatica