- Move Puzzles and Miscellany under Themes - Add Contest Problems as new theme - Create About page with comprehensive site information - Create InteractiveIndex component with advanced filtering and sorting - Update navigation to include Index, Themes, and About - Add pagination (10 items per page) with search and tag filtering - Update routing structure for new theme organization - Remove standalone Puzzles and Miscellany pages - Add new theme pages: /themes/puzzles, /themes/miscellany, /themes/contest-problems - Update homepage to point to new interactive index - Maintain consistent layout and styling across all new pages
99 lines
No EOL
3.2 KiB
TypeScript
99 lines
No EOL
3.2 KiB
TypeScript
import {
|
|
GraduationCap,
|
|
Binary,
|
|
Users,
|
|
Cpu,
|
|
Database,
|
|
Gamepad2,
|
|
CreditCard,
|
|
Calculator,
|
|
Puzzle,
|
|
Sparkles,
|
|
Trophy
|
|
} from "lucide-react";
|
|
import Layout from "@/components/Layout";
|
|
import ThemeCard from "@/components/ThemeCard";
|
|
|
|
const Themes = () => {
|
|
const themes = [
|
|
{
|
|
title: "Discrete Math",
|
|
description: "Explore fundamental concepts in discrete mathematics through visual and interactive demonstrations.",
|
|
path: "/themes/discrete-math",
|
|
icon: <Binary className="w-6 h-6" />
|
|
},
|
|
{
|
|
title: "Social Choice",
|
|
description: "Understand voting systems, fairness criteria, and collective decision-making through interactive simulations.",
|
|
path: "/themes/social-choice",
|
|
icon: <Users className="w-6 h-6" />
|
|
},
|
|
{
|
|
title: "Advanced Algorithms",
|
|
description: "Deep dive into complex algorithmic concepts with step-by-step visualizations and performance analysis.",
|
|
path: "/themes/advanced-algorithms",
|
|
icon: <Cpu className="w-6 h-6" />
|
|
},
|
|
{
|
|
title: "Data Structures",
|
|
description: "Master fundamental and advanced data structures through interactive manipulation and visualization.",
|
|
path: "/themes/data-structures",
|
|
icon: <Database className="w-6 h-6" />
|
|
},
|
|
{
|
|
title: "Games",
|
|
description: "Learn through play with educational games that reinforce computer science and mathematical concepts.",
|
|
path: "/themes/games",
|
|
icon: <Gamepad2 className="w-6 h-6" />
|
|
},
|
|
{
|
|
title: "Cards and Math",
|
|
description: "Discover mathematical principles and probability theory through card games and interactive demonstrations.",
|
|
path: "/themes/cards-math",
|
|
icon: <CreditCard className="w-6 h-6" />
|
|
},
|
|
{
|
|
title: "Puzzles",
|
|
description: "Get ready for an engaging collection of educational puzzles designed to challenge your problem-solving skills and reinforce key concepts across multiple disciplines.",
|
|
path: "/themes/puzzles",
|
|
icon: <Puzzle className="w-6 h-6" />
|
|
},
|
|
{
|
|
title: "Miscellany",
|
|
description: "Discover unique educational experiments, creative tools, and innovative interactive content that doesn't fit into traditional categories but sparks curiosity and enhances learning.",
|
|
path: "/themes/miscellany",
|
|
icon: <Sparkles className="w-6 h-6" />
|
|
},
|
|
{
|
|
title: "Contest Problems",
|
|
description: "Practice with problems from programming competitions, mathematical olympiads, and algorithmic challenges with interactive solutions and explanations.",
|
|
path: "/themes/contest-problems",
|
|
icon: <Trophy className="w-6 h-6" />
|
|
}
|
|
];
|
|
|
|
return (
|
|
<Layout>
|
|
|
|
<div className="py-12 px-4">
|
|
<div className="max-w-6xl mx-auto">
|
|
|
|
<div className="grid lg:grid-cols-3 md:grid-cols-2 gap-6">
|
|
{themes.map((theme) => (
|
|
<ThemeCard
|
|
key={theme.title}
|
|
title={theme.title}
|
|
description={theme.description}
|
|
path={theme.path}
|
|
icon={theme.icon}
|
|
/>
|
|
))}
|
|
</div>
|
|
|
|
</div>
|
|
</div>
|
|
</Layout>
|
|
);
|
|
};
|
|
|
|
export default Themes; |