Fix: Consistent background across pages

Ensure all pages share the same background and make the map fullscreen.
This commit is contained in:
gpt-engineer-app[bot]
2025-06-15 09:55:11 +00:00
parent 233ffa0c76
commit eb20817237
4 changed files with 66 additions and 65 deletions

View File

@@ -165,7 +165,7 @@ export const RegionMap = ({ regionName, focusSystem, isCompact = false }: Region
if (isLoading) { if (isLoading) {
return ( return (
<div className={`${isCompact ? 'h-full' : 'h-screen'} bg-gradient-to-br from-slate-900 via-slate-800 to-slate-900 flex items-center justify-center`}> <div className="h-full w-full bg-gradient-to-br from-slate-900 via-slate-800 to-slate-900 flex items-center justify-center">
<div className="text-white text-xl">Loading {regionName} data...</div> <div className="text-white text-xl">Loading {regionName} data...</div>
</div> </div>
); );
@@ -173,7 +173,7 @@ export const RegionMap = ({ regionName, focusSystem, isCompact = false }: Region
if (error) { if (error) {
return ( return (
<div className={`${isCompact ? 'h-full' : 'h-screen'} bg-gradient-to-br from-slate-900 via-slate-800 to-slate-900 flex items-center justify-center`}> <div className="h-full w-full bg-gradient-to-br from-slate-900 via-slate-800 to-slate-900 flex items-center justify-center">
<div className="text-center"> <div className="text-center">
<h1 className="text-4xl font-bold text-white mb-4">Error Loading Region</h1> <h1 className="text-4xl font-bold text-white mb-4">Error Loading Region</h1>
<p className="text-red-400 mb-6">Failed to load data for {regionName}</p> <p className="text-red-400 mb-6">Failed to load data for {regionName}</p>
@@ -260,10 +260,9 @@ export const RegionMap = ({ regionName, focusSystem, isCompact = false }: Region
); );
} }
// Full page mode (original region page) - Make fullscreen // Full page mode - Make truly fullscreen
return ( return (
<div className="w-full h-screen bg-gradient-to-br from-slate-900 via-slate-800 to-slate-900 overflow-hidden"> <div className="h-full w-full flex flex-col">
<div className="h-full flex flex-col">
<Header <Header
title={regionName} title={regionName}
breadcrumbs={[ breadcrumbs={[
@@ -321,6 +320,5 @@ export const RegionMap = ({ regionName, focusSystem, isCompact = false }: Region
</svg> </svg>
</div> </div>
</div> </div>
</div>
); );
}; };

View File

@@ -1,9 +1,10 @@
import { GalaxyMap } from '../components/GalaxyMap'; import { GalaxyMap } from '../components/GalaxyMap';
import { Header } from '../components/Header'; import { Header } from '../components/Header';
const Index = () => { export const Index = () => {
return ( return (
<div className="h-screen bg-gradient-to-br from-slate-900 via-slate-800 to-slate-900 overflow-hidden"> <div className="h-screen w-screen bg-gradient-to-br from-slate-900 via-slate-800 to-slate-900 overflow-hidden">
<div className="h-full flex flex-col"> <div className="h-full flex flex-col">
<Header title="Galaxy Map" /> <Header title="Galaxy Map" />
<div className="flex-1 overflow-hidden"> <div className="flex-1 overflow-hidden">
@@ -13,5 +14,3 @@ const Index = () => {
</div> </div>
); );
}; };
export default Index;

View File

@@ -11,7 +11,7 @@ export const RegionPage = () => {
if (!region) { if (!region) {
return ( return (
<div className="min-h-screen bg-gradient-to-br from-slate-900 via-purple-900 to-slate-900 flex items-center justify-center"> <div className="h-screen w-screen bg-gradient-to-br from-slate-900 via-slate-800 to-slate-900 flex items-center justify-center overflow-hidden">
<div className="text-center"> <div className="text-center">
<h1 className="text-4xl font-bold text-white mb-4">Region Not Found</h1> <h1 className="text-4xl font-bold text-white mb-4">Region Not Found</h1>
<p className="text-purple-200 mb-6">The requested region does not exist in our database.</p> <p className="text-purple-200 mb-6">The requested region does not exist in our database.</p>
@@ -27,5 +27,9 @@ export const RegionPage = () => {
); );
} }
return <RegionMap regionName={region} />; return (
<div className="h-screen w-screen bg-gradient-to-br from-slate-900 via-slate-800 to-slate-900 overflow-hidden">
<RegionMap regionName={region} />
</div>
);
}; };

View File

@@ -165,7 +165,7 @@ export const SystemView = () => {
]; ];
return ( return (
<div className="h-screen bg-gradient-to-br from-slate-900 via-slate-800 to-slate-900 overflow-hidden"> <div className="h-screen w-screen bg-gradient-to-br from-slate-900 via-slate-800 to-slate-900 overflow-hidden">
<div className="h-full flex flex-col"> <div className="h-full flex flex-col">
<Header title={`System: ${system}`} breadcrumbs={breadcrumbs} /> <Header title={`System: ${system}`} breadcrumbs={breadcrumbs} />