unified ThemeProvider
This commit is contained in:
parent
e8238c6ea7
commit
40bb1ec28a
4 changed files with 77 additions and 55 deletions
|
|
@ -9,39 +9,37 @@ 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 {ThemeProvider} from './theme.tsx';
|
||||
import './App.css';
|
||||
import ThemeChooser from './ThemeChooser.tsx';
|
||||
|
||||
export default function App() {
|
||||
const [theme, setTheme] = useStoredTheme();
|
||||
const [name, setName] = useState<string | null>(null);
|
||||
|
||||
return <ThemeContext.Provider value={theme}>
|
||||
<RgbaThemeProvider>
|
||||
<Column className="flex-grow">
|
||||
return <ThemeProvider>
|
||||
<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/>
|
||||
<ThemeChooser/>
|
||||
<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>
|
||||
</RgbaThemeProvider>
|
||||
</ThemeContext.Provider>;
|
||||
</Column>
|
||||
</ThemeProvider>;
|
||||
}
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue