Existe uma maneira de estilizar a página "Mais recentes" e a página "Mais populares" separadamente?

Suporte
4

Sim, a solução de @manuel é uma boa abordagem para conseguir as coisas de forma bastante simples. Usar window.location.href pode levar a problemas para obter a URL correta devido ao runloop do Ember de qualquer maneira.

Para ajustar o que você está fazendo para uma abordagem mais “Ember”, seria fazer algo como isto:

<script type="text/discourse-plugin" version="1.1.0">
  api.onPageChange(() => {
    const router = api.container.lookup('service:router');

    if (router.currentRoute.name === 'discovery.top') {
      document.querySelectorAll('#main-title')[0].style.display = 'none';
    }
  });
</script>

No entanto, provavelmente é melhor se você simplesmente adicionar uma classe ao corpo e estilizar essa classe, o que também permitirá que você faça alterações de estilo mais complexas.

<script type="text/discourse-plugin" version="1.1.0">
  api.onPageChange(() => {
    const router = api.container.lookup('service:router');

    if (router.currentRoute.name === 'discovery.top') {
      document.body.classList.add('route-discovery-top');
    } else {
      document.body.classList.remove('route-discovery-top');
    }
  });
</script>

.route-discovery-top #main-title {
    display: none;
}
3 curtidas