Como fazer o CSS se aplicar APENAS à página inicial modificada do fórum?

Dev
1

Estou fazendo uma modificação e quero que essa modificação funcione apenas na HOME, mas ela está pegando todas as páginas, como posso deixá-la apenas na home?

usei isso

 #main-outlet-wrapper {
    margin-top: -38px;

}
2 
<script type="text/discourse-plugin" version="0.8">
  // Este é o plugin outlet, seguido por um nome personalizado para o componente
  api.registerConnectorClass("below-site-header", "custom-homepage", {

    // Configurando nosso componente
    setupComponent(args, component) {

     // Em seguida, obtemos a configuração do site 'top_menu',
     // dividimos os valores em um array
     // e adicionamos uma barra inicial
     var topMenuRoutes = 
        component.siteSettings.top_menu.split('|')
        .map(function(route) {return '/' + route});
      
     // A primeira página listada na configuração 'top_menu' é sua página inicial
     // vamos atribuí-la a uma variável
     var homeRoute = topMenuRoutes[0];
  
     // Isso chama nosso código sempre que a página muda
     api.onPageChange((url) => {

        // Verifica se estamos na página inicial 
        if (url === "/" || url === homeRoute ){ 
          // Se for a página inicial, adicione a classe 'custom-homepage' à tag HTML
          // e defina 'displayCustomHomepage' como true
          document.querySelector("html").classList.add("custom-homepage"); 
          component.set("displayCustomHomepage", true); 
        } else {  
          // Se não estivermos na página inicial, remova a classe
          // e defina `displayCustomHomepage` como false
          document.querySelector("html").classList.remove("custom-homepage"); 
          component.set("displayCustomHomepage", false); 
        }
      });
    }
    
  });

</script>

^ Adicione isso ao seu head para adicionar uma classe .custom-homepage à sua tag body quando estiver na página inicial, então → 

.custom-homepage #main-outlet-wrapper {
    margin-top: -38px;
}
4 curtidas