Fix interactive page layout

Remove global header/footer and add share section to the interactive page.
This commit is contained in:
gpt-engineer-app[bot] 2025-07-20 02:37:37 +00:00
parent 55b50ddfdd
commit 8d84ac0476
2 changed files with 20 additions and 10 deletions

View file

@ -4,6 +4,7 @@ import { Button } from '@/components/ui/button';
import { Badge } from '@/components/ui/badge'; import { Badge } from '@/components/ui/badge';
import { Select, SelectContent, SelectItem, SelectTrigger, SelectValue } from '@/components/ui/select'; import { Select, SelectContent, SelectItem, SelectTrigger, SelectValue } from '@/components/ui/select';
import { RotateCcw, Undo2 } from 'lucide-react'; import { RotateCcw, Undo2 } from 'lucide-react';
import SocialShare from '@/components/SocialShare';
interface Edge { interface Edge {
from: number; from: number;
@ -265,6 +266,15 @@ const GameOfSim = () => {
Avoid creating a triangle of your own color! Avoid creating a triangle of your own color!
</p> </p>
</div> </div>
{/* Social Share */}
<div className="flex justify-center">
<SocialShare
title="Game of Sim"
description="Play the strategic Game of Sim! Take turns coloring edges between vertices while avoiding creating triangles of your own color."
url={`${window.location.origin}/themes/games`}
/>
</div>
</CardContent> </CardContent>
</Card> </Card>
</div> </div>

View file

@ -36,16 +36,16 @@ const GamesGallery = () => {
if (selectedGame) { if (selectedGame) {
const GameComponent = selectedGame.component; const GameComponent = selectedGame.component;
return ( return (
<div className="space-y-6"> <div className="min-h-screen bg-background">
<div className="flex items-center gap-4"> <div className="container mx-auto px-4 py-8 space-y-6">
<button <div className="flex items-center gap-4">
onClick={() => setSelectedGame(null)} <button
className="text-primary hover:text-primary/80 font-medium" onClick={() => setSelectedGame(null)}
> className="text-primary hover:text-primary/80 font-medium"
Back to Educational Games >
</button> Back to Educational Games
</div> </button>
<div className="bg-background border rounded-lg p-6"> </div>
<GameComponent /> <GameComponent />
</div> </div>
</div> </div>