start of credits

packages/i18n/strings/en.json

@@ -1,8 +1,6 @@
 {
-  "test": {
-    "default": "test",
-    "long": "This is a long test string. You MUST NEVER see this in the UI. My favorite fruit is {fruit} because it has the color of {color}. I like it so much that I will say its name 3 times! {fruit}! {fruit}! {fruit}! Once again, it's {color}, not {not_color}.",
-    "fox": "The quick brown fox jumps over the lazy dog."
+  "credits": {
+    "title": "BlitzKit is the work of many"
   },
 
   "common": {

packages/website/src/components/CreditsPromo.astro

@@ -0,0 +1,73 @@
+---
+import { Heading, Text } from "@radix-ui/themes";
+import { credits } from "../config/credits";
+import { getStrings } from "../core/i18n/getStrings";
+
+interface Props {
+  locale: string;
+}
+
+const { locale } = Astro.props;
+
+const strings = getStrings(locale);
+---
+
+<style>
+  .credits {
+    display: flex;
+    justify-content: center;
+
+    padding: var(--space-6) 0;
+    margin-bottom: var(--space-4);
+
+    .inner {
+      display: flex;
+      flex-direction: column;
+      gap: var(--space-5);
+
+      width: 100%;
+      max-width: 80rem;
+
+      .group {
+        display: flex;
+        flex-direction: column;
+
+        gap: var(--space-4);
+
+        .person {
+          display: flex;
+          flex-direction: column;
+          align-items: center;
+
+          gap: var(--space-2);
+
+          .group[data-type="primary"] & {
+            img {
+              width: 7rem;
+              height: 7rem;
+            }
+          }
+        }
+      }
+    }
+  }
+</style>
+
+<div class="credits">
+  <div class="inner">
+    <Heading>{strings.credits.title}</Heading>
+
+    {
+      credits.map((group) => (
+        <div data-type={group.type} class="group">
+          {group.people.map((person) => (
+            <div class="person">
+              <img src={person.image} />
+              <Text>{person.name}</Text>
+            </div>
+          ))}
+        </div>
+      ))
+    }
+  </div>
+</div>

packages/website/src/config/credits.ts

@@ -0,0 +1,27 @@
+enum CreditType {
+  Primary = "primary",
+}
+
+interface CreditGroup {
+  type: CreditType;
+  people: CreditPeople[];
+}
+
+interface CreditPeople {
+  name: string;
+  url: string;
+  image: string;
+}
+
+export const credits: CreditGroup[] = [
+  {
+    type: CreditType.Primary,
+    people: [
+      {
+        name: "TrèsAbhi",
+        url: "https://abhi-deep.com/",
+        image: "https://github.com/tresabhi.png",
+      },
+    ],
+  },
+];

packages/website/src/pages/[...chunk_default]/[...locale]/index.astro

@@ -5,6 +5,7 @@ import locales from "@blitzkit/i18n/locales.json";
 import { literals } from "@blitzkit/i18n/src/literals";
 import { Box, Flex, Link } from "@radix-ui/themes";
 import { AesonPlug } from "../../../components/AesonPlug";
+import CreditsPromo from "../../../components/CreditsPromo.astro";
 import HomeHero from "../../../components/HomeHero.astro";
 import { Plugs } from "../../../components/Plugs";
 import ToolCard from "../../../components/ToolCard.astro";
@@ -113,5 +114,7 @@ export const getStaticPaths = mixStaticPaths(_getStaticPaths, () => {
     </Flex>
   </Flex>
 
+  <CreditsPromo />
+
   <div style={{ flex: 1 }}></div>
 </BaseLayout>