类别横幅

可以使用一些 CSS 来修复

创建一个新的 Theme component,并将以下内容添加到 common css 中

// Who's Online Customization
.discovery-list-container-top-outlet.online_users_widget {
      margin-top: 0.75em;
      margin-bottom: 0.75em;
      padding-top: 0.5em
      padding-bottom: 0.5em;
}

您还可以添加自定义背景颜色、边框等。

3 个赞

非常感谢!

2 个赞

如果您想这样突出显示

请改用此代码

// Who's Online Customization
.discovery-list-container-top-outlet.online_users_widget {
      padding-top: 0.45em;
      padding-bottom: 0.05em;
      background-color: var(--secondary);
      border: 2.0px solid rgba(var(--primary-rgb), 0.2);
      border-radius: 0.65em;
      margin-top: 0.75em
      margin-bottom: 0.75em;
}
  • Margin 调整“在线用户”上方和下方的间距
  • padding 增加边框框内的空间。Border 调整边框轮廓的粗细。
2 个赞

有点离题,但这是什么字体组合,@bekircem?我喜欢它们搭配在一起的效果!

1 个赞

我有一个小功能请求,我认为这将使此组件得到很大的改进。我希望有一个“阅读更多…”链接,该链接将链接到类别描述。这是一个非常优雅的解决方案,可以提供冗长的描述,而不会使类别页面显得混乱。我可以手动添加此链接,但它会显示在“类别”页面上,这很不整洁。

3 个赞

{“translation”: "[引用=“Dan DeMontmorency,帖子:237,话题:86241,用户名:Heliosurge”]\n\n```
// 在线用户自定义
.discovery-list-container-top-outlet.online_users_widget {
margin-top: 0.75em;
margin-bottom: 0.75em;
padding-top: 0.5em;
padding-bottom: 0.5em;
}

[/引用]

这段代码第5行缺少一个`;`,以及后续示例也是如此。

我解决的方法如下:

.discovery-list-container-top-outlet.online_users_widget {
margin-top: 0.75em !important;
margin-bottom: 0.75em !important;
display: block !important;
}

结果:
![图片|360x241](upload://85eSdvLszxqldZU2cYL8BVOeIcz.png)"}
3 个赞

太棒了。不幸的是,我的帖子太旧了,无法更正代码。感谢您告知我遗漏了“;”

3 个赞

标签和类别链接也存在同样的问题。您能否在此修复中包含 .hashtag-cooked 类?

对我来说,出于某种原因,这无法正常工作。
有些类别和子类别显示横幅,有些则不显示。
这不是描述(或缺少描述)的问题,因为有些有描述但未显示。

我不知道新的 Discourse 更新是否破坏了什么?

您是否在 categories 设置中定义了分类 ID?

1 个赞

是的,我已将它们添加到对象设置编辑器中。
我认为有一个与“无描述时隐藏”选项相关的错误。

我将进行更多测试,看看情况如何。

我刚发现一个 bug。
我在父类别 Tiago | Music 中,然后点击了子类别 Sir Giant。它会显示横幅。然后我点击侧边栏的“文档”链接之一,跳转到一个标签页 Announcements。当我点击 General Discussion 链接,将我带回子类别 Sir Giant 的根目录时,横幅消失了。
我第一次进入 Announcements 时,没有横幅。当我进入标签页 Music,然后再回到 Announcements 时,横幅现在可见了。


我还注意到一个问题:如果我在 Announcements 页面并且没有看到横幅,当我再次点击相同的链接(Announcements)时,横幅就会出现,这显然是一个 bug。

3 个赞

还有 2 个问题:

1 - 我在一个有描述的类别中。我可以在横幅中看到该描述。该描述有一个指向我的在线商店的外部链接。当我点击它时,即使我设置了在新标签页中打开所有外部链接,该链接也会在同一标签页中打开。我可以确认该设置有效,因为定义横幅描述的主题本身会在新标签页中打开链接。

2 - 现在当我访问该外部链接的网站(它在同一标签页中打开)时,我必须点击浏览器中的“后退”按钮才能返回子类别。这时,描述已完全消失。横幅及其标题仍然存在,但没有描述。即使我刷新并强制刷新浏览器,它也不会回来。唯一能再次看到它的方法是先返回主类别,然后再返回子类别。


编辑:好的,我发现了一些问题。当然,我不知道后台发生了什么,但红色选项会导致问题。绿色选项按预期工作(始终在屏幕上,无论我点击哪里,无需双击侧边栏菜单即可使横幅回来):

3 个赞

我能重现您的问题,但无法解释。:sweat_smile:

从技术上讲(忽略我),这就是我在此 header-list-container-bottom 元素上观察到的情况:

  • 如果您选择一个子类别 → 标签,该组件会被插入,并且紧接着会调用 teardownComponent(?)。但该组件并未被销毁。当从清理函数中从 \u003cbody\u003e 移除了 category-header 类时,一些 CSS 会隐藏该横幅。您可以选择另一个标签来重新插入该组件。

    • 在同一页面上,如果您单击侧边栏中的文档链接,您会遇到相同的行为。
    • 例如,如果您从下拉列表中选择一个类别,则不会发生这种情况。

    在插入后,will-destroy 立即被调用的原因令人困惑。

2 个赞

Well, at least I know it’s not just me… that’s good.

Even if I didn’t want to, I have no idea what you are talking about in your explanation haha But it’s good that you know that something that should be working a certain way, isn’t. That’s probably a step in the right direction to fix it.

So the issue seems to be with the location of the banner, because as I said, one of the options (at least, because I actually didn’t try the other two), works.

1 个赞

当我选择“显示类别徽标”时,徽标会出现两次——一次来自类别设置,一次来自这个主题组件。我是不是搞错了?

另外,是否可以让“关于”标题和/或描述显示在徽标下面?

不,这是一个已知错误。您也可以添加一些 CSS 来隐藏该主题中的一个徽标

谢谢你,Moin!CSS帮我修好了图片。

为了将分类名称放在图片下面,这对我有效:

.category-title-contents,
.category-title-header.category-banner-1slug .category-title-contents {
    display: flex !important;
    flex-direction: column !important;
    align-items: flex-start !important;}
.category-logo,
.category-title-header.category-banner-1slug .category-logo {
    width: 100%;
    margin-bottom: 10px;
    margin-right: 0;}
.category-title,
.category-title-header.category-banner-1slug .category-title {
    width: 100%;
    margin-top: 20px;
    text-align: left;}

您好!也许有人能帮我解决一个突然出现得很奇怪的问题。

以前横幅中的所有标题都是白色的,但现在它们变成了黑色,而且只在某些类别中……这是一个已知的错误,还是我应该检查一下我这边的问题?

例如:

以防万一,我们社区的链接:https://community.elfsight.com/

1 个赞