vinzenz/servicepoint-tanks
0
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

extract rgba resolving to provider

Browse source
This commit is contained in:
Vinzenz Schroeter 2024-05-07 11:26:07 +02:00
parent 102c084328
commit e8238c6ea7
4 changed files with 107 additions and 49 deletions
Download patch file Download diff file Expand all files Collapse all files

45
tank-frontend/src/App.tsx
View file

@ -1,3 +1,5 @@
import {useState} from 'react';
import ClientScreen from './ClientScreen';
import Controls from './Controls.tsx';
import JoinForm from './JoinForm.tsx';
@ -7,38 +9,39 @@ import Row from './components/Row.tsx';
import Scoreboard from './Scoreboard.tsx';
import Button from './components/Button.tsx';
import MapChooser from './MapChooser.tsx';
import {getRandomTheme, RgbaThemeProvider, ThemeContext, useStoredTheme} from './theme.tsx';
import './App.css';
import {ThemeContext, getRandomTheme, useStoredTheme} from './theme.ts';
import {useState} from 'react';
export default function App() {
const [theme, setTheme] = useStoredTheme();
const [name, setName] = useState<string | null>(null);
return <ThemeContext.Provider value={theme}>
<Column className="flex-grow">
<RgbaThemeProvider>
<Column className="flex-grow">
<ClientScreen player={name}/>
<ClientScreen player={name}/>
<Row>
<h1 className="flex-grow">CCCB-Tanks!</h1>
<MapChooser />
<Button text="☼ change colors" onClick={() => setTheme(_ => getRandomTheme())}/>
<Button
onClick={() => window.open('https://github.com/kaesaecracker/cccb-tanks-cs', '_blank')?.focus()}
text="⌂ source"/>
{name !== '' &&
<Button onClick={() => setName(_ => '')} text="∩ logout"/>}
</Row>
<Row>
<h1 className="flex-grow">CCCB-Tanks!</h1>
<MapChooser/>
<Button text="☼ change colors" onClick={() => setTheme(_ => getRandomTheme())}/>
<Button
onClick={() => window.open('https://github.com/kaesaecracker/cccb-tanks-cs', '_blank')?.focus()}
text="⌂ source"/>
{name !== '' &&
<Button onClick={() => setName(_ => '')} text="∩ logout"/>}
</Row>
{name || <JoinForm onDone={name => setName(_ => name)}/>}
{name || <JoinForm onDone={name => setName(_ => name)}/>}
<Row className="GadgetRows">
{name && <Controls player={name}/>}
{name && <PlayerInfo player={name}/>}
<Scoreboard/>
</Row>
<Row className="GadgetRows">
{name && <Controls player={name}/>}
{name && <PlayerInfo player={name}/>}
<Scoreboard/>
</Row>
</Column>
</Column>
</RgbaThemeProvider>
</ThemeContext.Provider>;
}