add "icons" to buttons

This commit is contained in:
Vinzenz Schroeter 2024-05-06 01:20:54 +02:00
parent dced0a3a5c
commit f481bb638a
3 changed files with 10 additions and 7 deletions

View file

@ -22,12 +22,12 @@ export default function App() {
<Row>
<h1 className="flex-grow">CCCB-Tanks!</h1>
<MapChooser theme={theme}/>
<Button text="change colors" onClick={() => setTheme(_ => getRandomTheme())}/>
<Button text="change colors" onClick={() => setTheme(_ => getRandomTheme())}/>
<Button
onClick={() => window.open('https://github.com/kaesaecracker/cccb-tanks-cs', '_blank')?.focus()}
text="GitHub"/>
text="⌂ source"/>
{name !== '' &&
<Button onClick={() => setName(_ => '')} text="logout"/>}
<Button onClick={() => setName(_ => '')} text="logout"/>}
</Row>
{name || <JoinForm onDone={name => setName(_ => name)}/>}

View file

@ -41,7 +41,7 @@ export default function JoinForm({onDone}: {
<Button
onClick={confirm}
disabled={disableButtons}
text="INSERT COIN"/>
text="¢ INSERT COIN"/>
{postPlayer.isError && <p>{postPlayer.error.message}</p>}
</Dialog>;
}

View file

@ -71,8 +71,11 @@ function MapChooserDialog({mapNames, theme, onClose, onConfirm}: {
onClick={() => setChosenMap(name)}
/>)}
</Row>
<Button text="confirm" disabled={!chosenMap} onClick={() => chosenMap && onConfirm(chosenMap)}/>
<Button text="cancel" onClick={onClose}/>
<Row>
<div className='flex-grow'/>
<Button text="« cancel" onClick={onClose}/>
<Button text="√ confirm" disabled={!chosenMap} onClick={() => chosenMap && onConfirm(chosenMap)}/>
</Row>
</Dialog>;
}
@ -105,7 +108,7 @@ export default function MapChooser({theme}: {
const [open, setOpen] = useState(false);
return <>
<Button text="Change map"
<Button text="Change map"
disabled={!query.isSuccess || postMap.isPending}
onClick={() => setOpen(true)}/>
{query.isSuccess && open &&