32 lines
826 B
TypeScript
32 lines
826 B
TypeScript
import clsx from 'clsx';
|
|
import { tokens } from "@/app/styles/design-tokens";
|
|
|
|
interface SectionHeadingProps {
|
|
children: React.ReactNode;
|
|
subheading?: React.ReactNode;
|
|
}
|
|
|
|
export function SectionHeading({ children, subheading }: SectionHeadingProps) {
|
|
return (
|
|
<div className="space-y-1">
|
|
<div className={clsx(
|
|
tokens.typography.weights.medium,
|
|
tokens.typography.sizes.lg,
|
|
tokens.colors.light.text.primary,
|
|
tokens.colors.dark.text.primary
|
|
)}>
|
|
{children}
|
|
</div>
|
|
{subheading && (
|
|
<p className={clsx(
|
|
tokens.typography.sizes.sm,
|
|
tokens.typography.weights.normal,
|
|
tokens.colors.light.text.secondary,
|
|
tokens.colors.dark.text.secondary
|
|
)}>
|
|
{subheading}
|
|
</p>
|
|
)}
|
|
</div>
|
|
);
|
|
}
|