# Date in timeline slider sometimes not showing in mobile layout

**URL:** https://meta.discourse.org/t/date-in-timeline-slider-sometimes-not-showing-in-mobile-layout/259646
**Category:** UX
**Created:** [March 28, 2023, 4:19am UTC](https://meta.discourse.org/t/date-in-timeline-slider-sometimes-not-showing-in-mobile-layout/259646 "2023-03-28T04:19:29Z")
**Posts on this page:** 6
**Page:** 1

<div class="post-metadata">

### Author: ![rahim123](https://avatars.discourse-cdn.com/v4/letter/r/df705f/32.png) [@rahim123](https://meta.discourse.org/u/rahim123)
#### Post date: [March 28, 2023, 4:19am UTC](https://meta.discourse.org/t/date-in-timeline-slider-sometimes-not-showing-in-mobile-layout/259646/1 "2023-03-28T04:19:29Z")

</div>

Hi, there seem to be some very random issues with Discourse not showing the date or just showing the month without the year in the timeline slider, especially in mobile mode:

#### Narrow desktop mode: 1) Firefox logged in, 2) Firefox anon, 3) Chromium logged in, 4) Chromium anon

 ![Screenshot from 2023-03-27 22-55-33](https://global.discourse-cdn.com/meta/original/4X/b/e/c/becffff1644eadf6b7f4a810f9d2e72079b3cb60.png)

#### Mobile mode: 1) Firefox logged in, 2) Firefox anon, 3) Chromium logged in, 4) Chromium anon

 ![Screenshot from 2023-03-27 22-58-38](https://global.discourse-cdn.com/meta/original/4X/2/4/a/24abce3e4faac6baa98944f60d1a254c99e0e59b.png)

There has also been difficulty getting the date to show in the timeline even in normal width desktop mode. I found a CSS tweak that a dev uploaded [here](https://github.com/ToyKeeper/blf-themes/blob/trunk/style.css#L1263) which when applied on my Discourse seems to make it always show the month/year in normal desktop width, and at least the month but sometimes not the year in mobile mode on Firefox for Android, and always the full month/year in mobile mode on Chrome for Android:

```plaintext
.timeline-container .topic-timeline .timeline-scrollarea {
    min-width: 5em;
}
.timeline-container .topic-timeline .timeline-replies,
.timeline-container .topic-timeline .timeline-ago {
    overflow: visible;
    max-width: unset;
}
.timeline-container .topic-timeline .timeline-scroller-content {
    overflow: visible;
    padding-left: 0.5em;
    max-height: 4em;
}
```

---

<div class="post-metadata">

### Author: ![awesomerobot](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/awesomerobot/32/142900_2.png) [@awesomerobot](https://meta.discourse.org/u/awesomerobot)
#### Post date: [March 28, 2023, 12:46pm UTC](https://meta.discourse.org/t/date-in-timeline-slider-sometimes-not-showing-in-mobile-layout/259646/2 "2023-03-28T12:46:09Z")

</div>

I’ll take a look at this; sometimes the date will be hidden if there’s not enough space for it… though in this case on mobile I think it’s being a little too aggressive.

---

<div class="post-metadata">

### Author: ![rahim123](https://avatars.discourse-cdn.com/v4/letter/r/df705f/32.png) [@rahim123](https://meta.discourse.org/u/rahim123)
#### Post date: [March 28, 2023, 1:35pm UTC](https://meta.discourse.org/t/date-in-timeline-slider-sometimes-not-showing-in-mobile-layout/259646/4 "2023-03-28T13:35:02Z")

</div>

Thanks a lot @awesomerobot for looking into it!

> [@awesomerobot](#):
>
> sometimes the date will be hidden if there’s not enough space for it

Does it also sometimes try to show just the month without the year to save space, or is that a separate bit of logic or a bug? I suspected that it had something to do with space limitations, and I tried different zoom levels but it doesn’t seem to make any difference, and I’m not sure why there’s inconsistency between Firefox and Chromium. For example:

 ![Screenshot from 2023-03-28 08-25-06](https://global.discourse-cdn.com/meta/original/4X/3/4/5/345ce729319d91da0327c6de5d8acb7c61008a0f.png)  
 ![Screenshot from 2023-03-28 08-25-19](https://global.discourse-cdn.com/meta/original/4X/a/f/2/af25665c50673ce1bd249a7cee08814d3be81b39.png)

And then I’m not sure why there’s a difference in the amount of space needed to display _Mar 2020_ (only shows _Mar_ and only in Firefox) vs. _Apr 2020_ (shows the year too only with Firefox):

 ![Screenshot from 2023-03-28 08-27-07](https://global.discourse-cdn.com/meta/original/4X/d/c/9/dc97d2caaa06cf7e968e902610ef094eb630d5de.png)  
 ![Screenshot from 2023-03-28 08-27-19](https://global.discourse-cdn.com/meta/original/4X/b/2/1/b218d1b43f3b258d71cbb365d53102c581a19770.png)

---

<div class="post-metadata">

### Author: ![awesomerobot](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/awesomerobot/32/142900_2.png) [@awesomerobot](https://meta.discourse.org/u/awesomerobot)
#### Post date: [March 28, 2023, 1:43pm UTC](https://meta.discourse.org/t/date-in-timeline-slider-sometimes-not-showing-in-mobile-layout/259646/5 "2023-03-28T13:43:21Z")

</div>

The content is limited to 2 lines to avoid another issue with the “back” button positioning and overlapping with the dates at the top/bottom — so anything that would wrap to a third line is hidden.

---

<div class="post-metadata">

### Author: ![awesomerobot](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/awesomerobot/32/142900_2.png) [@awesomerobot](https://meta.discourse.org/u/awesomerobot)
#### Post date: [April 4, 2023, 7:34pm UTC](https://meta.discourse.org/t/date-in-timeline-slider-sometimes-not-showing-in-mobile-layout/259646/6 "2023-04-04T19:34:59Z")

</div>

I’ve made an update that should improve this, it’s live on Meta now. Let me know if you still encounter the issue.

[https://github.com/discourse/discourse/pull/20943](https://github.com/discourse/discourse/pull/20943)

---

<div class="post-metadata">

### Author: ![rahim123](https://avatars.discourse-cdn.com/v4/letter/r/df705f/32.png) [@rahim123](https://meta.discourse.org/u/rahim123)
#### Post date: [April 7, 2023, 7:16pm UTC](https://meta.discourse.org/t/date-in-timeline-slider-sometimes-not-showing-in-mobile-layout/259646/7 "2023-04-07T19:16:03Z")

</div>

Working great, thanks very much @awesomerobot !
