UI: Style transition arrow tweaks

* Replace font-size with transform and inline-block display, this way the arrow
scales without making the line taller (which leads to misalignments or jumpy
UI when switching between transitional statuses.

* Do not use accent color, it gets lost with the surrounding colors in status names.
  If we need to make this transition more prominent, we can use a subtle animation.
This commit is contained in:
Pablo Vazquez 2022-07-07 12:19:00 +02:00
parent ff4a4e8aa0
commit d072e2c146

View File

@ -465,9 +465,9 @@ footer.window-footer {
} }
span.state-transition-arrow { span.state-transition-arrow {
display: inline-block;
font-weight: bold; font-weight: bold;
font-size: 110%; transform: scale(1.4);
color: var(--color-accent);
} }
span.state-transition-arrow.lazy { span.state-transition-arrow.lazy {
color: var(--color-text-muted); color: var(--color-text-muted);