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

refactor: improve fallback timer consistency

Browse Source
This commit is contained in:
Carlos Valente
2024-12-20 13:30:11 +01:00
committed by Carlos Valente
parent 3d37f42fe0
commit 1061ed2a0e
6 changed files with 67 additions and 16 deletions
Download Patch File Download Diff File Expand all files Collapse all files
apps/client/src/features/overview/composite/TimeLayout.module.scss
+5 -1
View File
@@ -44,6 +44,10 @@
content: "*";
vertical-align: super;
font-size: 0.75em;
color: $blue-500;
color: $info-blue;
}
}
.muted {
color: $muted-gray;
}
apps/client/src/features/overview/composite/TimeLayout.tsx
+5 -4
View File
@@ -7,20 +7,21 @@ import style from './TimeLayout.module.scss';
interface TimeLayoutProps {
label: string;
value: string;
muted?: boolean;
daySpan?: number;
className?: string;
}
export function TimeColumn({ label, value, className }: TimeLayoutProps) {
export function TimeColumn({ label, value, muted, className }: TimeLayoutProps) {
return (
<div className={style.column}>
<span className={style.label}>{label}</span>
<span className={cx([style.clock, className])}>{value}</span>
<span className={cx([style.clock, muted && style.muted, className])}>{value}</span>
</div>
);
}
export function TimeRow({ label, value, daySpan, className }: TimeLayoutProps) {
export function TimeRow({ label, value, daySpan, muted, className }: TimeLayoutProps) {
return (
<div className={style.row}>
<span className={style.label}>{label}</span>
@@ -29,7 +30,7 @@ export function TimeRow({ label, value, daySpan, className }: TimeLayoutProps) {
<span className={cx([style.clock, style.daySpan, className])}>{value}</span>
</Tooltip>
) : (
<span className={cx([style.clock, className])}>{value}</span>
<span className={cx([style.clock, muted && style.muted, className])}>{value}</span>
)}
</div>
);