refactor: timeline style tweaks

This commit is contained in:
Carlos Valente
2025-07-12 18:55:30 +02:00
committed by Carlos Valente
parent cdd021e76d
commit 0eaec1f88f
12 changed files with 427 additions and 162 deletions
@@ -3,15 +3,21 @@
$timeline-height: 1rem;
$timeline-color: color-mix(in srgb, transparent 60%, var(--background-color-override, $viewer-background-color));
.timeline {
.timelineContainer {
flex: 1;
font-weight: 600;
color: var(--color-override, $viewer-color);
background: var(--background-color-override, $viewer-background-color);
box-sizing: content-box;
// create progress background
box-shadow: inset 0 1rem 0 0 var(--card-background-color-override, $viewer-card-bg-color);
&.scroll {
overflow-x: scroll;
}
}
.timeline {
position: relative;
font-weight: 600;
height: 100%;
box-shadow: inset 0 1rem 0 0 var(--card-background-color-override, $viewer-card-bg-color);
}
.column {
@@ -19,8 +25,7 @@ $timeline-color: color-mix(in srgb, transparent 60%, var(--background-color-over
flex-direction: column;
position: absolute;
border-left: 1px solid var(--background-color-override, $viewer-background-color);
// avoiding content being larger than the view
height: calc(100% - 3rem);
height: 100%;
}
// generate combined timeline