Files
gridpilot.gg/apps/website/components/media/MediaGrid.tsx
2026-01-17 15:46:55 +01:00

35 lines
588 B
TypeScript

import React from 'react';
import { Box } from '@/ui/Box';
export interface MediaGridProps {
children: React.ReactNode;
columns?: {
base?: number;
sm?: number;
md?: number;
lg?: number;
xl?: number;
};
gap?: 2 | 3 | 4 | 6 | 8;
}
export function MediaGrid({
children,
columns = { base: 1, sm: 2, md: 3, lg: 4 },
gap = 4,
}: MediaGridProps) {
return (
<Box
display="grid"
responsiveGridCols={{
base: columns.base,
md: columns.md,
lg: columns.lg,
}}
gap={gap}
>
{children}
</Box>
);
}