cpvalente/ontime
1
0
Fork 0
mirror of https://github.com/cpvalente/ontime.git synced 2026-08-16 12:53:32 +00:00
Code Issues Packages Projects Releases 10 Wiki Activity

refactor: backstage design review

Browse Source 
refactor: improve empty state

refactor: review schedule design

- fit as many elements as possible
- expose cycle interval as an option
- stabilise rundown reference
- style tweaks
This commit is contained in:
Carlos Valente
2025-02-04 22:27:54 +01:00
committed by Carlos Valente
parent f99ad83049
commit 946b6717d2
34 changed files with 693 additions and 340 deletions
Download Patch File Download Diff File Expand all files Collapse all files
apps/client/src/theme/_viewerDefs.scss
+10 -5
View File
@@ -9,6 +9,12 @@ $viewer-transition-time: 0.5s;
$viewer-font-family: 'Open Sans', 'Segoe UI', sans-serif; // --font-family-override
$viewer-opacity-disabled: 0.6;
$timer-label-size: clamp(12px, 1.25vw, 20px);
$base-font-size: clamp(15px, 1.5vw, 28px);
$title-font-size: clamp(18px, 2.25vw, 42px);
$timer-value-size: clamp(24px, 2.5vw, 48px);
$header-font-size: clamp(28px, 3.5vw, 64px);
// General styling
$accent-color: $red-500; // --accent-color-override
$delay-color: $ontime-delay-text;
@@ -23,16 +29,15 @@ $element-border-radius: 8px;
// Generic element sizes
$view-element-gap: min(2vh, 16px);
$view-block-padding: min(2vh, 16px);
$view-inline-padding: clamp(16px, 2vw, 24px);
$view-outer-padding: min(2vh, 16px) clamp(16px, 2vw, 24px);
$view-card-padding: min(2vh, 8px) clamp(16px, 2vw, 24px);
// Properties related to timer
$timer-color: rgba(white, 80%); // --timer-color-override
$timer-finished-color: $playback-negative;
$timer-bold-font-family: 'Arial Black', sans-serif; // --card-background-color-override
$timer-bold-font-family: 'Arial Black', sans-serif; // --font-family-bold-override
$external-color: rgba(white, 85%); // --external-color-override
// properties of other timers (clock and countdown)
$timer-label-size: clamp(16px, 1.5vw, 24px);
$timer-value-size: clamp(32px, 3.5vw, 50px);