Build & Deploy / deploy (push) Successful in 19s
- Teaser-Karte mit Logo, FSK-18-Hinweis und 'Jetzt eintauchen'-Button - Klick aktiviert den Red Ralf Mode und oeffnet die Karten-Welt - Fehlende Gradient-Umleitungen (orange/indigo/teal) ergaenzt
30 lines
1.0 KiB
TypeScript
30 lines
1.0 KiB
TypeScript
import { useState } from 'react'
|
|
import BottomNav, { type TabId } from './components/BottomNav'
|
|
import Home from './pages/Home'
|
|
import Rules from './pages/Rules'
|
|
import Cards from './pages/Cards'
|
|
import Game from './pages/Game'
|
|
import Contact from './pages/Contact'
|
|
|
|
const TABS: TabId[] = ['start', 'regeln', 'karten', 'spiel', 'kontakt']
|
|
|
|
export default function App() {
|
|
const [tab, setTab] = useState<TabId>(() => {
|
|
const p = new URLSearchParams(window.location.search).get('tab')
|
|
return TABS.includes(p as TabId) ? (p as TabId) : 'start'
|
|
})
|
|
|
|
return (
|
|
<div className="mx-auto min-h-dvh max-w-md pb-24">
|
|
<main key={tab} className="rein">
|
|
{tab === 'start' && <Home onSpielStart={() => setTab('spiel')} onRegeln={() => setTab('regeln')} onRedRalf={() => setTab('karten')} />}
|
|
{tab === 'regeln' && <Rules />}
|
|
{tab === 'karten' && <Cards />}
|
|
{tab === 'spiel' && <Game />}
|
|
{tab === 'kontakt' && <Contact />}
|
|
</main>
|
|
<BottomNav aktiv={tab} onWechsel={setTab} />
|
|
</div>
|
|
)
|
|
}
|