Я только что опубликовал тему оформления, над которой работал уже некоторое время. Теперь она доступна с открытым исходным кодом под лицензией MIT: чистый и современный дизайн, построенный вокруг полупрозрачных поверхностей с эффектом матового стекла (шапка, боковая панель, поиск), с отдельными цветовыми схемами для светлого и тёмного режимов — без жёстко заданных цветов, всё привязано к CSS-переменным Discourse, поэтому автоматическое переключение между светлым и тёмным режимами работает «из коробки».
Репозиторий: terraboss/discourse-terraglass
Возможности
- Поверхности с эффектом матового стекла — шапка, боковая панель/меню-гамбургер и поле поиска/выпадающий список в шапке полупрозрачны, с размытием фона; непрозрачность и сила размытия настраиваются.
- Отдельные, специально разработанные цветовые схемы для светлого и тёмного режимов (а не просто инверсия одной схемы), проверенные на соответствие контрастности WCAG AA для текста и элементов интерфейса.
- Предпросмотр ссылок в стиле X/Twitter (onebox) с тонкой рамкой и скруглёнными углами.
- Теги в форме флажков/стрелок в стиле «Etiquette».
- Встраивание видео с фиксированным соотношением сторон 16:9 на всех устройствах.
- Список тем в «зебровую» полоску с ненавязчивым состоянием при наведении курсора.
- Настраиваемое скругление углов для кнопок, карточек, модальных окон и полей ввода.
- Доступный контур фокуса, использующий цвет текста текущей схемы, поэтому он остаётся видимым как в светлом, так и в тёмном режиме.
- Всё перечисленное выше — это настройки темы: отключайте или настраивайте то, что вам не нужно.
Установка
Настройка → Темы → Установить → Из git-репозитория:
https://github.com/terraboss/discourse-terraglass
Это также даст вам возможность в один клик «Проверить обновления» в будущем.
Обновление
Проблема с размытием backdrop-filter, на которую я изначально указал ниже, теперь исправлена — спасибо awesomerobot за указание на настоящую причину (подробности здесь). Теперь боковая панель, меню-гамбургер и панель поиска корректно размыты.
Буду рад обратной связи, готов принимать предложения по функциям и сообщения об ошибках.