Address /latest differently then /new etc via CSS

I’d like to have a different style on our homepage (which is /latest) then on /new, /unread etc. Is this possible via CSS at the moment? Thanks!

إعجاب واحد (1)

We don’t add any classes based on the current filter. What are you trying to do?

إعجابَين (2)

We use the topic list preview plugin to show teaser images and would like to have them on the homepage only: https://1e9.community/

إعجاب واحد (1)

You can add this to the header tab of your theme and it will add the classes to the <body> tag as you navigate

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

It will add filter-mode-FILTERMODE as a class like so

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

You can then combine that with the navigation-topics class to make your CSS specific like so

.navigation-topics.filter-mode-new {
  // do stuff
}

Do note that using CSS to hide images will not prevent the browser from downloading them. You won’t get any bandwidth savings from this, only visual changes.

Also, nice site :+1:

5 إعجابات

Thanks so much! Great help!

إعجابَين (2)

This topic was automatically closed 30 days after the last reply. New replies are no longer allowed.