# Usability issues in timeline view

**URL:** <https://community.fibery.io/t/usability-issues-in-timeline-view/3583>\
**Category:** Ideas & Features\
**Tags:** timeline-view\
**Created:** [November 23, 2022, 11:35am UTC](https://community.fibery.io/t/usability-issues-in-timeline-view/3583 "2022-11-23T11:35:29Z")\
**Posts on this page:** 5\
**Page:** 1

<div class="post-metadata">

**Author:** ![zazy](https://avatars.discourse-cdn.com/v4/letter/z/a4c791/32.png) [@zazy](https://community.fibery.io/u/zazy)\
**Post date:** [November 23, 2022, 11:35am UTC](https://community.fibery.io/t/usability-issues-in-timeline-view/3583/1 "2022-11-23T11:35:29Z")

</div>

I’m having little issues using timeline view on Fibery. I list them here rondomly:

1. Actually to show the current date there is a red (on the dark theme) line placed in the current date column. First issue is that this line is behind all timeline items so when the timeline is full, items hide the red line and it become barely visible.

2. The current date is not visible at a glance because there is no change in color of the cell containing the day number. I tried to apply a style but there is no HTML class or id to use and there is no way to “customize” the appearance using Chrome extensions like StyleBot. I think that highlighting the current day column would greatly enhance the user experience and the usability.

3. When you enable fields to be shown, if the timeline item is longer than the screen, fields are not visible because they are rendered at the end of the item bar

---

<div class="post-metadata">

**Author:** ![Matt\_Blais](https://sea2.discourse-cdn.com/flex020/user_avatar/community.fibery.io/matt_blais/32/1464_2.png) [@Matt\_Blais](https://community.fibery.io/u/Matt_Blais)\
**Post date:** [November 23, 2022, 3:39pm UTC](https://community.fibery.io/t/usability-issues-in-timeline-view/3583/2 "2022-11-23T15:39:13Z")

</div>

Try injecting this custom CSS to make the red “Today line” more visible, and lie on top of your events so it is not hidden by them:

```auto
.MarkerCanvas>.TimelineContent {
    width: 16px !important;
    z-index: 999;
    mix-blend-mode: color;
}

```

 ![image](https://us1.discourse-cdn.com/flex020/uploads/fibery/original/2X/b/bc4a8ac53fbefa901ab48c3a909386981d820533.png)

---

<div class="post-metadata">

**Author:** ![zazy](https://avatars.discourse-cdn.com/v4/letter/z/a4c791/32.png) [@zazy](https://community.fibery.io/u/zazy)\
**Post date:** [November 24, 2022, 10:47am UTC](https://community.fibery.io/t/usability-issues-in-timeline-view/3583/3 "2022-11-24T10:47:19Z")

</div>

Great suggestion. I wasn’t able to find where the “today line” DOM node was. This solves points 1 and 2, at least on my side.

I also added this:

```auto
.TimelineItemRenderer.tooltip .TimelineItemRenderer.Box .Title {
    mix-blend-mode: difference;
}

```

so that text in highlighted timeline bar is readable. It will “fade” other titles a little bit but it’s something I can bear with.

---

<div class="post-metadata">

**Author:** ![gomocoop](https://sea2.discourse-cdn.com/flex020/user_avatar/community.fibery.io/gomocoop/32/6349_2.png) [@gomocoop](https://community.fibery.io/u/gomocoop)\
**Post date:** [August 15, 2023, 1:37pm UTC](https://community.fibery.io/t/usability-issues-in-timeline-view/3583/4 "2023-08-15T13:37:37Z")

</div>

Hello! I just got to this post and wanted to try this on my Fibery… but where exactly do I enter this custom CSS code?

Thanks!

---

<div class="post-metadata">

**Author:** ![Chr1sG](https://sea2.discourse-cdn.com/flex020/user_avatar/community.fibery.io/chr1sg/32/3941_2.png) [@Chr1sG](https://community.fibery.io/u/Chr1sG)\
**Post date:** [August 15, 2023, 1:43pm UTC](https://community.fibery.io/t/usability-issues-in-timeline-view/3583/5 "2023-08-15T13:43:47Z")

</div>

> [@gomocoop](#):
>
> where exactly do I enter this custom CSS code?

You would need to install a css editor extension to your browser (Fibery doesn’t include the option)