warringtond/cabrits-math
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

front page enhancements

Browse Source
This commit is contained in:
warringtond
2026-06-11 06:42:50 -04:00
parent e44f19fd07
commit 1648454f94
11 changed files with 234 additions and 51 deletions
Download Patch File Download Diff File Expand all files Collapse all files

4
app/lessons/page.tsx
View File

@@ -14,7 +14,6 @@ export default function LessonsOverview() {
<div className="mb-4 flex items-center gap-3">
<Badge variant={unit.color}>Unit {unit.number}</Badge>
<h2 className="text-xl font-semibold">{unit.title}</h2>
<span className="hidden text-sm text-muted sm:inline">{unit.weeks}</span>
</div>
<div className="grid gap-4 sm:grid-cols-2">
{unit.topics.map((topic) => (
@@ -22,8 +21,7 @@ export default function LessonsOverview() {
<Card accent={unit.color} hover className="group h-full">
<h3 className="mb-1 font-semibold">{topic.title}</h3>
<p className="mb-3 text-sm leading-relaxed text-muted">{topic.description}</p>
<div className="flex items-center justify-between text-xs text-muted">
<span>Week {topic.week}</span>
<div className="flex items-center justify-end text-xs text-muted">
<span className="flex items-center gap-1 opacity-0 transition-opacity group-hover:opacity-100">
Explore
<svg className="h-3 w-3" fill="none" viewBox="0 0 24 24" stroke="currentColor" strokeWidth={2}>

3
app/lessons/unit-1-fractions/page.tsx
View File

@@ -16,7 +16,7 @@ export default function Unit1Overview() {
]}
/>
<div className="mb-10">
<Badge variant="unit-1" className="mb-3">Unit 1 &mdash; {unit.weeks}</Badge>
<Badge variant="unit-1" className="mb-3">Unit 1</Badge>
<h1 className="mb-2 text-3xl font-bold tracking-tight">{unit.title}</h1>
<p className="text-muted leading-relaxed">{unit.description}</p>
</div>
@@ -28,7 +28,6 @@ export default function Unit1Overview() {
<span className="flex h-7 w-7 items-center justify-center rounded-lg bg-unit-1-light text-xs font-bold text-unit-1-dark shadow-[var(--shadow-sm)]">
{i + 1}
</span>
<span className="text-xs text-muted">Week {topic.week}</span>
</div>
<h3 className="mb-1 font-semibold">{topic.title}</h3>
<p className="text-sm leading-relaxed text-muted">{topic.description}</p>

3
app/lessons/unit-2-decimals/page.tsx
View File

@@ -16,7 +16,7 @@ export default function Unit2Overview() {
]}
/>
<div className="mb-10">
<Badge variant="unit-2" className="mb-3">Unit 2 &mdash; {unit.weeks}</Badge>
<Badge variant="unit-2" className="mb-3">Unit 2</Badge>
<h1 className="mb-2 text-3xl font-bold tracking-tight">{unit.title}</h1>
<p className="text-muted leading-relaxed">{unit.description}</p>
</div>
@@ -28,7 +28,6 @@ export default function Unit2Overview() {
<span className="flex h-7 w-7 items-center justify-center rounded-lg bg-unit-2-light text-xs font-bold text-unit-2-dark shadow-[var(--shadow-sm)]">
{i + 7}
</span>
<span className="text-xs text-muted">Week {topic.week}</span>
</div>
<h3 className="mb-1 font-semibold">{topic.title}</h3>
<p className="text-sm leading-relaxed text-muted">{topic.description}</p>

3
app/lessons/unit-3-decimal-operations/page.tsx
View File

@@ -16,7 +16,7 @@ export default function Unit3Overview() {
]}
/>
<div className="mb-10">
<Badge variant="unit-3" className="mb-3">Unit 3 &mdash; {unit.weeks}</Badge>
<Badge variant="unit-3" className="mb-3">Unit 3</Badge>
<h1 className="mb-2 text-3xl font-bold tracking-tight">{unit.title}</h1>
<p className="text-muted leading-relaxed">{unit.description}</p>
</div>
@@ -28,7 +28,6 @@ export default function Unit3Overview() {
<span className="flex h-7 w-7 items-center justify-center rounded-lg bg-unit-3-light text-xs font-bold text-unit-3-dark shadow-[var(--shadow-sm)]">
{i + 10}
</span>
<span className="text-xs text-muted">Week {topic.week}</span>
</div>
<h3 className="mb-1 font-semibold">{topic.title}</h3>
<p className="text-sm leading-relaxed text-muted">{topic.description}</p>

3
app/lessons/unit-4-ratio-proportion/page.tsx
View File

@@ -16,7 +16,7 @@ export default function Unit4Overview() {
]}
/>
<div className="mb-10">
<Badge variant="unit-4" className="mb-3">Unit 4 &mdash; {unit.weeks}</Badge>
<Badge variant="unit-4" className="mb-3">Unit 4</Badge>
<h1 className="mb-2 text-3xl font-bold tracking-tight">{unit.title}</h1>
<p className="text-muted leading-relaxed">{unit.description}</p>
</div>
@@ -28,7 +28,6 @@ export default function Unit4Overview() {
<span className="flex h-7 w-7 items-center justify-center rounded-lg bg-unit-4-light text-xs font-bold text-unit-4-dark shadow-[var(--shadow-sm)]">
{String.fromCharCode(97 + i)}
</span>
<span className="text-xs text-muted">Week {topic.week}</span>
</div>
<h3 className="mb-1 font-semibold">{topic.title}</h3>
<p className="text-sm leading-relaxed text-muted">{topic.description}</p>

3
app/lessons/unit-5-integers/page.tsx
View File

@@ -16,7 +16,7 @@ export default function Unit5Overview() {
]}
/>
<div className="mb-10">
<Badge variant="unit-5" className="mb-3">Unit 5 &mdash; {unit.weeks}</Badge>
<Badge variant="unit-5" className="mb-3">Unit 5</Badge>
<h1 className="mb-2 text-3xl font-bold tracking-tight">{unit.title}</h1>
<p className="text-muted leading-relaxed">{unit.description}</p>
</div>
@@ -28,7 +28,6 @@ export default function Unit5Overview() {
<span className="flex h-7 w-7 items-center justify-center rounded-lg bg-unit-5-light text-xs font-bold text-unit-5-dark shadow-[var(--shadow-sm)]">
{i + 1}
</span>
<span className="text-xs text-muted">Week {topic.week}</span>
</div>
<h3 className="mb-1 font-semibold">{topic.title}</h3>
<p className="text-sm leading-relaxed text-muted">{topic.description}</p>

3
app/lessons/unit-6-number-system/page.tsx
View File

@@ -16,7 +16,7 @@ export default function Unit6Overview() {
]}
/>
<div className="mb-10">
<Badge variant="unit-6" className="mb-3">Unit 6 &mdash; {unit.weeks}</Badge>
<Badge variant="unit-6" className="mb-3">Unit 6</Badge>
<h1 className="mb-2 text-3xl font-bold tracking-tight">{unit.title}</h1>
<p className="text-muted leading-relaxed">{unit.description}</p>
</div>
@@ -28,7 +28,6 @@ export default function Unit6Overview() {
<span className="flex h-7 w-7 items-center justify-center rounded-lg bg-unit-6-light text-xs font-bold text-unit-6-dark shadow-[var(--shadow-sm)]">
{i + 1}
</span>
<span className="text-xs text-muted">Week {topic.week}</span>
</div>
<h3 className="mb-1 font-semibold">{topic.title}</h3>
<p className="text-sm leading-relaxed text-muted">{topic.description}</p>

10
app/page.tsx
View File

@@ -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() {
</span>
</div>
<p className="mt-2 text-sm font-semibold text-[#35508b]">{unit.description}</p>
<p className="mt-2 text-xs font-bold uppercase tracking-wide text-[#4262aa]">{unit.weeks}</p>
</Link>
))}
</div>
@@ -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"
>
<div className={`game-thumb-grid mb-2 flex aspect-[4/3] flex-col justify-between rounded-sm bg-gradient-to-br p-2 text-white ${topicTiles[index % topicTiles.length]}`}>
<span className="w-fit rounded-sm bg-black/25 px-1.5 py-0.5 text-[10px] font-extrabold uppercase tracking-wide">
Week {topic.week}
</span>
<span className="text-center text-xs font-extrabold leading-tight">
<div className={`game-thumb-grid relative mb-2 flex aspect-[4/3] flex-col justify-end overflow-hidden rounded-sm bg-gradient-to-br p-2 text-white ${topicTiles[index % topicTiles.length]}`}>
<TopicArt unitSlug={unit.slug} topicSlug={topic.slug} />
<span className="relative text-center text-xs font-extrabold leading-tight [text-shadow:0_1px_2px_rgba(0,0,0,0.35)]">
{topic.shortTitle}
</span>
</div>