40 lines
1.1 KiB
TypeScript
40 lines
1.1 KiB
TypeScript
/**
|
|
* EN: Section wrapper component for Mood Board sections
|
|
* VI: Component wrapper cho các sections của Mood Board
|
|
*
|
|
* Provides consistent layout and styling for each section
|
|
* Cung cấp layout và styling nhất quán cho mỗi section
|
|
*/
|
|
import React from 'react';
|
|
|
|
interface SectionWrapperProps {
|
|
id: string;
|
|
title: string;
|
|
description?: string;
|
|
children: React.ReactNode;
|
|
}
|
|
|
|
export default function SectionWrapper({
|
|
id,
|
|
title,
|
|
description,
|
|
children,
|
|
}: SectionWrapperProps) {
|
|
return (
|
|
<section id={id} className="scroll-mt-24">
|
|
{/* EN: Section Header / VI: Header của section */}
|
|
<div className="mb-8">
|
|
<h2 className="text-3xl font-bold tracking-tight text-text-primary">
|
|
{title}
|
|
</h2>
|
|
{description && (
|
|
<p className="text-text-secondary mt-2">{description}</p>
|
|
)}
|
|
</div>
|
|
|
|
{/* EN: Section Content / VI: Nội dung section */}
|
|
<div className="space-y-6">{children}</div>
|
|
</section>
|
|
);
|
|
}
|