Endereçar /latest de forma diferente de /new etc via CSS

Suporte
1

Gostaria de ter um estilo diferente na nossa página inicial (que é /latest) em comparação com /new, /unread, etc. Isso é possível via CSS no momento? Obrigado!

2

Não adicionamos nenhuma classe com base no filtro atual. O que você está tentando fazer?

3

Usamos o plugin de pré-visualização da lista de tópicos para exibir imagens de destaque e gostaríamos que elas aparecessem apenas na página inicial: https://1e9.community/

4

Você pode adicionar isso à aba header do seu tema e as classes serão adicionadas à tag <body> conforme você navega

<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>

Isso adicionará filter-mode-FILTROMODO como uma classe, assim:

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

Em seguida, você pode combiná-la com a classe navigation-topics para tornar seu CSS específico, como mostrado abaixo:

.navigation-topics.filter-mode-new {
  // faça algo
}

Observe que usar CSS para ocultar imagens não impedirá que o navegador as baixe. Você não obterá economia de largura de banda com isso, apenas alterações visuais.

Além disso, site legal :+1:

5

Muito obrigado! Grande ajuda!