Files
community-rule/app/learn/page.js
T

38 lines
1.3 KiB
JavaScript

import ContentThumbnailTemplate from "../components/ContentThumbnailTemplate";
import ContentLockup from "../components/ContentLockup";
import { getAllBlogPosts, getRecentBlogPosts } from "../../lib/content";
export default function LearnPage() {
// Get real blog posts from the content system
const allPosts = getAllBlogPosts();
const recentPosts = getRecentBlogPosts(3);
// Create slug order for consistent background cycling
const slugOrder = allPosts.map((post) => post.slug);
return (
<div className="min-h-screen bg-[var(--color-surface-default-primary)]">
{/* Content Lockup Header */}
<div className="pt-[var(--spacing-scale-016)] pb-[var(--spacing-scale-016)] px-[var(--spacing-scale-020)] gap-[var(--spacing-scale-016)]">
<ContentLockup
title="Organizing is hard"
subtitle="Find answers to your questions and see how other groups have solved similar challenges."
variant="learn"
alignment="left"
/>
</div>
<div className="space-y-4">
{allPosts.slice(0, 3).map((post, index) => (
<ContentThumbnailTemplate
key={post.slug}
post={post}
variant="horizontal"
slugOrder={slugOrder}
/>
))}
</div>
</div>
);
}