Categories: public vs. logged in only vs. restricted

Experiência do Usuário
1

Is there a way to distinguish between categories visible to logged in users only and categories visible to certain groups?

At the moment, I use CSS to hide the lock icon in front of all categories that are visible to logged-in users only. Now I would like to put a group icon in front of categories that are restricted to groups.

3 curtidas
3

While I understand your question, I am thinking about the use case. Especially because only users who can see the categories, see the categories regardless of groups or logged-in state. So how would the differentiation help? I do not think there is way though, but I might be wrong.

4

The use case is the same as for the lock icons, which, I think, is to remind users: if you post here or share a link from here it won’t be accessible by everyone.

I feel like I don’t need that reminder for login-only categories, because very few categories on my site are visible to anonymous users. (Instead, I mark the publicly visible category’s with an :eye: icon to remind users that these are out in the open internet.)

For categories that have more restrictions than “must be logged in”, it can be less obvious that they’re for a more or less exclusive group only. New users might have been granted access to a group when they first created their account. So from day one they’re seeing a different set of categories than some other users, but unless the category name or description (if they read it) includes a hint, they couldn’t tell that a category is visible only to some. Older users might forget that this one category they once were granted access to is not in fact accessible by all.

So, in short, a quick visual reminder like the lock icon makes more sense to me for restricted categories than applying it to almost all categories on a mostly logged-in only site.

2 curtidas
5

We’ve recently made a category restricted to a higher trust level and now people keep thinking those topics have been closed. Closed and restricted are different things and it is confusing for them to have the same icon. A lock is generally understood to indicate that the person seeing it doesn’t have full access, not that it is hidden from other people.

1 curtida
7

In the meantime, I decided to indicate in front of each category, what the level of access is. I’m using a globe for categories that are public (anonymous access), a “group” icon for categories accessible by logged-in users and a “friends” icon for other restricted categories.
Screen Shot 2020-10-13 at 09.55.39

2 curtidas
8

Como você está alcançando isso? Acho que é uma ótima ideia e, à medida que aproximamos nosso site de ter algumas categorias públicas, adoraria fazer algo semelhante para elas. Adorei o globo!

Eu adoraria alcançar:

  1. :globe_with_meridians: em Categorias definidas como everyone
  2. Nenhum ícone definido em Categorias permitindo acesso a trust_level_0
  3. :unlock: definido em todas as outras Categorias
9

Este TC deve funcionar, Nathan.

10

Sim, é isso que eu uso. No campo svg-icons, insira users, user-friends e qualquer símbolo que você queira usar para acesso público (para o globo, estou usando um ícone de Freepik, que adicionei ao meu Discourse através de um sprite carregado em um componente de tema)

Eu escondo o ícone de cadeado com este CSS adicionado a um componente de tema:

// sem ícone de cadeado para categorias privadas
.category .badge-category.clear-badge.restricted .d-icon-lock, 
.badge-category.clear-badge.restricted .d-icon-lock,
.category-list .category-text-title .d-icon-lock,
.category-box-heading .d-icon-lock {
    display:none;
}
1 curtida
11

Criei uma variação da sua ideia, onde posso ocultar o ícone de cadeado seletivamente apenas nas categorias que são acessíveis para TL_0 (manualmente).

Como não há uma classe CSS conveniente para isso, você deve mirar nas propriedades hover (title) e link (href) em vez disso, e também deve fazer isso para cada uma das categorias para as quais deseja ocultar o ícone de cadeado:

// oculta ícones de cadeado para a categoria ux
[title = "ux"], [href = "/c/ux/9"] {
     .d-icon {
         display: none;
     }
}

Claro que isso entraria em conflito com quaisquer ícones do Componente de Ícones de Categoria, mas isso pode ser mitigado mirando em .d-icon-lock (ou qualquer ícone que você esteja usando) em vez de .d-icon para essa categoria.

Acabei de editar esse CSS depois de descobrir que estava faltando alguns dos ícones. Funciona muito melhor agora, mas quebrará facilmente se você alterar a estrutura da sua categoria.

2 curtidas
12

Uma pequena atualização para que você possa usá-la com a barra lateral:

// oculta ícones de cadeado para a categoria ux
.sidebar-section-link-ux .prefix-badge {
    display: none;
}
.category-ux .list-controls, [href = "/c/ux/9"] {
    .d-icon-lock,  {
        display: none;
    }
}
1 curtida
13

Para menus suspensos de seleção de categoria, adicionei mais um destino:

.category-ux .list-controls, [href = "/c/ux/9"], [data-value = "9"] {
    .d-icon-lock,  {
        display: none;
    }
}

Também, para canais de chat, sugiro: [href *= "chat/channel/9/"]

1 curtida