fix map dialog last item sizing

This commit is contained in:
Vinzenz Schroeter 2024-05-07 16:19:09 +02:00
parent 21a1df47b8
commit 3927f4955d
2 changed files with 12 additions and 11 deletions

View file

@ -1,15 +1,8 @@
.MapChooser-DropDown {
border: solid var(--border-size-thin);
padding: var(--padding-normal);
background: var(--color-background);
border-color: var(--color-primary);
color: var(--color-primary);
}
.MapChooser-Row {
flex-wrap: wrap;
display: grid;
width: 100%;
grid-template-columns: repeat(auto-fill, minmax(400px, 1fr));
}
.MapChooser-Preview {
@ -21,3 +14,7 @@
.MapChooser-Preview-Highlight {
border-color: var(--color-secondary);
}
.MapChooser-Dialog {
width: 100%;
}

View file

@ -58,7 +58,11 @@ function MapChooserDialog({mapNames, onClose, onConfirm}: {
readonly onClose: () => void;
}) {
const [chosenMap, setChosenMap] = useState<string>();
return <Dialog title="Choose a map" onClose={onClose}>
return <Dialog
className='MapChooser-Dialog'
title="Choose a map"
onClose={onClose}
>
<Row className="MapChooser-Row overflow-scroll">
{mapNames.map(name => <MapPreview
key={name}