Banners de Categoria

Pode corrigir com algum CSS

Crie um novo Theme component e adicione isto ao CSS comum

// Who's Online Customization
.discovery-list-container-top-outlet.online_users_widget {
      margin-top: 0.75em;
      margin-bottom: 0.75em;
      padding-top: 0.5em
      padding-bottom: 0.5em;
}

Você também pode adicionar cor de fundo personalizada, bordas, etc.

3 curtidas

Muito obrigado!

2 curtidas

Opcionalmente, se você quiser destacar isso assim

Use este código em vez disso

// Personalização de Quem Está Online
.discovery-list-container-top-outlet.online_users_widget {
      padding-top: 0.45em;
      padding-bottom: 0.05em;
      background-color: var(--secondary);
      border: 2.0px solid rgba(var(--primary-rgb), 0.2);
      border-radius: 0.65em;
      margin-top: 0.75em
      margin-bottom: 0.75em;
}
  • A margem ajusta o espaço acima e abaixo de "quem está online"
  • O preenchimento aumenta o espaço dentro da caixa da borda. A borda ajusta a espessura do contorno da borda.
2 curtidas

Um pouco fora do tópico, mas qual par de fontes é este @bekircem? Adoro como elas funcionam juntas!

1 curtida

Tenho um pequeno pedido de funcionalidade que acredito que traria uma grande melhoria a este componente. Eu adoraria ter um link “Leia mais…” que estivesse vinculado à descrição da categoria. Uma solução muito elegante para ter uma descrição longa sem sobrecarregar a página da categoria. Posso adicionar este link manualmente, mas então ele aparece na página de Categorias, o que não é muito limpo.

3 curtidas

Este código está faltando um ; na linha 5 e também o exemplo de acompanhamento.

O que funcionou para mim foi isto:

.discovery-list-container-top-outlet.online_users_widget {
  margin-top: 0.75em !important;
  margin-bottom: 0.75em !important;
  display: block !important;
}

Resultado:

3 curtidas

Incrível. Infelizmente, meu post é muito antigo para que eu possa corrigir o código. Obrigado por me avisar que eu perdi o “;”

3 curtidas

Há o mesmo problema para as tags e links de categoria. Você poderia incluir a classe .hashtag-cooked neste conserto?

Por algum motivo, isso não está funcionando corretamente para mim.
Algumas categorias e subcategorias mostram o banner, outras não.
Não é a descrição (ou a falta dela), porque algumas têm descrição e não está sendo exibida.

Não sei se a nova atualização do Discourse quebrou alguma coisa?

Você definiu os IDs das categorias na configuração categories?

1 curtida

Sim, eu os adicionei ao Editor de Configurações de Objetos.
Acho que há algum tipo de bug relacionado à opção de ocultá-lo quando não há descrição.

Farei mais alguns testes e verei como vai.

Acabei de notar um bug.
Estou na categoria pai Tiago | Music e clico na subcategoria Sir Giant. Ela mostra o banner. Então clico em um dos links de “documentação” na barra lateral para ir para uma página de tags Announcements. Quando clico no link General Discussion que me leva de volta à raiz da subcategoria Sir Giant, o banner desaparece.

Na primeira vez que fui para Announcements, sem banner. Quando vou para a página de tags Music e depois volto para Announcements, o banner agora está visível.

Também notei algo: se eu estiver na página Announcements e não vir banner, se eu clicar no mesmo link novamente (Announcements), o banner aparece, o que é claramente um bug.

3 curtidas

2 problemas adicionais:

1 - Estou em uma categoria com uma descrição. Posso ver a descrição no banner. Essa descrição tem um link externo para minha loja online. Quando clico nele, mesmo tendo a configuração para abrir todos os links externos em uma nova aba, esse link abre na mesma aba. E posso confirmar que a configuração está funcionando, pois o tópico em si que define a descrição do banner, abre o link em uma nova aba.

2 - Agora, quando estou no site desse link externo (que abriu na mesma aba), preciso clicar em Voltar no navegador para retornar à subcategoria. Desta vez, a descrição desapareceu completamente. O banner e seu título estão lá, mas sem descrição. Mesmo se eu atualizar e forçar a atualização do navegador, ela não volta. A única maneira de vê-la novamente é voltar para a categoria principal e depois para a subcategoria novamente.


EDIT: Ok, descobri algo. Não sei o que está acontecendo nos bastidores, é claro, mas a opção vermelha está causando o problema. A opção verde funciona como esperado (sempre na tela, independentemente de onde eu clico, sem necessidade de clicar duas vezes em um menu lateral para fazer o banner voltar):

3 curtidas

Consigo reproduzir seu problema, mas não consigo explicá-lo. :sweat_smile:

Tecnicamente (ignore-me), é isso que observo com este outlet header-list-container-bottom:

  • Se você selecionar uma subcategoria → uma tag, o componente é inserido e imediatamente depois teardownComponent é chamado (?). Mas o componente não é destruído. Com a classe category-header removida de \u003cbody\u003e da função de limpeza, algum CSS oculta o banner. Você pode selecionar outra tag para reinserir o componente.

    • Da mesma página, se você clicar em um link de documentação na barra lateral, você obtém o mesmo comportamento.
    • Não acontece se você selecionar uma categoria da lista suspensa, por exemplo.

É confuso por que, após ser inserido, will-destroy é chamado imediatamente.

2 curtidas

Bem, pelo menos sei que não sou só eu… isso é bom.

Mesmo que eu não quisesse, não tenho ideia do que você está falando na sua explicação haha Mas é bom que você saiba que algo que deveria estar funcionando de uma certa maneira, não está. Isso provavelmente é um passo na direção certa para consertar.

Então o problema parece ser com a localização do banner, porque como eu disse, uma das opções (pelo menos, porque na verdade não tentei as outras duas) funciona.

1 curtida

Quando seleciono ‘Mostrar logotipo da categoria’, o logotipo aparece duas vezes - uma vez na configuração da categoria e outra neste componente do tema. Estou cometendo um erro?

Além disso, é possível fazer com que o título e/ou a descrição ‘sobre’ apareçam abaixo do logotipo?

Não, é um bug conhecido. Há também CSS que você pode adicionar para ocultar um logo nesse tópico

Obrigado, Moin! O CSS corrigiu a imagem para mim.

Para colocar o nome da categoria abaixo da imagem, isso funcionou para mim:

.conteúdo-título-categoria,
.conteúdo-título-categoria.header-título-categoria.banner-1slug .conteúdo-título-categoria {
    display: flex !important;
    flex-direction: column !important;
    align-items: flex-start !important;}
.logo-categoria,
.header-título-categoria.banner-1slug .logo-categoria {
    width: 100%;
    margin-bottom: 10px;
    margin-right: 0;}
.título-categoria,
.header-título-categoria.banner-1slug .título-categoria {
    width: 100%;
    margin-top: 20px;
    text-align: left;}

Olá! Talvez alguém possa me ajudar a corrigir um problema bastante estranho que surgiu de repente.

Todos os títulos nos banners costumavam ser brancos, mas agora mudaram para preto e apenas em algumas categorias… É um bug conhecido, ou devo verificar algo do meu lado?

Por ex:

O link para nossa comunidade, caso precise: https://community.elfsight.com/

1 curtida