水平加载滑块

好的。你能提供用于覆盖的 ID 或类名吗?因为我不想更改我们的四级颜色。

更新:不用了,我已经找到了。

4 个赞

现在看起来非常棒!干得漂亮!:100:

5 个赞

有可能,但目前这仍只是一个实验。

以防其他人也需要:

div.loading-indicator {
  background-color: red
}
17 个赞

@david 能否请您完全复现 GitHub 上的动画效果?即首先在整个宽度上出现一条颜色稍深的横条,然后加载条开始填充,最后淡出消失?

5 个赞

当然,我们可以尝试在那里添加一个微妙的背景。我也在考虑,对于该栏本身,“三级”颜色是否是更好的选择。

16 个赞

能否在加载条激活时添加一个 body 类,以便我们相应地为其他部分添加效果?
我想到了 NodeBB 的淡出效果:https://community.nodebb.org/
如果有了 body 类,我想可以通过类似以下方式实现:

body.loading {
    #main-outlet {
        transition: opacity 0.25s;
        opacity: 0;
    }
}
8 个赞

我非常喜欢它,因为 YouTube 也做了完全相同的事情。虽然这目前处于实验阶段,但我希望它能被纳入核心功能。那个旋转的圆圈看起来过于静态,或许应该对其进行彻底改造;与其使用滑块,我反而更倾向于采用这种方案。

5 个赞

目前为止非常喜欢。这个细节真巧妙。

5 个赞

感谢添加背景!现在看起来好多了,也更有活力。做得太棒了,@david

5 个赞

我阅读了本主题中的帖子(例如第28条),然后点击主题链接(以回到主题开头),但我没有遇到这个问题。

8 个赞

虽然是小问题,但我认为我们在 Discourse Hub 中使用的线条粗细效果要好得多。

@pmusaraj Hub 中的线条有多粗(多少像素)?

11 个赞

使用主题计时器进行移动时,会显示加载图标而不是滑块。

8 个赞

目前为 2px。但据我所知,DiscourseHub 特意切掉了视口顶部 1px,以规避 iOS 的一个 bug。因此,在 DiscourseHub 中它显示为 1px。

12 个赞

我明白了,现在看一下:

DiscourseHub 3px
加载组件 + hub 1px
加载组件 + Safari 2px

希望它们都能达到 3px :slight_smile:

注意,我们可以让 hub 负责修复 hub 的问题。

13 个赞

啊,我现在明白你的意思了——该应用有自己的加载滑块。是的,3px 看起来好多了 :+1:

@pmusaraj,我是否可以通过 CSS 判断 Discourse 是否在 Hub 中运行?或者应用是否可以注入一些额外的 CSS?

10 个赞

嗯,看起来我们只在 iPad 上为应用添加了一个类。在 JS 中,你可以使用 isAppWebview() 工具函数进行检查(或者我们可以为所有 DiscourseHub WebView 添加一个 body 类,这无论如何都会有用)。

10 个赞

我个人觉得这比加载转圈有了很大改进,我们应该将其作为默认选项纳入核心功能。:clap: 它“感觉”快得多,甚至出乎意料!@sam@eviltrout,你们怎么看?我们还有些时间可以实际体验一下再决定。

19 个赞

是的,我非常喜欢它在桌面端和移动端的体验。虽然还有一些小问题需要解决,但我认为它应该被纳入核心功能中。

14 个赞

我一直在想进度条怎么会出现!我很喜欢,做得好 @david :clap:

14 个赞

太棒了!不过在我的 MacBook Retina 屏幕上,这个效果对我来说有点太细微了——我觉得它看起来更像 1 像素高,而不是 3 像素?几乎看不出来。

4 个赞