CSS personalizado baseado em função/grupos de usuário

Dev
1

Estou tentando descobrir se é possível personalizar o CSS com base em funções ou grupos de usuários?

Por exemplo, quero ocultar a estatística do número de tópicos na página principal, consegui fazer isso com relativa facilidade adicionando

.topics {
    display: none;

ao CSS do tema.

No entanto, o que eu realmente quero fazer é ocultar isso para todos, exceto para Administradores e Moderadores, quero que isso apareça para o grupo de Administradores e para o grupo de Moderadores.

É possível determinar se o usuário pertence a um grupo para fins de personalização de CSS?

2

Se você instalar este componente de tema, poderá direcionar grupos de usuários com CSS:

assim:

body.group-<seu-nome-de-grupo> > .alguma-classe-de-elemento-de-pagina {
    display: none;
}

sem o componente, você também pode usar:

.algo {
  display: none;
}
.staff .algo {
   display: block;
}
5 curtidas
4

Para administradores e moderadores, uma classe staff é adicionada ao corpo do documento por padrão. Portanto, se é tudo o que você precisa, pode simplesmente usar body.staff diretamente.

2 curtidas
5

Obrigado, isso é ótimo. Para referência, quais outros grupos CSS podem ser abordados nativamente em CSS (além de staff)? Algo para usuários anônimos (não logados) ou administradores (sem moderadores)?

6

.anon são todos os usuários anônimos. Acho que .admins ou .moderators não funcionam a menos que você instale o componente. Não é muito código e pode ser facilmente adicionado a outro componente também. Eu faço isso com meus componentes de tema relacionados para que as pessoas não precisem instalar ambos. O que é ótimo sobre esse componente de CSS de grupo é que ele permite segmentar níveis de confiança também.

Você pode ver como eu uso .staff e .anon em um dos meus componentes de tema aqui.

1 curtida
7

Ótimo, obrigado. Gostaria de saber se na página do componente de tema é possível listar o conjunto de nomes padrão de grupo/função/confiança que podem ser acessados (que vêm integrados ao Discourse), seria uma ótima referência pronta. Ou se você pode listá-los aqui se souber.

8

Se você instalar o componente CSS de grupo, poderá usar todos os grupos e níveis de confiança padrão na página admin-users-groups, bem como quaisquer grupos personalizados que você criar.

2 curtidas
9

Obrigado. Isso é ótimo para mim.

1 curtida