temporalio / ui

Temporal UI
https://docs.temporal.io/web-ui
MIT License
179 stars 67 forks source link

Buttons `scrollToTop/Bottom` overlaps the history timestamp #2145

Closed trin4ik closed 1 week ago

trin4ik commented 3 months ago

image

problem: buttons scrollToTop and scrollToBottom overlaps the history timestamp

solution:

  1. hide scrollToBottom button on bottom
  2. move buttons left, if they overlaps the timestamp

i've prepared a PR, but it does a few things:

  1. timestamps hides by computed js $: showTimestamp = canvasWidth > 1200;, i think good solutions for this -- use tilewind "responsive design" css like media (https://tailwindcss.com/docs/responsive-design)
  2. some js to hide scrollToBottom if bottom and move scroll container, if buttons over history
  3. add tooltip ctrl+up, ctrl+down for scroll buttons. seems, if user need buttons, he not use scroll. it's weird that he doesn't know about keyboard shortcuts and needs buttons.

do i need to split pr into parts or can push one?

trin4ik commented 3 months ago

more fast solution -- add class="opacity-30 hover:opacity-100" to buttons and no need other steps

Alex-Tideman commented 1 week ago

Fixed in https://github.com/temporalio/ui/pull/2269