turash/bugulma/frontend/components/ui/CenteredContent.tsx
2025-12-15 10:06:41 +01:00

27 lines
567 B
TypeScript

import { clsx } from 'clsx';
import React from 'react';
export interface CenteredContentProps {
children: React.ReactNode;
className?: string;
padding?: 'sm' | 'md' | 'lg' | 'xl';
}
const paddingClasses = {
sm: 'py-4',
md: 'py-6',
lg: 'py-8',
xl: 'py-12',
};
/**
* CenteredContent component for consistently centered content
*/
export const CenteredContent: React.FC<CenteredContentProps> = ({
children,
className,
padding = 'xl',
}) => {
return <div className={clsx('text-center', paddingClasses[padding], className)}>{children}</div>;
};