From 1648454f948118107c480b49e6e613d767a00f84 Mon Sep 17 00:00:00 2001 From: warringtond Date: Thu, 11 Jun 2026 06:42:50 -0400 Subject: [PATCH] front page enhancements --- app/lessons/page.tsx | 4 +- app/lessons/unit-1-fractions/page.tsx | 3 +- app/lessons/unit-2-decimals/page.tsx | 3 +- .../unit-3-decimal-operations/page.tsx | 3 +- app/lessons/unit-4-ratio-proportion/page.tsx | 3 +- app/lessons/unit-5-integers/page.tsx | 3 +- app/lessons/unit-6-number-system/page.tsx | 3 +- app/page.tsx | 10 +- components/home/topic-art.tsx | 222 ++++++++++++++++++ components/layout/header.tsx | 2 +- lib/curriculum.ts | 29 --- 11 files changed, 234 insertions(+), 51 deletions(-) create mode 100644 components/home/topic-art.tsx diff --git a/app/lessons/page.tsx b/app/lessons/page.tsx index afb0fdc..8cc0750 100644 --- a/app/lessons/page.tsx +++ b/app/lessons/page.tsx @@ -14,7 +14,6 @@ export default function LessonsOverview() {
Unit {unit.number}

{unit.title}

- {unit.weeks}
{unit.topics.map((topic) => ( @@ -22,8 +21,7 @@ export default function LessonsOverview() {

{topic.title}

{topic.description}

-
- Week {topic.week} +
Explore diff --git a/app/lessons/unit-1-fractions/page.tsx b/app/lessons/unit-1-fractions/page.tsx index 70d32cc..df35441 100644 --- a/app/lessons/unit-1-fractions/page.tsx +++ b/app/lessons/unit-1-fractions/page.tsx @@ -16,7 +16,7 @@ export default function Unit1Overview() { ]} />
- Unit 1 — {unit.weeks} + Unit 1

{unit.title}

{unit.description}

@@ -28,7 +28,6 @@ export default function Unit1Overview() { {i + 1} - Week {topic.week}

{topic.title}

{topic.description}

diff --git a/app/lessons/unit-2-decimals/page.tsx b/app/lessons/unit-2-decimals/page.tsx index 174b144..f179240 100644 --- a/app/lessons/unit-2-decimals/page.tsx +++ b/app/lessons/unit-2-decimals/page.tsx @@ -16,7 +16,7 @@ export default function Unit2Overview() { ]} />
- Unit 2 — {unit.weeks} + Unit 2

{unit.title}

{unit.description}

@@ -28,7 +28,6 @@ export default function Unit2Overview() { {i + 7} - Week {topic.week}

{topic.title}

{topic.description}

diff --git a/app/lessons/unit-3-decimal-operations/page.tsx b/app/lessons/unit-3-decimal-operations/page.tsx index c0d5c36..267e4ac 100644 --- a/app/lessons/unit-3-decimal-operations/page.tsx +++ b/app/lessons/unit-3-decimal-operations/page.tsx @@ -16,7 +16,7 @@ export default function Unit3Overview() { ]} />
- Unit 3 — {unit.weeks} + Unit 3

{unit.title}

{unit.description}

@@ -28,7 +28,6 @@ export default function Unit3Overview() { {i + 10} - Week {topic.week}

{topic.title}

{topic.description}

diff --git a/app/lessons/unit-4-ratio-proportion/page.tsx b/app/lessons/unit-4-ratio-proportion/page.tsx index c4d543f..b66d491 100644 --- a/app/lessons/unit-4-ratio-proportion/page.tsx +++ b/app/lessons/unit-4-ratio-proportion/page.tsx @@ -16,7 +16,7 @@ export default function Unit4Overview() { ]} />
- Unit 4 — {unit.weeks} + Unit 4

{unit.title}

{unit.description}

@@ -28,7 +28,6 @@ export default function Unit4Overview() { {String.fromCharCode(97 + i)} - Week {topic.week}

{topic.title}

{topic.description}

diff --git a/app/lessons/unit-5-integers/page.tsx b/app/lessons/unit-5-integers/page.tsx index e4bc4e5..dd26127 100644 --- a/app/lessons/unit-5-integers/page.tsx +++ b/app/lessons/unit-5-integers/page.tsx @@ -16,7 +16,7 @@ export default function Unit5Overview() { ]} />
- Unit 5 — {unit.weeks} + Unit 5

{unit.title}

{unit.description}

@@ -28,7 +28,6 @@ export default function Unit5Overview() { {i + 1} - Week {topic.week}

{topic.title}

{topic.description}

diff --git a/app/lessons/unit-6-number-system/page.tsx b/app/lessons/unit-6-number-system/page.tsx index 6e47e0a..58f44b4 100644 --- a/app/lessons/unit-6-number-system/page.tsx +++ b/app/lessons/unit-6-number-system/page.tsx @@ -16,7 +16,7 @@ export default function Unit6Overview() { ]} />
- Unit 6 — {unit.weeks} + Unit 6

{unit.title}

{unit.description}

@@ -28,7 +28,6 @@ export default function Unit6Overview() { {i + 1} - Week {topic.week}

{topic.title}

{topic.description}

diff --git a/app/page.tsx b/app/page.tsx index faff035..a6b2165 100644 --- a/app/page.tsx +++ b/app/page.tsx @@ -2,6 +2,7 @@ import Link from "next/link"; import { Header } from "@/components/layout/header"; import { Footer } from "@/components/layout/footer"; import { curriculum } from "@/lib/curriculum"; +import { TopicArt } from "@/components/home/topic-art"; const unitStyles = { "unit-1": { @@ -104,7 +105,6 @@ export default function Home() {

{unit.description}

-

{unit.weeks}

))} @@ -121,11 +121,9 @@ export default function Home() { href={`/lessons/${unit.slug}/${topic.slug}`} className="rounded-sm border border-[#8ea9df] bg-white p-2 transition-transform hover:-translate-y-0.5 hover:shadow-md" > -
- - Week {topic.week} - - +
+ + {topic.shortTitle}
diff --git a/components/home/topic-art.tsx b/components/home/topic-art.tsx new file mode 100644 index 0000000..fdf9db6 --- /dev/null +++ b/components/home/topic-art.tsx @@ -0,0 +1,222 @@ +import type { ReactNode } from "react"; + +/** + * Decorative SVG artwork for the Topic Explorer tiles on the landing page. + * Each topic gets a simple math-themed illustration drawn in white over the + * tile's gradient background. + */ + +function Frame({ children }: { children: ReactNode }) { + return ( + + ); +} + +const glyphText = { + fill: "white", + fontWeight: 800, + fontFamily: "inherit", +} as const; + +const art: Record = { + // Unit 1 — Fractions + "unit-1-fractions/add-subtract": ( + <> + + + + + − + + ), + "unit-1-fractions/multiply": ( + <> + 1 + + 2 + × + 3 + + 4 + + ), + "unit-1-fractions/divide": ( + <> + + + + + ), + "unit-1-fractions/mixed-operations": ( + <> + ( + + + × + ) + + ), + "unit-1-fractions/fraction-of-quantity": ( + <> + {[0, 1, 2, 3].map((col) => + [0, 1].map((row) => ( + + )), + )} + + ), + "unit-1-fractions/whole-from-fractions": ( + <> + + + ? + + ), + + // Unit 2 — Decimals + "unit-2-decimals/compare-order": ( + <> + 0.3 + < + 0.7 + + ), + "unit-2-decimals/approximate": ( + <> + ≈ + + ), + "unit-2-decimals/standard-form": ( + <> + ×10 + n + + ), + + // Unit 3 — Decimal Operations + "unit-3-decimal-operations/convert": ( + <> + 1 + + 2 + + + 0.5 + + ), + "unit-3-decimal-operations/add-subtract": ( + <> + 2.50 + 1.25 + + + + + ), + "unit-3-decimal-operations/multiply-divide": ( + <> + × + ÷ + + ), + + // Unit 4 — Ratio & Proportion + "unit-4-ratio-proportion/define-ratio": ( + <> + + + : + + + + + ), + "unit-4-ratio-proportion/fractions-and-ratios": ( + <> + 1 + + 3 + = + 1:2 + + ), + "unit-4-ratio-proportion/simplify-ratios": ( + <> + 6:9 + + 2:3 + + ), + "unit-4-ratio-proportion/divide-in-ratio": ( + <> + + + + 2 : 1 : 1 + + ), + "unit-4-ratio-proportion/word-problems": ( + <> + + ? + + ), + + // Unit 5 — Integers + "unit-5-integers/add-subtract": ( + <> + + −2 + 0 + +2 + + ), + "unit-5-integers/multiply-divide": ( + <> + −×− + + + + + ), + + // Unit 6 — Number System + "unit-6-number-system/binary": ( + <> + 1011 + base 2 + + ), + "unit-6-number-system/quaternary": ( + <> + 1230 + base 4 + + ), +}; + +const fallback: ReactNode = ( + <> + + + +); + +export function TopicArt({ unitSlug, topicSlug }: { unitSlug: string; topicSlug: string }) { + return {art[`${unitSlug}/${topicSlug}`] ?? fallback}; +} diff --git a/components/layout/header.tsx b/components/layout/header.tsx index 5feb1d3..62efc84 100644 --- a/components/layout/header.tsx +++ b/components/layout/header.tsx @@ -22,7 +22,7 @@ export function Header() {
Ages 12-16 - Form 1 Term 2 + Form 1