mirror of
https://github.com/cpvalente/ontime.git
synced 2026-08-09 09:23:51 +00:00
Carlos Valente
3603b836f6
* refactor: typescript migration * chore: remove prop-types package * refactor: file structure * refactor: migrate ontime table to tanstack table 8 * refactor: rundown controller uses service as data source * refactor: convert to typescript * feat: caching store * refactor: add delay values to rundown * feat: toggle past visibility * chore: update tests * refactor: add extra fields to CSV * style: show skipped events * chore: add route to navigation menu * style: allow jumping to bottom * chore: add tests
65 lines
1.4 KiB
SCSS
65 lines
1.4 KiB
SCSS
@use "./ontimeColours" as *;
|
|
|
|
$transition-time-action: 0.1s;
|
|
$transition-time-feedback: 0.3s;
|
|
|
|
$blinking-time: 1.2s;
|
|
|
|
$component-border-radius-md: 3px;
|
|
$component-border-radius-sm: 2px;
|
|
|
|
// semantic colours
|
|
$action-blue: #3182ce;
|
|
$action-text-color: $blue-400;
|
|
$ontime-color: #ff7597;
|
|
$error-red: $red-500;
|
|
$warning-orange: $orange-500;
|
|
$opacity-disabled: 0.4;
|
|
|
|
// playback colours
|
|
$playback-start: $green-600;
|
|
$ontime-roll: #0274B6;
|
|
$ontime-delay: #F57C13;
|
|
$ontime-delay-text: #E69056;
|
|
$ontime-paused: #c05621;
|
|
$ontime-stop: #E4281E;
|
|
$playback-negative: $red-500;
|
|
$active-indicator: #8bb33d;
|
|
$text-black: $gray-1350;
|
|
|
|
// interface panels
|
|
$bg-container-l1: $gray-1350;
|
|
$bg-container-l2: $gray-1300;
|
|
$bg-container-l3: $gray-1350;
|
|
|
|
$bg-container-onlight: $gray-100;
|
|
|
|
$box-shadow-l1: rgba(0, 0, 0, 0.15) 0 3px 3px 0;
|
|
$box-shadow-l2: rgba(0, 0, 0, 0.15) 0 3px 3px 0;
|
|
|
|
$modal-note-color: $gray-700;
|
|
|
|
// interface elements
|
|
$border-color-ondark: $white-10;
|
|
$element-inner-spacing: 0.25rem;
|
|
$element-spacing: 0.5rem;
|
|
$section-spacing: 1rem;
|
|
$main-spacing: 2rem;
|
|
|
|
// interface text
|
|
$ontime-font-family: "Open Sans", "Segoe UI", sans-serif;
|
|
$label-gray: $gray-400;
|
|
$secondary-text-gray: $gray-400;
|
|
$section-white: $ui-white;
|
|
$inner-section-text-size: calc(1rem - 2px);
|
|
$text-body-size: calc(1rem - 1px);
|
|
|
|
.blink {
|
|
animation: blink $blinking-time linear infinite;
|
|
}
|
|
|
|
@keyframes blink {
|
|
50% {
|
|
opacity: 20%;
|
|
}
|
|
} |