Обработка /latest иначе, чем /new и т.д., через CSS

Поддержка
1

Я бы хотел, чтобы на нашей главной странице (которая находится по адресу /latest) был другой стиль, чем на страницах /new, /unread и т.д. Возможно ли это реализовать через CSS в данный момент? Спасибо!

2

Мы не добавляем никаких классов на основе текущего фильтра. Что вы пытаетесь сделать?

3

Мы используем плагин предварительного просмотра списка тем для отображения превью-изображений и хотели бы показывать их только на главной странице: https://1e9.community/

4

Вы можете добавить это во вкладку header вашей темы, и классы будут добавляться к тегу <body> при навигации

<script type="text/discourse-plugin" version="0.8">
api.modifyClass("component:d-navigation", {
  didInsertElement() {
    document.body.classList.add(`filter-mode-${this.filterType}`);
  },

  willDestroyElement() {
    document.body.classList.remove(`filter-mode-${this.filterType}`);
  }
});
</script>

Это добавит класс вида filter-mode-FILTERMODE, например:

filter-mode-top
filter-mode-new
filter-mode-latest

Затем вы можете комбинировать его с классом navigation-topics, чтобы сделать ваш CSS более специфичным, как в примере ниже:

.navigation-topics.filter-mode-new {
  // выполните действия
}

Обратите внимание, что использование CSS для скрытия изображений не предотвратит загрузку их браузером. Вы не получите экономии трафика, только визуальные изменения.

Кстати, отличный сайт :+1:

5

Спасибо большое! Отличная помощь!