* refactor: cleanup routes

* style: smaller base font

* chore: upgrade dependencies

* chore: lock node version to electron

* refactor: pass HTTP to integration controller (#652)

* refactor: deprecate onair control

* refactor: remove playback router

* Several project files user folder (#617)

* chore: automated screenshots (#667)

* feat: app settings (#658)

* refactor: remove deprecated event data (#674)

* Studio clock (#663)

---------

Co-authored-by: Carlos Valente <carlosvalente@pm.me>

* Feat: reorder events with alt+ctrl + arrow up/down (#645)

* Warning and danger per event (#677)

---------

Co-authored-by: Fabian Posenau <fabian@fphome.de>

* refactor: stabilise actionHandler (#683)

Co-authored-by: Fabian Posenau <fabian@fphome.de>

* improvement: hide seconds (#675)

* wip: overview (#688)

* fix: focus cursor (#695)

* refactor: update lower third (#665)

* Refactor/time formatting (#696)

---------

Co-authored-by: Carlos Valente <34649812+cpvalente@users.noreply.github.com>
Co-authored-by: Carlos Valente <carlosvalente@pm.me>

* feat: multiple selection (#703)

---------

Co-authored-by: asharonbaltazar <asharonbaltazar@outlook.com>
Co-authored-by: Alex <ac@omnivox.dk>

* fix: test - go to `Edit mode` befor tying to click `Event options` button (#708)

* refactor: runtime service (#715)

* fix: issue with loosing cursor position on message (#719)

* remove info panel (#721)

* Event editor continue (#722)

* update API - part  (#709)

---------

Co-authored-by: Carlos Valente <34649812+cpvalente@users.noreply.github.com>
Co-authored-by: Carlos Valente <carlosvalente@pm.me>

* refactor: update timers (#729)

* feat: many timers (#706)

---------

Co-authored-by: arc-alex <ac@omnivox.dk>

* refactor: excel cleanup (#734)

* refactor: allow import of blocks and skip import (#735)

* Project manager (#697)

* refactor: UI for linking events (#763)

* upgraded pipeline actions (#777)

* Over under (#771)

* custom fields (#744)


---------

Co-authored-by: Carlos Valente <carlosvalente@pm.me>

* Sheets settings (#774)

---------

Co-authored-by: arc-alex <ac@omnivox.dk>

* style: tweaks to lower thirds (#785)

* refactor: delays account for gaps (#784)

* refactor: partial state updates (#780)

* feat: generate crash report (#787)

* Sheet use limited input device auth flow (#782)

---------

Co-authored-by: cv <34649812+cpvalente@users.noreply.github.com>
Co-authored-by: Carlos Valente <carlosvalente@pm.me>

* Custom fields views (#789)

* refactor: deprecate presenter and subtitle (#795)

* refactor: organise API around resources (#798)

---------

Co-authored-by: Bianca Procopio <biancahprocopio@gmail.com>

* Time to end (#804)

* Skip fixes (#805)

* fix: onair derives from playback

* Param nav (#822)

---------

Co-authored-by: Alex Christoffer Rasmussen <ac@omnivox.dk>

* refactor: download files from interface (#831)

* Quick options (#814)

* End pause (#832)

* chore: bump node version in docker (#834)

* refactor: follow in run mode (#840)

* fix: uncaught error in http integration (#837)

* Apply project (#843)

Co-authored-by: Matteo Gheza <matteo.gheza07@gmail.com>
Co-authored-by: Ary <arylmoraesn@gmail.com>
Co-authored-by: Alex Christoffer Rasmussen <ac@omnivox.dk>
Co-authored-by: Fabian Posenau <19673098+kellhogs@users.noreply.github.com>
Co-authored-by: Fabian Posenau <fabian@fphome.de>
Co-authored-by: Alex Rohleder <alexrohleder96@gmail.com>
Co-authored-by: asharonbaltazar <asharonbaltazar@outlook.com>
Co-authored-by: Bianca Procopio <biancahprocopio@gmail.com>
Co-authored-by: Fabian Posenau <fabianpos99+github@gmail.com>
This commit is contained in:
Carlos Valente
2024-04-13 10:06:46 +02:00
committed by GitHub
parent debdbd1c5a
commit 55d1aca9b6
640 changed files with 26702 additions and 21623 deletions
+5 -4
View File
@@ -1,11 +1,12 @@
export const ontimeAlertOnLight = {
export const ontimeAlertOnDark = {
container: {
fontSize: '14px',
backgroundColor: '#f6f6f6', // $gray-50
color: '#101010', // $ui-black
fontSize: 'calc(1rem - 1px)',
backgroundColor: '#1a1a1a', // $gray-1300
color: '#e2e2e2', // $gray-200
borderRadius: '3px',
},
icon: {
alignSelf: 'start',
color: '#578AF4', // $blue-500
},
};
-8
View File
@@ -1,8 +0,0 @@
export const ontimeProgressGray = {
track: {
background: '#f6f6f6', // $gray-500
},
filledTrack: {
background: '#578AF4', // $blue-500
},
};
+3 -2
View File
@@ -1,4 +1,4 @@
@use "v2Styles" as *;
@use "ontimeStyles" as *;
//////////////////////////////////// general app elements
@@ -9,8 +9,9 @@
cursor: pointer;
transition-property: color;
transition-duration: $transition-time-action;
white-space: nowrap;
&:hover {
color: $ontime-color;
}
}
}
@@ -28,6 +28,7 @@ $gray-1100: #2d2d2d;
$gray-1200: #262626;
$gray-1250: #202020;
$gray-1300: #1a1a1a;
$gray-1325: #151515;
$gray-1350: #101010;
$pure-white: #fff;
$ui-white: $gray-50;
@@ -36,6 +36,7 @@ $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;
$box-shadow-right: rgba(0, 0, 0, 0.15) 3px 0 3px 0;
$large-bottom-drawer-shadow: rgba(0, 0, 0, 0.35) 0 3px 6px 6px;
$large-top-drawer-shadow: rgba(0, 0, 0, 0.35) 0 1px 6px 3px;
@@ -68,3 +69,9 @@ $min-tablet: 500px;
opacity: 20%;
}
}
@mixin ellipsis-overflow() {
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}
-4
View File
@@ -1,7 +1,3 @@
.mirror {
transform: rotate(180deg);
}
.blackout {
opacity: 0;
}
+4 -4
View File
@@ -1,12 +1,12 @@
@use 'v2Styles' as *;
@use 'ontimeStyles' as *;
@use 'viewerCommon' as *;
@use "ontimeColours" as *;
@use 'ontimeColours' as *;
// General
$viewer-transition-time: 0.5s;
// Text
$viewer-font-family: "Open Sans", "Segoe UI", sans-serif; // --font-family-override
$viewer-font-family: 'Open Sans', 'Segoe UI', sans-serif; // --font-family-override
$viewer-opacity-disabled: 0.6;
// General styling
@@ -25,6 +25,6 @@ $element-border-radius: 8px;
// 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; // --card-background-color-override
$external-color: rgba(white, 70%); // --external-color-override
+14 -27
View File
@@ -47,41 +47,28 @@ export const ontimeButtonSubtle = {
},
};
// TODO: revise colours
export const ontimeButtonGhostedWhite = {
...ontimeButtonSubtle,
backgroundColor: 'transparent',
color: 'white',
_hover: {
background: '#404040', // $gray-1000
},
_active: {
background: '#2d2d2d', // $gray-1100
},
};
export const ontimeButtonGhosted = {
...ontimeButtonSubtle,
backgroundColor: 'transparent',
};
export const ontimeButtonSubtleOnLight = {
backgroundColor: '#ececec', // $gray-100
color: '#595959', // $gray-800
border: '1px solid transparent',
_hover: {
backgroundColor: '#cfcfcf', // $gray-200
_disabled: {
backgroundColor: '#ececec', // $gray-100
},
},
_active: {
backgroundColor: '#ececec', // $gray-200
borderColor: '#ececec', // $gray-300
},
};
export const ontimeGhostOnLight = {
backgroundColor: 'transparent',
color: '#595959', // $gray-800
_hover: {
color: '#595959', // $gray-800
backgroundColor: '#ececec', // $gray-200
background: '#404040', // $gray-1000
_disabled: {
backgroundColor: 'transparent',
},
},
_active: {
backgroundColor: 'transparent',
borderColor: '#595959', // $gray-800
},
};
export const ontimeButtonSubtleWhite = {
+13 -1
View File
@@ -3,12 +3,24 @@ export const ontimeCheckboxOnDark = {
border: '1px',
borderColor: '#2d2d2d', // $gray-1100
backgroundColor: '#2d2d2d', // $gray-1100
_disabled: {
color: 'white',
borderColor: '#2d2d2d', // $gray-1100
backgroundColor: '#2d2d2d', // $gray-1100
opacity: 0.6,
},
_checked: {
borderColor: '#3182ce', // $action-blue
backgroundColor: '#3182ce', //$action-blue
_disabled: {
color: 'white',
borderColor: '#3182ce', // $action-blue
backgroundColor: '#3182ce', //$action-blue
opacity: 0.6,
},
},
_focus: {
boxShadow: '0 0 0 1px #578AF4', // $blue-500
boxShadow: 'none',
},
},
label: {
+20
View File
@@ -0,0 +1,20 @@
export const ontimeDrawer = {
header: {
color: '#fefefe', // $gray-50
backgroundColor: '#202020', // $gray-1250
},
body: {
color: '#fefefe', // $gray-50
backgroundColor: '#202020', // $gray-1250
},
footer: {
backgroundColor: '#202020', // $gray-1250
},
closeButton: {
color: '#fefefe', // $gray-50
_hover: {
color: '#303030', // $gray-1050
backgroundColor: '#fefefe', // $gray-50
},
},
};
+15 -7
View File
@@ -1,19 +1,27 @@
export const ontimeMenuOnDark = {
list: {
fontSize: 'calc(1rem - 2px)',
borderRadius: '3px',
border: 'none',
bg: '#fff', // $gray-50
borderColor: 'rgba(255, 255, 255, 0.1)',
color: '#ececec', // $gray-1030
backgroundColor: '#202020', // $gray-1250
zIndex: 100,
},
item: {
letterSpacing: '0.15px',
color: '#101010', // $gray-1350
bg: '#fff', //
backgroundColor: 'transparent',
paddingBlock: '0.5rem',
_hover: {
backgroundColor: '#e2e2e2', // $gray-200
backgroundColor: 'rgba(0, 0, 0, 0.2)',
_disabled: {
backgroundColor: 'transparent',
},
},
_disabled: {
color: '#b1b1b1', // $gray-400
},
},
divider: {
borderColor: '#cfcfcf', // $gray-200
borderColor: 'rgba(255, 255, 255, 0.07)',
opacity: 1,
},
};
+8 -27
View File
@@ -4,45 +4,26 @@ export const ontimeModal = {
letterSpacing: '0.3px',
padding: '1rem 1.5rem',
fontSize: '1.25rem',
color: '#202020', // $gray-50
color: '#fefefe', // $gray-50
},
dialog: {
borderRadius: '3px',
padding: 0,
minHeight: 'min(500px, 75vh)',
minHeight: 'min(200px, 10vh)',
backgroundColor: '#202020', // $gray-1250
color: '#fefefe', // $gray-50
},
body: {
padding: 0,
padding: '1rem',
fontSize: 'calc(1rem - 2px)',
display: 'flex',
flexDirection: 'column',
gap: '1rem',
},
closeButton: {
color: '#202020', // $gray-50
color: '#fefefe', // $gray-50
},
footer: {
padding: '0.5rem',
},
};
export const ontimeSmallModal = {
...ontimeModal,
body: {
padding: '1rem',
fontSize: 'calc(1rem - 2px)',
},
dialog: {
minHeight: 'min(200px, 10vh)',
},
};
export const ontimeUploadModal = {
...ontimeSmallModal,
body: {
padding: '1rem',
fontSize: 'calc(1rem - 2px)',
},
dialog: {
minHeight: 'min(200px, 10vh)',
maxWidth: 'min(800px, 80vh)',
},
};
+5
View File
@@ -13,6 +13,11 @@ export const ontimeSelect = {
color: '#f6f6f6', // $gray-50
border: '1px solid #578AF4', // $blue-500
},
_disabled: {
_hover: {
background: '#262626', // $gray-1100
},
},
},
icon: {
color: '#e2e2e2', // $gray-200
-13
View File
@@ -10,16 +10,3 @@ export const ontimeSwitch = {
},
},
};
export const lightSwitch = {
track: {
border: '1px solid transparent',
background: '#cfcfcf', // $gray-300
_checked: {
background: '#578AF4', // $blue-500
},
_focus: {
border: '1px solid #D2DDFF', // $blue-200
},
},
};
+8 -33
View File
@@ -3,6 +3,7 @@ const commonStyles = {
backgroundColor: '#262626', // $gray-1200
color: '#e2e2e2', // $gray-200
border: '1px solid transparent',
borderRadius: '3px',
_hover: {
backgroundColor: '#2d2d2d', // $gray-1100
},
@@ -25,20 +26,14 @@ export const ontimeInputFilled = {
},
};
export const ontimeInputFilledOnLight = {
export const ontimeInputGhosted = {
field: {
backgroundColor: 'white',
border: '2px solid #f6f6f6', // $gray-50
...commonStyles,
backgroundColor: 'transparent',
color: '#f6f6f6', // $gray-50
_hover: {
border: '2px solid #D2DDFF', // $blue-200
},
_focus: {
border: '2px solid #578AF4', // $blue-500
},
_disabled: {
_hover: {
backgroundColor: 'white',
},
backgroundColor: 'transparent', // $gray-1100
border: '1px solid #2B5ABC', // $blue-500
},
},
};
@@ -46,6 +41,7 @@ export const ontimeInputFilledOnLight = {
export const ontimeTextAreaFilled = {
...commonStyles,
};
export const ontimeTextAreaTransparent = {
...commonStyles,
backgroundColor: 'transparent',
@@ -53,24 +49,3 @@ export const ontimeTextAreaTransparent = {
backgroundColor: 'rgba(255, 255, 255, 0.10)', // $white-10
},
};
export const ontimeTextAreaFilledOnLight = {
borderRadius: '3px',
fontWeight: '400',
backgroundColor: 'white',
color: '#202020', // $gray-1200
border: '2px solid #f6f6f6', // $gray-50
_hover: {
border: '2px solid #D2DDFF', // $blue-200
},
_focus: {
color: '#101010',
border: '2px solid #578AF4', // $blue-500
},
_placeholder: { color: '#9d9d9d' }, // $gray-500
_disabled: {
_hover: {
backgroundColor: 'white',
},
},
};
+19 -21
View File
@@ -1,38 +1,38 @@
import { extendTheme } from '@chakra-ui/react';
import { ontimeAlertOnLight } from './OntimeAlert';
import { ontimeAlertOnDark } from './OntimeAlert';
import {
ontimeButtonFilled,
ontimeButtonGhosted,
ontimeButtonGhostedWhite,
ontimeButtonOutlined,
ontimeButtonSubtle,
ontimeButtonSubtleOnLight,
ontimeButtonSubtleWhite,
ontimeGhostOnLight,
} from './ontimeButton';
import { ontimeCheckboxOnDark } from './ontimeCheckbox';
import { ontimeDrawer } from './ontimeDrawer';
import { ontimeEditable } from './ontimeEditable';
import { ontimeMenuOnDark } from './ontimeMenu';
import { ontimeModal, ontimeSmallModal, ontimeUploadModal } from './ontimeModal';
import { ontimeProgressGray } from './OntimeProgress';
import { ontimeModal } from './ontimeModal';
import { ontimeBlockRadio } from './ontimeRadio';
import { ontimeSelect } from './ontimeSelect';
import { lightSwitch, ontimeSwitch } from './ontimeSwitch';
import { ontimeSwitch } from './ontimeSwitch';
import { ontimeTab } from './ontimeTab';
import {
ontimeInputFilled,
ontimeInputFilledOnLight,
ontimeInputGhosted,
ontimeTextAreaFilled,
ontimeTextAreaFilledOnLight,
ontimeTextAreaTransparent,
} from './ontimeTextInputs';
import { ontimeTooltip } from './ontimeTooltip';
const theme = extendTheme({
initialColorMode: 'dark',
useSystemColorMode: false,
components: {
Alert: {
variants: {
'ontime-on-light-info': { ...ontimeAlertOnLight },
'ontime-on-dark-info': { ...ontimeAlertOnDark },
},
},
Button: {
@@ -46,9 +46,8 @@ const theme = extendTheme({
'ontime-outlined': { ...ontimeButtonOutlined },
'ontime-subtle': { ...ontimeButtonSubtle },
'ontime-ghosted': { ...ontimeButtonGhosted },
'ontime-ghosted-white': { ...ontimeButtonGhostedWhite },
'ontime-subtle-white': { ...ontimeButtonSubtleWhite },
'ontime-subtle-on-light': { ...ontimeButtonSubtleOnLight },
'ontime-ghost-on-light': { ...ontimeGhostOnLight },
},
},
Checkbox: {
@@ -56,6 +55,11 @@ const theme = extendTheme({
'ontime-ondark': { ...ontimeCheckboxOnDark },
},
},
Drawer: {
variants: {
ontime: { ...ontimeDrawer },
},
},
Editable: {
variants: {
ontime: { ...ontimeEditable },
@@ -68,7 +72,7 @@ const theme = extendTheme({
},
variants: {
'ontime-filled': { ...ontimeInputFilled },
'ontime-filled-on-light': { ...ontimeInputFilledOnLight },
'ontime-ghosted': { ...ontimeInputGhosted },
},
},
Menu: {
@@ -77,15 +81,11 @@ const theme = extendTheme({
},
},
Modal: {
baseStyle: {
background: 'rgba(0, 0, 0, 0.5)',
},
variants: {
ontime: { ...ontimeModal },
'ontime-small': { ...ontimeSmallModal },
'ontime-upload': { ...ontimeUploadModal },
},
},
Progress: {
variants: {
'ontime-on-light': { ...ontimeProgressGray },
},
},
Radio: {
@@ -105,7 +105,6 @@ const theme = extendTheme({
variants: {
'ontime-filled': { ...ontimeTextAreaFilled },
'ontime-transparent': { ...ontimeTextAreaTransparent },
'ontime-filled-on-light': { ...ontimeTextAreaFilledOnLight },
},
},
Tooltip: {
@@ -114,7 +113,6 @@ const theme = extendTheme({
Switch: {
variants: {
ontime: { ...ontimeSwitch },
'ontime-on-light': { ...lightSwitch },
},
},
Select: {