Стили плагинов должны использовать пользовательские свойства CSS для цветов

Разработка
1

Через несколько дней я объединю этот PR в основной репозиторий, который вносит изменения в процесс компиляции стилей плагинов. Эти изменения затрагивают переменные цветов SCSS, используемые в стилях плагинов. Если кратко: их необходимо заменить на пользовательские свойства CSS. Большинство плагинов уже обновлены, и во многих случаях это простое изменение — переменную SCSS нужно заменить на пользовательское свойство CSS:

-   background-color: $primary-low;
+   background-color: var(--primary-low);

В руководстве по адресу Update themes and plugins to support automatic dark mode приведены дополнительные примеры, а также показано, как обрабатывать более сложные преобразования цветов. (Этого руководства должно быть достаточно авторам плагинов, чтобы убедиться, что их стили будут работать корректно.)

Если вы спрашиваете, почему мы вносим эти изменения, читайте дальше.

Ранее стили ядра и плагинов компилировались для каждой темы, чтобы включить цветовую схему темы в любом месте, где использовались переменные цветов SCSS. Это означало, что сайту с множеством тем (или в среде с несколькими сайтами) требовалось много времени для предварительной компиляции, так как ему приходилось умножать количество стилей ядра и плагинов на количество активных тем, чтобы охватить все необходимые комбинации.

С августа 2020 года, для поддержки автоматического переключения тёмного режима, мы добавили отдельный файл стилей с определениями цветов, в котором переменные цветов хранятся как пользовательские свойства CSS. Это изменение позволило нам переключать цветовые схемы на лету, но также абстрагировало цвета из большинства файлов стилей. Благодаря магии пользовательских свойств CSS мы теперь можем ссылаться на цвета повсюду (ядро, плагины, темы), не загружая каждую тему при компиляции стилей.

За последние несколько месяцев мы перевели все плагины на использование пользовательских свойств CSS. Подавляющее большинство плагинов Discourse уже обновлено, но, вероятно, где-то есть плагин, который всё ещё использует переменные SCSS для цветов, и его необходимо обновить.

2

Спасибо за ясное объяснение. Даже я в основном понял это!

Не приведёт ли это к сбоям обновлений и пересборки на сайтах с компонентами тем, которые не соответствуют этим правилам? Как это уже случалось по другой причине для Failed to Bootstrap, due to discourse-alt-logo theme component?

Если да, то можно ли сделать сообщение об ошибке более понятным (для тех, кто не может разобраться в логах сборки)? Например, добавить что-то вроде «удалите плагин X перед попыткой обновления». Или, ещё лучше, можно ли предупреждать пользователей в панели администратора, когда известно о грядущем изменении? (Возможно, такое предупреждение уже есть, но его никто не читает).

3

Нет, это не приведет к сбоям при пересборке. Это вызовет неправильное отображение цветов только у плагинов, которые не были обновлены. Такое должно происходить только с кастомными плагинами; я проверил большинство плагинов, опубликованных здесь на Meta, и убедился, что они актуальны.

Проблема, на которую вы сослались, не связана с этим изменением. Это компонент темы, и мы в настоящее время блокируем пересборки, если компонент темы, помеченный для автоматического обновления, не может быть обновлен автоматически.

4

Ах. Ура. Извините за это. Я всё ещё пытаюсь разобраться в этих деталях.

5

Хорошо, столкнулся с проблемой в тёмной теме. Где и какое цветовое значение нужно изменить для цитируемого текста?

В публичных категориях всё в порядке, но в пузырях личных сообщений он нечитаем.

Попытался несколько раз поискать, но не смог найти нужный термин.

Это также влияет на ссылку темы.

Screenshot_20211028-184012
Screenshot_20211028-1840121080×2340 355 KB