2e75dfc30e
Create a new playable puzzle based on the Sikinian Parliament problem. The puzzle features 10 individuals in a circular layout with randomly assigned enemy relationships (at most three per person). Users can color individuals blue or pink, and edges between individuals of the same color are highlighted in red if they have more than one same-colored enemy. The puzzle includes start, timer, high score, and share features, and is added to the Puzzles page.
82 lines
No EOL
2.9 KiB
TypeScript
82 lines
No EOL
2.9 KiB
TypeScript
import Layout from "@/components/Layout";
|
||
import InteractiveCard from "@/components/InteractiveCard";
|
||
import { useNavigate } from "react-router-dom";
|
||
|
||
const Puzzles = () => {
|
||
const navigate = useNavigate();
|
||
|
||
const puzzles = [
|
||
{
|
||
id: "sikinia-parliament",
|
||
title: "Parliament of Sikinia Puzzle",
|
||
description: "Separate parliament members into two houses so each has at most one enemy in their house. A graph theory puzzle!",
|
||
path: "/puzzles/sikinia-parliament",
|
||
tags: ["Graph Theory", "Logic", "Coloring"],
|
||
difficulty: "Intermediate" as const,
|
||
duration: "5-20 min",
|
||
participants: "1 player"
|
||
},
|
||
{
|
||
id: "plate-swap",
|
||
title: "The Plate Swap Puzzle",
|
||
description: "Arrange plates around a circular table so each person has their own plate. A challenging permutation puzzle!",
|
||
path: "/puzzles/plate-swap",
|
||
tags: ["Logic", "Permutation", "Strategy"],
|
||
difficulty: "Advanced" as const,
|
||
duration: "10-30 min",
|
||
participants: "1 player"
|
||
},
|
||
{
|
||
id: "chessboard-repaint",
|
||
title: "Chessboard Repaint Puzzle",
|
||
description: "Repaint rows, columns, or 2×2 squares to achieve exactly one black square. A puzzle about parity and operations!",
|
||
path: "/puzzles/chessboard-repaint",
|
||
tags: ["Logic", "Parity", "Operations"],
|
||
difficulty: "Advanced" as const,
|
||
duration: "15-45 min",
|
||
participants: "1 player"
|
||
},
|
||
{
|
||
id: "knights-puzzle",
|
||
title: "Knights Exchange Puzzle",
|
||
description: "Can the black and white knights swap places using legal chess moves? A classic puzzle on a 3×3 board.",
|
||
path: "/knights-puzzle",
|
||
tags: ["Chess", "Logic", "Classic"],
|
||
difficulty: "Intermediate" as const,
|
||
duration: "5-15 min",
|
||
participants: "1 player"
|
||
}
|
||
];
|
||
|
||
return (
|
||
<Layout>
|
||
<div className="py-12 px-4">
|
||
<div className="max-w-6xl mx-auto">
|
||
<div className="mb-8">
|
||
<h1 className="text-4xl font-bold text-foreground mb-4">Interactive Puzzles</h1>
|
||
<p className="text-muted-foreground text-lg">
|
||
Challenge your problem-solving skills with these educational puzzles designed to reinforce key concepts across multiple disciplines.
|
||
</p>
|
||
</div>
|
||
|
||
<div className="grid lg:grid-cols-3 md:grid-cols-2 gap-6">
|
||
{puzzles.map((puzzle) => (
|
||
<InteractiveCard
|
||
key={puzzle.id}
|
||
title={puzzle.title}
|
||
description={puzzle.description}
|
||
tags={puzzle.tags}
|
||
difficulty={puzzle.difficulty}
|
||
duration={puzzle.duration}
|
||
participants={puzzle.participants}
|
||
onClick={() => navigate(`${puzzle.path}?from=puzzles`)}
|
||
/>
|
||
))}
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</Layout>
|
||
);
|
||
};
|
||
|
||
export default Puzzles;
|