主题卡片

:discourse2: 摘要 主题卡片 将主题列表重新设计为带有缩略图的卡片显示
:eyeglasses: 预览 在 Discourse 主题创建器上预览
: hammer_and_wrench: 代码库 \u003chttps://github.com/discourse/discourse-topic-cards\u003e
: open_book: 首次使用 Discourse 主题? Discourse 主题使用入门指南

安装此主题组件

\u003e :information_source: 此主题组件可能与其他主题列表自定义设置产生冲突

功能

此组件的灵感来自 主题缩略图,简化了使用,添加了摘要和整卡点击功能,并增加了一些额外的 CSS 魔法。

  • 使整张卡片可点击(原始发帖人头像除外)
  • 显示摘要
  • 显示主题缩略图(如果可用)
  • 显示发布日期
  • 移除部分元数据并使点赞数更突出

桌面

移动设备

设置

翻译 默认值
published Published

\u003cbr\u003e

\u003e:discourse2: 由我们托管? 在我们的 Standard、Business 和 Enterprise 套餐中均可使用主题组件。

38 个赞

蓝色的垂直线覆盖了部分文本


(似乎与浏览器/设备无关,我在 Edge/Windows、Chrome/Android 和 Firefox/Android 上都试过了)

7 个赞

在 Windows 上的 Chrome 和 iPhone 8 上的 Chrome 中均开箱即用

4 个赞

对了,我忘了这个。我会修复的——谢谢。

4 个赞

如何移除“+新建主题”按钮下方的“回复”和“活动”选项卡?
这使得我的主题列表看起来很短,而且不好看,哈哈

1 个赞

你好 @jayme,看起来那些标签不属于这个组件,很可能是由另一个主题组件或插件添加的。当我加载一个带有此组件的测试论坛时,那些标签不存在,在 OP 的截图中也没有显示。你可能需要禁用其他组件来找出是哪个,然后如果那些标签没有设置,你可能需要禁用它。

5 个赞

边框/box-shadow 与卡片配合不佳,因此不得不进行一些即兴创作以获得替代指示

4 个赞

不知何故,我现在看不到任何指示了 :thinking:
Theme_Creator_default
Theme_Creator_cards

2 个赞

您是否正在使用 j/k 命令进行导航?

不,我只是用了 Tab 键。实际上,我用了我的平板电脑。在我使用了返回按钮后,帖子通常会被高亮显示。在这里没有发生。我只在电脑上尝试了录制。

1 个赞

4 篇帖子已拆分为新主题:特定类别的专题卡片

很棒的主题组件!

3 个赞

我尝试将此组件安装在许多主题上,但到处看起来都有点歪斜。我哪里做错了?

3 个赞

嗯……很难说。看起来卡片的高度不知何故受到限制,而内容比平时要大。

您能先确认一下这不是由于与其他组件或主题冲突造成的吗?我看到您还启用了右侧边栏,这可能会影响一些尺寸计算。

所以请检查一下,然后告诉我好吗?

4 个赞

我禁用了所有其他组件,但问题仍未解决。

2 个赞

奇怪!:confused: 我可以看看你安装了它的论坛吗?

2 个赞

bearblog.ru

但您需要在个人资料设置中将主题更改为 dracula。

3 个赞

好的,我会看看!

1 个赞

在我看来,这个问题可以通过限制预览中的字符数来解决,但我不知道该怎么做。

2 个赞

好的,主题卡片需要一个最大高度,否则会出现类似以下的问题:

我无法解释为什么你的卡片不合适,因为在主题创建者的示例中,我也可以使用多行标题,并且仍然能够适应:

这可能与字体大小、字体系列或行高有关。不幸的是,这需要一些单独的调整,而不是我可以应用“一刀切”的修复。

一个可能的解决方案是,正如你所说,将标题限制为只占一行,你可以通过添加以下 CSS 来实现:

.topic-card {
  .link-top-line {
      max-width: 100%;
      overflow: hidden;

     .title {
        display: block;
        white-space: no-wrap;
      }
   }
}
4 个赞