徽章页面中的信任等级排序展览

支持
1

我修改了信任等级的名称，但这导致徽章页面显示的顺序发生了变化。例如，信任等级 1 显示在信任等级 2 之后。有办法调整这个顺序吗？

image
image700×189 10.4 KB

BetaUser 应该显示在 BetaTester 之前，我该如何操作？

2

按字母顺序排列

3

您可以使用 CSS 来实现，例如：

.badge-card.betauser {
    order: -1;
}

由于当前的徽章页面布局是基于 Flexbox 构建的，如果您更改了顺序，可能还需要在不同屏幕宽度下调整一些边距。

.badge-card.betauser {
    order: -1;
  @media screen and (max-width: 850px) {
    margin-right: 1.63%
  }
}

.badge-card.betatester {
  @media screen and (max-width: 850px) {
    margin-right: 0;
  }
}

今年晚些时候，当我们停止支持 IE11 后，就不再需要调整边距了（因为届时我们可以使用 Grid 而不是 Flexbox 来构建布局）。

4

我在哪里可以找到徽章的 CSS 文件？您能告诉我路径吗？谢谢

5

您可以在 管理 > 自定义 > 主题 下添加自定义 CSS。找到相关 CSS 类最简单的方法是：右键点击您想要编辑的页面元素，然后在浏览器中检查它。

否则，您必须深入浏览 Discourse 的源代码以参考（注意：您无法直接编辑 Discourse 的 CSS……您需要在主题中覆盖所需的部分）。徽章页面的 CSS 位于此文件中：discourse/app/assets/stylesheets/common/base/user-badges.scss at main · discourse/discourse · GitHub