fix styling issues

This commit is contained in:
Beebles
2025-09-26 15:34:37 -06:00
parent 9b38abd13f
commit 7fff611d55
@@ -82,6 +82,7 @@ export function AnnouncementsDisplay() {
return ( return (
<PanelSection> <PanelSection>
<Focusable style={{display: "flex", flexDirection: "column", gap: "0.5rem"}}>
{currentlyDisplayingAnnouncements.map((announcement) => ( {currentlyDisplayingAnnouncements.map((announcement) => (
<Announcement <Announcement
key={announcement.id} key={announcement.id}
@@ -89,6 +90,7 @@ export function AnnouncementsDisplay() {
onHide={() => hideAnnouncement(announcement.id)} onHide={() => hideAnnouncement(announcement.id)}
/> />
))} ))}
</Focusable>
</PanelSection> </PanelSection>
); );
} }
@@ -107,12 +109,12 @@ function Announcement({ announcement, onHide }: { announcement: Announcement; on
borderStyle: 'solid', borderStyle: 'solid',
padding: '0.7rem', padding: '0.7rem',
display: 'flex', display: 'flex',
flexDirection: 'column', alignItems: "center",
position: 'relative', justifyContent: "space-between"
}} }}
> >
<div style={{ display: 'flex', justifyContent: 'space-between' }}>
<span style={{ fontWeight: 'bold' }}>{announcement.title}</span> <span style={{ fontWeight: 'bold' }}>{announcement.title}</span>
<Focusable style={{display: "flex", alignItems: "center", gap: "0.5rem"}}>
<DialogButton <DialogButton
style={{ style={{
width: '1rem', width: '1rem',
@@ -158,7 +160,7 @@ function Announcement({ announcement, onHide }: { announcement: Announcement; on
}} }}
/> />
</DialogButton> </DialogButton>
</div> </Focusable>
</Focusable> </Focusable>
); );
} }