first commit

src/components/ShowcasePage.astro

@@ -0,0 +1,23 @@
+---
+import Layout from "@layouts/Layout.astro";
+import { SITE } from "@consts";
+import Showcase from "@components/Showcase.astro";
+
+interface Props {
+  content: any;
+  CONSTS: any;
+}
+
+const { content, CONSTS } = Astro.props;
+---
+
+<Layout title={SITE.TITLE} description={CONSTS.DESCRIPTION}>
+  <h1 class="animate-reveal break-words text-4xl font-medium opacity-0">
+    {CONSTS.TITLE}
+  </h1>
+  <div
+    class="mt-16 grid animate-reveal grid-cols-1 gap-6 opacity-0 [animation-delay:0.4s] md:grid-cols-3 md:[&>*:nth-child(4n+2)]:col-span-2 md:[&>*:nth-child(4n+3)]:col-span-2 md:[&>*:only-child]:col-span-3"
+  >
+    {content.map((article: any) => <Showcase collection={article} />)}
+  </div>
+</Layout>