mirror of
https://github.com/cpvalente/ontime.git
synced 2026-07-26 10:38:55 +00:00
fix(ui): prevent warning indicator from overflowing container
This commit is contained in:
committed by
Carlos Valente
parent
64082ceac0
commit
0c5e87b7e7
@@ -17,7 +17,7 @@ $skip-opacity: 0.2;
|
||||
'binder pb-actions estatus estatus'
|
||||
'binder ... ... ...';
|
||||
|
||||
grid-template-columns: $block-binder-width 3rem 1fr 3rem;
|
||||
grid-template-columns: $block-binder-width 3rem minmax(0, 1fr) 3rem;
|
||||
grid-template-rows: 0.125rem 2rem 2rem auto 0.125rem;
|
||||
align-items: center;
|
||||
padding-right: $block-clearance;
|
||||
@@ -137,6 +137,7 @@ $skip-opacity: 0.2;
|
||||
align-items: center;
|
||||
gap: $block-clearance;
|
||||
height: 100%;
|
||||
min-width: 0;
|
||||
}
|
||||
|
||||
.eventTimers.editMode:hover {
|
||||
|
||||
@@ -4,10 +4,15 @@
|
||||
|
||||
.timerNote {
|
||||
width: 1.25em;
|
||||
flex: 0 0 1.25em;
|
||||
color: $blue-500;
|
||||
font-size: 1.5em;
|
||||
}
|
||||
|
||||
.timerNotePlaceholder {
|
||||
visibility: hidden;
|
||||
}
|
||||
|
||||
.inactive {
|
||||
color: $muted-gray;
|
||||
}
|
||||
|
||||
@@ -21,6 +21,7 @@ interface TimeInputFlowProps {
|
||||
linkStart: boolean;
|
||||
delay: number;
|
||||
showLabels?: boolean;
|
||||
showWarnings?: boolean;
|
||||
}
|
||||
|
||||
export default memo(TimeInputFlow);
|
||||
@@ -33,6 +34,7 @@ function TimeInputFlow({
|
||||
linkStart,
|
||||
delay,
|
||||
showLabels,
|
||||
showWarnings = true,
|
||||
}: TimeInputFlowProps) {
|
||||
const { updateEntry, updateTimer } = useEntryActionsContext();
|
||||
|
||||
@@ -130,11 +132,19 @@ function TimeInputFlow({
|
||||
</TimeInputGroup>
|
||||
</div>
|
||||
|
||||
{warnings.length > 0 && (
|
||||
<Tooltip text={warnings.join(' - ')} className={style.timerNote} data-testid='event-warning' render={<span />}>
|
||||
{showWarnings &&
|
||||
(warnings.length > 0 ? (
|
||||
<Tooltip
|
||||
text={warnings.join(' - ')}
|
||||
className={style.timerNote}
|
||||
data-testid='event-warning'
|
||||
render={<span />}
|
||||
>
|
||||
<IoAlertCircleOutline />
|
||||
</Tooltip>
|
||||
)}
|
||||
) : (
|
||||
<span className={`${style.timerNote} ${style.timerNotePlaceholder}`} aria-hidden='true' />
|
||||
))}
|
||||
</>
|
||||
);
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user