Feat: Change the style of all cards according to the design #10703 (#10704)

### What problem does this PR solve?

Feat: Change the style of all cards according to the design #10703

### Type of change


- [x] New Feature (non-breaking change which adds functionality)

web/src/components/card-container.tsx

@@ -0,0 +1,17 @@
+import { cn } from '@/lib/utils';
+import { PropsWithChildren } from 'react';
+
+type CardContainerProps = { className?: string } & PropsWithChildren;
+
+export function CardContainer({ children, className }: CardContainerProps) {
+  return (
+    <section
+      className={cn(
+        'grid gap-6 sm:grid-cols-1 md:grid-cols-2 lg:grid-cols-3 xl:grid-cols-4 2xl:grid-cols-5',
+        className,
+      )}
+    >
+      {children}
+    </section>
+  );
+}