CSS para ocultar não vistos por TL, também conhecido como grupo

Talvez eu devesse descrever primeiro o que estou tentando fazer.

TLs mais altos no meu fórum gostam de usar unseen. Então eu o adicionei ao top menu. Mas TL0/1 não precisam dele porque para eles latest e/ou categories mostram exatamente o mesmo. Para eles unseen é apenas ruído.

Usuários TL1 podem/poderiam precisar dele, mas eles ficam no TL1 porque não são ativos o suficiente. E novamente: porque eles não são ativos latest oferece o mesmo resultado.

Então eu decidi ocultar unseen de qualquer pessoa abaixo do TL2.

Como um PhD de copiar e colar, eu sei que posso limitar e mudar o layout e as partes visíveis por grupo. Mas eu não consigo encontrar recursos adequados porque me faltam os termos de busca necessários.

Então… alguém pode me mostrar a direção certa?

No mundo perfeito, teríamos um componente para ajustar o top menu por grupos. Ou poderíamos até mesmo configurar padrões e deixar um usuário decidir o que ele quer ver ou não. Mas não vivemos em um mundo perfeito, vivemos? Bem, no mesmo mundo dos sonhos, eu também saberia CSS :joy:

Há um risco de eu estar vendo isso como um problema maior do que realmente é. No meu mundo, cerca de 95% dos usuários usam celulares e eles não usam o menu suspenso de forma alguma — então, eles nunca veem unseen em primeiro lugar.

Bem, eu já desenvolvi um componente de tema que pode inserir CSS para grupos, TLs ou usuários.

~~ Não tenho certeza se alguém no meta já desenvolveu um componente semelhante antes… mas se não, eu o postarei ~~

Atualização: O princípio geral é este, considerando que minha implementação é muito estranha… não a postarei

<script type="text/discourse-plugin" version="0.8">
try {
    let your_tl = -1; // -1 significa anônimo
    if (api.getCurrentUser()?.trust_level) {
        your_tl = api.getCurrentUser().trust_level;
    }
    if (your_tl < 1) {
        var style = document.createElement('style');
        style.innerHTML = '#tl1-only{display:none;}'; // Ou algo mais
        document.head.appendChild(style);
    }
} catch(err) {
    // ...
}
</script>
2 curtidas