From ba0a00ef17d3a75f0a9079a378fcd040bf69e0d9 Mon Sep 17 00:00:00 2001
From: Pinapelz <yukais@pinapelz.com>
Date: Mon, 23 Oct 2023 16:14:38 -0700
Subject: update osc

---
 src/components/Card.astro     |  4 ++-
 src/components/MiniCard.astro | 62 ++++++++++++++++++++++++++++++++++++
 src/pages/about.astro         |  1 +
 src/pages/contributions.astro | 74 ++++++++++++++++++++++++++++---------------
 src/pages/projects.astro      | 11 +++----
 5 files changed, 118 insertions(+), 34 deletions(-)
 create mode 100644 src/components/MiniCard.astro

diff --git a/src/components/Card.astro b/src/components/Card.astro
index d2d428e..4de0a1b 100644
--- a/src/components/Card.astro
+++ b/src/components/Card.astro
@@ -7,9 +7,10 @@ interface Props {
   languageColor: string;
   logoSrc?: string; 
   logoWidth?: string;
+  contribution?: string;
 }
 
-const { href, title, body, language, languageColor, logoSrc, logoWidth = '60%' } = Astro.props;
+const { href, title, body, language, languageColor, logoSrc, logoWidth = '60%', contribution="Contributor" } = Astro.props;
 ---
 
 <li class="link-card">
@@ -22,6 +23,7 @@ const { href, title, body, language, languageColor, logoSrc, logoWidth = '60%' }
         <span class="language">{language}</span>
       </div>
       <p>{body}</p>
+      <p>{contribution}</p>
     </div>
   </a>
 </li>
diff --git a/src/components/MiniCard.astro b/src/components/MiniCard.astro
new file mode 100644
index 0000000..b34bcef
--- /dev/null
+++ b/src/components/MiniCard.astro
@@ -0,0 +1,62 @@
+---
+interface Props {
+    title: string;
+    body: string;
+    href: string;
+    language: string;
+    languageColor: string;
+    logoSrc?: string; 
+    logoWidth?: string;
+    contribution?: string;
+}
+
+const { href, title, body, language, languageColor, logoSrc, logoWidth = '60%', contribution = 'Minor Contributions' } = Astro.props;
+---
+
+<li class="link-card">
+    <a href={href}>
+        {logoSrc && <img src={logoSrc} alt="Project Logo" style={{ maxWidth: logoWidth }} />}
+        <h2>{title}</h2>
+        <div class="language-container">
+            <span class="dot" style={{ backgroundColor: languageColor }}></span>
+            <span class="language">{language}</span>
+        </div>
+        <p>{body}</p>
+        <p>{contribution}</p>
+    </a>
+</li>
+
+<style>
+    .link-card {
+        list-style: none;
+        padding: 1px;
+        background-color: #23262d;
+        border-radius: 6px;
+        color: white;
+    }
+    .link-card > a {
+        text-decoration: none;
+        color: inherit;
+        display: flex;
+        flex-direction: column;
+        padding: 2rem;
+    }
+    .link-card h2 {
+        margin: 0;
+        font-size: 1.25rem;
+    }
+    .link-card p {
+        margin-top: 0.5rem;
+        margin-bottom: 0;
+    }
+    .language-container {
+        display: flex;
+        align-items: center;
+        gap: 5px;
+    }
+    .dot {
+        width: 10px;
+        height: 10px;
+        border-radius: 50%;
+    }
+</style>
\ No newline at end of file
diff --git a/src/pages/about.astro b/src/pages/about.astro
index 59ffdbc..69ed3c4 100644
--- a/src/pages/about.astro
+++ b/src/pages/about.astro
@@ -22,6 +22,7 @@ import RSSFeed from "../components/RSSFeed.astro";
         <a href="https://discord.com/users/246787839570739211"><img src="https://lanyard.cnrad.dev/api/246787839570739211" style="width: 650px; height: auto; margin-bottom: 10px;" /></a>
       </div>
       <DiscordStatus/>
+      <DiscordActivity/>
       <p style="font-size: 1.3rem;">Yes. Its a live status of my Discord status</p>
       <a style="font-size: small;" href="https://github.com/Phineas/lanyard">Live data courtesy of Lanyard</a>
     </div>
diff --git a/src/pages/contributions.astro b/src/pages/contributions.astro
index f6dd454..0f4c6ad 100644
--- a/src/pages/contributions.astro
+++ b/src/pages/contributions.astro
@@ -2,50 +2,62 @@
 import Layout from "../layouts/Layout.astro";
 import SocialNavbar from "../components/SocialNavbar.astro";
 import Card from "../components/Card.astro";
+import MiniCard from "../components/MiniCard.astro";
 ---
 
 <Layout title="Contributions">
   <main>
     <h1>Open Source Contributions</h1>
-    
-    <ul role="list" class="link-card-grid">
-    </ul>
-    
+
+    <ul role="list" class="link-card-grid"></ul>
+
     <section class="contributions-section">
       <h2>Contributions</h2>
       <ul role="list" class="contribution-card-grid">
-        <Card
-          href="https://github.com/pinapelz/Sapphire"
-          title="Sapphire"
-          body="Sapphire is a research implementation of the Final Fantasy XIV Online server. The purpose of Sapphire is to gain an understanding of how the retail game servers work internally."
-          language="C++"
-          languageColor="#f34b7d"
-          logoWidth="300px"
-          logoSrc="https://1852825540-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FoWEO5F5fxBARvfBEby5l%2Fuploads%2FN0KFeaD6TNNdujlRXgrw%2Fsapphire_logo.png?alt=media&token=79fdc373-8bf7-41e0-bf66-fb3eaf67d2ca"
-        />
         <Card
         href="https://github.com/Patchwork-Archive"
         title="Patchwork Archive"
         body="Patchwork Archive aims to archive original songs and covers created by VTubers. With loss of content being a major issue in VTubing (due to termination and graduations), the goal of Patchwork Archive is to preserve a subset of VTuber content for preservation of culture."
+        contribution="Maintainer and creator of project"
         language="Javascript"
         languageColor="#f1e05a"
         logoSrc="https://avatars.githubusercontent.com/u/145537335?s=200&v=4"
         logoWidth="150px"
-        />
+      />
         <Card
-        href="https://github.com/EBro912/Holodex.NET"
-        title="Holodex.NET"
-        body="A C# wrapper for the Holodex API "
-        language="C#"
-        languageColor="#178600"
-        logoSrc="https://camo.githubusercontent.com/259199b315aaf21baf8665a6613a2c0ffb404ad9fbf3f8441e8d0100a1a71937/68747470733a2f2f692e696d6775722e636f6d2f69527967754c672e706e67"
-        logoWidth="150px"
+          href="https://github.com/pinapelz/Sapphire"
+          title="Sapphire"
+          body="Sapphire is a research implementation of the Final Fantasy XIV Online server. The purpose of Sapphire is to gain an understanding of how the retail game servers work internally."
+          contribution="Bug fixes + Reverse engineered and implemented quests"
+          language="C++"
+          languageColor="#f34b7d"
+          logoWidth="300px"
+          logoSrc="https://1852825540-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FoWEO5F5fxBARvfBEby5l%2Fuploads%2FN0KFeaD6TNNdujlRXgrw%2Fsapphire_logo.png?alt=media&token=79fdc373-8bf7-41e0-bf66-fb3eaf67d2ca"
         />
-
+        <div class="card-container">
+          <MiniCard
+            href="https://github.com/EBro912/Holodex.NET"
+            title="Holodex.NET"
+            body="A C# wrapper for the Holodex API "
+            language="C#"
+            languageColor="#178600"
+            logoSrc="https://camo.githubusercontent.com/259199b315aaf21baf8665a6613a2c0ffb404ad9fbf3f8441e8d0100a1a71937/68747470733a2f2f692e696d6775722e636f6d2f69527967754c672e706e67"
+            logoWidth="150px"
+          />
+          <MiniCard
+            href="https://github.com/icssc/AntAlmanac"
+            title="AntAlmanac"
+            body="A course exploration and scheduling tool for UCI Anteaters"
+            language="TypeScript"
+            languageColor="#2b7489"
+            logoSrc="https://github.com/icssc/AntAlmanac/raw/main/apps/antalmanac/public/banner.png"
+            logoWidth="300px"
+          />
+        </div>
       </ul>
     </section>
   </main>
-  
+
   <SocialNavbar />
 
   <style>
@@ -57,14 +69,20 @@ import Card from "../components/Card.astro";
       font-size: 20px;
       line-height: 1.6;
     }
-    .link-card-grid, .contribution-card-grid {
+    .card-container {
+        display: flex;
+        justify-content: space-between;
+        flex-wrap: wrap;
+    }
+    .link-card-grid,
+    .contribution-card-grid {
       display: grid;
       grid-template-columns: repeat(3, minmax(24ch, 1fr));
       gap: 2rem;
       padding: 0;
     }
     .contribution-card-grid {
-      grid-template-columns: 1fr;  /* Each card takes up one row */
+      grid-template-columns: 1fr; /* Each card takes up one row */
     }
     .contributions-section {
       margin-top: 2rem;
@@ -73,8 +91,12 @@ import Card from "../components/Card.astro";
       font-size: 1.5rem;
       margin-bottom: 1rem;
     }
+    .mini-card {
+      margin: 10px 0;
+    }
     @media (max-width: 1020px) {
-      .link-card-grid, .contribution-card-grid {
+      .link-card-grid,
+      .contribution-card-grid {
         grid-template-columns: 1fr;
       }
     }
diff --git a/src/pages/projects.astro b/src/pages/projects.astro
index 0da5cc1..554a3df 100644
--- a/src/pages/projects.astro
+++ b/src/pages/projects.astro
@@ -86,14 +86,8 @@ import Card from "../components/Card.astro";
         language="Javascript"
         languageColor="#f1e05a"
       />
-      <Card
-        href="https://github.com/pinapelz/Sapphire"
-        title="Sapphire (Contributed)"
-        body="A Final Fantasy XIV Server Emulator written in C++"
-        language="C++"
-        languageColor="#f34b7d"
-      />
     </ul>
+    <a href="/contributions"><p>Open Source Contribtuions</p></a>
   </main>
   <SocialNavbar />
   <style>
@@ -105,6 +99,9 @@ import Card from "../components/Card.astro";
       font-size: 20px;
       line-height: 1.6;
     }
+    a{
+      color: white;
+    }
     .link-card-grid {
       display: grid;
       grid-template-columns: repeat(3, minmax(24ch, 1fr));
-- 
cgit v1.2.3