基于用户角色/分组的定制CSS

开发
1

我想弄清楚是否可以根据用户角色或组自定义 CSS？

例如，我想在主页上隐藏主题数量统计信息，我通过将以下内容添加到主题 CSS 中相对容易地实现了这一点：

.topics {
    display: none;
}

但我真正想做的是为除管理员和版主之外的所有人隐藏此信息，我想让管理员组和版主组显示此信息。

是否可以确定用户是否属于某个组以用于 CSS 自定义目的？

2

安装此主题组件后，您就可以使用 CSS 定位用户组：

像这样：

body.group-您组名 > .some-page-element-class {
    display: none;
}

没有该组件，您也可以使用：

.something {
  display: none;
}
.staff .something {
   display: block;
}
5 个赞
4

默认情况下，管理员和版主会在文档正文中添加一个 staff 类。所以，如果这正是你所需要的，你可以直接使用 body.staff。

2 个赞
5

谢谢，这太棒了。作为参考，除了staff之外，还有哪些CSS组可以在CSS中原生寻址？是否有针对匿名（未登录）用户或管理员（无版主）的用户？

6

.anon 是所有匿名用户。我不认为 .admins 或 .moderators 在你安装组件之前就能起作用。它不是很多代码，也可以轻松地添加到另一个组件中。我通过我的相关主题组件来做到这一点，这样人们就不必同时安装两个组件。那个组 CSS 组件的优点是它也允许针对信任级别。

你可以在我的一个主题组件中看到我是如何使用 .staff 和 .anon 的：here。

1 个赞
7

太好了，谢谢。我想知道主题组件页面是否可以列出可以访问的标准组/角色/信任名称集（这些是 Discourse 内置的），这将是一个很棒的现成参考。或者如果你知道的话，可以在这里列出它们。

8

如果您安装了 group css 组件，则可以在 admin-users-group 页面上使用所有默认组和信任级别，以及您创建的任何自定义组。

2 个赞
9

谢谢。这对我有很大帮助。

1 个赞