Фон должен быть уникальным изображением для каждой категории (а не глобальным CSS-стилем).
Что я пробовал
Пользовательский JavaScript для вставки изображения и текста. Это работает, но изображение загружается первым, а затем меняет размер, что вызывает дерганые переходы и сдвиги макета.
Компонент Баннер категории приблизил меня к цели, но я не смог точно воспроизвести эту разметку и требования к изображениям для каждой категории.
Вопрос
Какой рекомендуемый подход в Discourse для достижения этого?
Есть ли примеры или шаблоны CSS/HTML для резервирования места (например, обертка с фиксированным соотношением сторон / object-fit) и избежания CLS?
Советы по использованию загрузок для каждой категории или настроек темы для чистой установки фонового изображения.
Очень плохая демо-версия (кстати, я не использую карточки тем), но, думаю, вы легко сможете это сделать, используя только встроенную фоновую картинку категории:
то это разместит изображение на теге body. Возможно, затем стоит немного подправить CSS под свой вкус (в моём примере это 400 пикселей):
`+ несколько правок для выравнивания текста — вы получите приблизительный результат, который хотите, я думаю? Главный недостаток в том, что это действительно на всю ширину, поэтому на широких экранах оно будет выступать за края.
Я думаю, что ближайший компонент темы, который я видел к тому, что вы ищете, это этот:
Вы можете посмотреть его, чтобы получить некоторые идеи, но, похоже, вам может потребоваться создать собственный компонент. Вы можете опубликовать сообщение в Marketplace, если ищете разработчиков, которые помогут вам.
