update and polish
This commit is contained in:
StrangeD0s
+1
-1
@@ -6,8 +6,8 @@
|
||||
}
|
||||
|
||||
@theme {
|
||||
/* Hier registrierst du die Font für Tailwind v4 */
|
||||
--font-starjedi: var(--font-starjedi);
|
||||
--font-aurebesh: var(--font-aurebesh)
|
||||
}
|
||||
|
||||
@theme inline {
|
||||
|
||||
+11
-4
@@ -1,6 +1,6 @@
|
||||
import type { Metadata } from "next";
|
||||
import { Geist, Geist_Mono } from "next/font/google";
|
||||
import localFont from "next/font/local"; // Wichtig: localFont importieren
|
||||
import localFont from "next/font/local";
|
||||
import "./globals.css";
|
||||
|
||||
const geistSans = Geist({
|
||||
@@ -13,14 +13,18 @@ const geistMono = Geist_Mono({
|
||||
subsets: ["latin"],
|
||||
});
|
||||
|
||||
// Konfiguration der lokalen Star Jedi Font
|
||||
const starJedi = localFont({
|
||||
src: "../public/fonts/Starjedi.ttf",
|
||||
variable: "--font-starjedi",
|
||||
});
|
||||
|
||||
const aurebesh = localFont({
|
||||
src: "../public/fonts/Aurebesh-English.ttf",
|
||||
variable: "--font-aurebesh",
|
||||
});
|
||||
|
||||
export const metadata: Metadata = {
|
||||
title: "Outer Rim Smuggler",
|
||||
title: "Smuggler's Run",
|
||||
description: "A Star Wars inspired roguelike adventure",
|
||||
};
|
||||
|
||||
@@ -30,7 +34,10 @@ export default function RootLayout({
|
||||
children: React.ReactNode;
|
||||
}>) {
|
||||
return (
|
||||
<html lang="en" className={`${starJedi.variable}`}>
|
||||
<html
|
||||
lang="en"
|
||||
className={`${starJedi.variable} ${aurebesh.variable} ${geistSans.variable} ${geistMono.variable}`}
|
||||
>
|
||||
<body
|
||||
className={`${geistSans.variable} ${geistMono.variable} antialiased`}
|
||||
>
|
||||
|
||||
+51
-29
@@ -7,7 +7,9 @@ import EventLog from "../components/EventLog";
|
||||
import ActionPanel from "../components/ActionPanel";
|
||||
import StartScreen from "@/components/StartScreen";
|
||||
import GameOverScreen from "@/components/GameOverScreen";
|
||||
import { t } from "@/content/locales"; // Import der Locales
|
||||
import VictoryScreen from "@/components/VictoryScreen";
|
||||
import PowerDistributor from "@/components/PowerDistributor";
|
||||
import { t } from "@/content/locales";
|
||||
|
||||
export default function Home() {
|
||||
const {
|
||||
@@ -18,19 +20,25 @@ export default function Home() {
|
||||
hp,
|
||||
loading,
|
||||
currentLocationId,
|
||||
currentPlanet,
|
||||
selectedPlanet,
|
||||
setSelectedPlanet,
|
||||
handleAttack,
|
||||
executeJump,
|
||||
handleRepair,
|
||||
isJumping,
|
||||
power,
|
||||
updatePower,
|
||||
activeEnemy,
|
||||
executeEscape,
|
||||
logs,
|
||||
isGameOver,
|
||||
restartGame,
|
||||
isVictory,
|
||||
isRerouting,
|
||||
WIN_THRESHOLD,
|
||||
} = useGameEngine();
|
||||
|
||||
// 1. Ladezustand
|
||||
if (loading) {
|
||||
return (
|
||||
<div className="min-h-screen bg-black flex items-center justify-center font-mono text-yellow-500">
|
||||
@@ -39,46 +47,60 @@ export default function Home() {
|
||||
);
|
||||
}
|
||||
|
||||
// Aktuellen Planeten finden für das HUD
|
||||
const currentPlanet = planets.find((p) => p.id === currentLocationId);
|
||||
if (!gameStarted) return <StartScreen onStart={startGame} />;
|
||||
|
||||
// 2. Startbildschirm
|
||||
if (!gameStarted) {
|
||||
return <StartScreen onStart={startGame} />;
|
||||
}
|
||||
const activeDisplayPlanet = selectedPlanet || currentPlanet;
|
||||
const isViewingCurrentLocation =
|
||||
!!currentPlanet && activeDisplayPlanet?.id === currentPlanet.id;
|
||||
|
||||
return (
|
||||
<main className="min-h-screen bg-[#050505] pt-24 px-4 flex flex-col items-center">
|
||||
<main className="min-h-screen bg-[#050505] pt-24 px-4 flex flex-col items-center pb-12">
|
||||
<HUD
|
||||
credits={credits}
|
||||
hp={hp}
|
||||
maxHp={10} // Könnte später aus einem Ship-Objekt kommen
|
||||
maxHp={10}
|
||||
location={currentPlanet?.name || t.SYSTEM.DEEP_SPACE}
|
||||
targetCredits={100000}
|
||||
targetCredits={WIN_THRESHOLD}
|
||||
/>
|
||||
|
||||
<div className="w-full max-w-4xl flex flex-col items-center gap-6">
|
||||
<GalaxyMap
|
||||
planets={planets}
|
||||
onSelectLocation={(p) => setSelectedPlanet(p)}
|
||||
currentLocationId={currentLocationId}
|
||||
/>
|
||||
|
||||
{/* ActionPanel erscheint bei Zielwahl oder Feindkontakt */}
|
||||
{(selectedPlanet || activeEnemy) && (
|
||||
<ActionPanel
|
||||
planet={selectedPlanet}
|
||||
enemy={activeEnemy}
|
||||
isLoading={isJumping}
|
||||
onAction={activeEnemy ? handleAttack : executeJump}
|
||||
onEscape={executeEscape}
|
||||
<div className="w-full max-w-6xl grid grid-cols-1 lg:grid-cols-4 gap-6">
|
||||
<div className="lg:col-span-3">
|
||||
<GalaxyMap
|
||||
planets={planets}
|
||||
currentLocationId={currentLocationId}
|
||||
selectedPlanetId={selectedPlanet?.id}
|
||||
onSelectLocation={setSelectedPlanet}
|
||||
/>
|
||||
)}
|
||||
</div>
|
||||
<div className="lg:col-span-1">
|
||||
<PowerDistributor
|
||||
power={power}
|
||||
onUpdatePower={updatePower}
|
||||
disabled={isJumping || isRerouting}
|
||||
isRerouting={isRerouting}
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<EventLog logs={logs} />
|
||||
<div className="w-full max-w-4xl animate-in fade-in slide-in-from-bottom-4 duration-700">
|
||||
<ActionPanel
|
||||
planet={activeDisplayPlanet}
|
||||
enemy={activeEnemy}
|
||||
isCurrentLocation={isViewingCurrentLocation}
|
||||
isLoading={isJumping}
|
||||
onAction={activeEnemy ? handleAttack : executeJump}
|
||||
onEscape={executeEscape}
|
||||
onRepair={handleRepair}
|
||||
currentHp={hp}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div className="w-full max-w-4xl mt-6">
|
||||
<EventLog logs={logs} />
|
||||
</div>
|
||||
|
||||
{isVictory && <VictoryScreen credits={credits} onRestart={restartGame} />}
|
||||
|
||||
{/* Game Over Overlay */}
|
||||
{isGameOver && (
|
||||
<GameOverScreen credits={credits} onRestart={restartGame} />
|
||||
)}
|
||||
|
||||
Reference in New Issue
Block a user