cherry picking

latosa-frontend/app/history/[slug]/page.tsx

@@ -0,0 +1,63 @@
+"use server"
+
+export default async function HistoryDetails({
+	params,
+}: {
+	params: Promise<{ slug: string }>;
+}) {
+	const { slug } = await params;
+	const default_img: string = "https://shadcnblocks.com/images/block/placeholder-dark-1.svg"
+	const default_style: string = "blog-paragraph mb-5 text-muted-foreground md:text-base lg:max-w-2xl lg:text-lg"
+	const sub_header_style: string = "py-12 mb-3 text-pretty text-xl font-semibold md:mb-4 md:text-4xl lg:mb-6 lg:max-w-3xl lg:text-3xl"
+
+	return (
+		<main className="flex flex-col w-full lg:md:py-24 sm:py-24">
+			<section className="container self-center max-w-2xl">
+				<div className="blog-title w-full h-28 justify-center">
+					<h1 className="mb-3 text-pretty text-3xl font-semibold lg:text-5xl">
+						{slug}
+					</h1>
+				</div>
+				<div className="content">
+					<div>
+						<h2 className={sub_header_style}>Subtitle 1</h2>
+						<p className={default_style}>
+							Lorem ipsum dolor sit amet, consectetur adipisicing elit. Deleniti architecto incidunt, hic in consectetur eligendi nobis numquam tenetur sit repellat et unde, maxime ducimus autem esse temporibus omnis eum molestias!
+						</p>
+					</div>
+					<div>
+						<img
+							src={default_img}
+							alt={slug}
+							className="aspect-[16/9] mb-5 rounded-sm h-full w-full object-cover object-center"
+						/>
+
+					</div>
+					<div>
+						<h2 className={sub_header_style}>Subtitle 2</h2>
+						<p className={default_style}>
+							Lorem ipsm dolor sit amet, consectetur adipisicing elit. Deleniti architecto incidunt, hic in consectetur eligendi nobis numquam tenetur sit repellat et unde, maxime ducimus autem esse temporibus omnis eum molestias!
+						</p>
+					</div>
+					<div>
+						<img
+							src={default_img}
+							alt={slug}
+							className="aspect-[16/9] mb-5 rounded-sm h-full w-full object-cover object-center"
+						/>
+
+					</div>
+					<div>
+						<h2 className={sub_header_style}>Subtitle 3</h2>
+						<p className={default_style}>
+							Lorem ipsum dolor sit amet, consectetur adipisicing elit. Deleniti architecto incidunt, hic in consectetur eligendi nobis numquam tenetur sit repellat et unde, maxime ducimus autem esse temporibus omnis eum molestias!
+						</p>
+						<p className={default_style}>
+							Lorem ipsum dolor sit amet, consectetur adipisicing elit. Deleniti architecto incidunt, hic in consectetur eligendi nobis numquam tenetur sit repellat et unde, maxime ducimus autem esse temporibus omnis eum molestias!
+						</p>
+					</div>
+				</div>
+			</section>
+		</main>
+	)
+}

latosa-frontend/app/history/page.tsx

@@ -0,0 +1,9 @@
+import Blog from "@/components/blog";
+
+export default function History() {
+	return(
+		<div className="flex flex-col">
+			<Blog />			
+		</div>
+	)
+}