Horizontaler Ladeschieberegler

Themenkomponente
23

Cool. Can you provide the id/class for the override as I do not want to change our quaternary color?

Update: Never mind, found it.

4 „Gefällt mir“
24

Now it looks very good! Great work! :+1:

5 „Gefällt mir“
25

Possibly, but this is still just an experiment at this stage.

Just in case anyone else needs it:

div.loading-indicator {
  background-color: red
}
17 „Gefällt mir“
26

@david Kindly could you replicate the animation 100% like on Github, where first a slightly darker bar appears over the full with, then the loading bar starts filling, and then it fades away?

5 „Gefällt mir“
27

Sure we can try a subtle background there. I am also wondering if ‘tertiary’ is a better color choice here for the bar itself.

16 „Gefällt mir“
28

Would it be possible to add a body class when the loading bar is active so we can add effects on other parts accordingly?
I’m thinking about the fadeout effect from NodeBB: https://community.nodebb.org/
I suppose it could be done with something like that if we have a body class:

body.loading {
    #main-outlet {
        transition: opacity 0.25s;
        opacity: 0;
    }
}
8 „Gefällt mir“
35

I really like it because YouTube does the exact same thing. Although this is experimental, I would like to see it make its way to core. The spinning circle looked very static, so maybe that should get an overhaul and I would more or less be a fan of that instead of the slider.

5 „Gefällt mir“
36

Love it so far. Such a neat detail.

5 „Gefällt mir“
37

Thanks for adding the background! Looks much better and more dynamic now. Great stuff @david

5 „Gefällt mir“
38

I read posts (like 28th post) in this topic, and then I clicked on the topic (to get to the beginning of topic) I didn’t have this thing.

8 „Gefällt mir“
39

Minor, but I think the thickness of the line we use in discourse hub works way better

@pmusaraj how many pixels thick is the line in the hub?

11 „Gefällt mir“
41

Using the topic timer to move around brings up the spinner instead of the slider.

8 „Gefällt mir“
42

It’s currently 2px. But IIRC DiscourseHub deliberately chops off the top 1px of the viewport to work around an iOS bug. So in DiscourseHub it shows as 1px.

12 „Gefällt mir“
44

I see, looking at it now

DiscourseHub 3px
Loading component + hub 1px
Loading component + safari 2px

Would love to see them all 3px :slight_smile:

Note we can have the hub take care of fixing the hub

13 „Gefällt mir“
45

Ahh I see what you mean now - the app has its own loading slider. Yeah 3px looks much better :+1:

@pmusaraj is there a way I can tell in CSS whether Discourse is running in the hub? Or maybe the app can inject some extra CSS?

10 „Gefällt mir“
46

Hmm, looks like we only add a class for the app on iPad. In JS, you could check using the isAppWebview() utility (or we can add a body class for all DiscourseHub webviews, that would be useful anyways).

10 „Gefällt mir“
47

I personally feel this is a big improvement over the spinner and we should move it into core as the default. :clap: It “feels” a lot faster than the spinner, surprisingly so! What do you think @sam and @eviltrout? We have some time to live with it and decide…

19 „Gefällt mir“
48

Yes I am liking this a lot both on desktop and mobile. A few small glitches to work out but yes I think this should be included in core.

14 „Gefällt mir“
49

I was wondering why the progress bar showed up! I love it, nice one @david :clap:

14 „Gefällt mir“
51

Love it! On my macbook retina screen it’s a bit too subtle for my taste though - I feel it shows up more like 1px tall than 3? It’s hardly noticeable.

4 „Gefällt mir“