Michal
/
UptimeFlare
mirror of https://github.com/lyc8503/UptimeFlare.git
1
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

css grid to align date text

pull/142/head
lyc8503 2025-09-23 00:46:48 +08:00
parent 697bda487e
commit d3208654ec
1 changed files with 20 additions and 4 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

22
components/MaintenanceAlert.tsx
View File

@ -53,11 +53,27 @@ export default function MaintenanceAlert({
: { marginBottom: 8 }), : { marginBottom: 8 }),
}} }}
> >
<b>{upcoming ? 'Scheduled for' : 'From'}:</b> {new Date(maintenance.start).toLocaleString()} <div
<br /> style={{
<b>{upcoming ? 'Expected end' : 'To'}:</b>{' '} display: 'grid',
gridTemplateColumns: 'auto 1fr',
gridColumnGap: '3px',
}}
>
<div style={{ textAlign: 'right', fontWeight: 'bold' }}>
{upcoming ? 'Scheduled for:' : 'From:'}
</div>
<div>
{new Date(maintenance.start).toLocaleString()}
</div>
<div style={{ textAlign: 'right', fontWeight: 'bold' }}>
{upcoming ? 'Expected end:' : 'To:'}
</div>
<div>
{maintenance.end ? new Date(maintenance.end).toLocaleString() : 'Until further notice'} {maintenance.end ? new Date(maintenance.end).toLocaleString() : 'Until further notice'}
</div> </div>
</div>
</div>
<Text style={{ paddingTop: '3px', whiteSpace: 'pre-line' }}>{maintenance.body}</Text> <Text style={{ paddingTop: '3px', whiteSpace: 'pre-line' }}>{maintenance.body}</Text>
{maintenance.monitors && maintenance.monitors.length > 0 && ( {maintenance.monitors && maintenance.monitors.length > 0 && (