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

style: user feedback tweaks

Browse Source
This commit is contained in:
cv
2023-09-02 12:56:53 +02:00
parent b869fa5c2d
commit ca9e49a26f
2 changed files with 8 additions and 1 deletions
Download Patch File Download Diff File Expand all files Collapse all files
apps/client/src/features/operator/status-bar/StatusBar.module.scss
+4
View File
@@ -31,6 +31,10 @@
grid-area: playback;
font-size: 2rem;
color: $gray-700;
&.active {
color: $ui-white;
}
}
.timeNow {
apps/client/src/features/operator/status-bar/StatusBar.tsx
+4 -1
View File
@@ -4,6 +4,7 @@ import { millisToString } from 'ontime-utils';
import PlaybackIcon from '../../../common/components/playback-icon/PlaybackIcon';
import { useTimer } from '../../../common/hooks/useSocket';
import { cx } from '../../../common/utils/styleUtils';
import { formatTime } from '../../../common/utils/time';
import styles from './StatusBar.module.scss';
@@ -58,7 +59,9 @@ export default function StatusBar(props: StatusBarProps) {
const elapsedTime = millisToString(timer.elapsed);
const PlaybackIconComponent = useMemo(() => {
return <PlaybackIcon state={playback} skipTooltip className={styles.playbackIcon} />;
const isPlaying = playback === Playback.Play || playback === Playback.Roll;
const classes = cx([styles.playbackIcon, isPlaying ? styles.active : null]);
return <PlaybackIcon state={playback} skipTooltip className={classes} />;
}, [playback]);
return (