feat: Added discord link

package.json

@@ -14,6 +14,7 @@
     "youtube": "https://www.youtube.com/@SimeonRadivoev",
     "issues": "https://github.com/simeonradivoev/gameflow-deck/issues",
     "store": "https://github.com/simeonradivoev/gameflow-store",
+    "discord": "https://discord.gg/R9KakhY67d",
     "license": "https://github.com/simeonradivoev/gameflow-deck/blob/master/LICENSE",
     "packages": "https://www.npmjs.com/search?q=maintainer%3Asimeonradivoev%20keywords%3Agameflow",
     "aboutus": "https://simeonradivoev.com",

src/components/Community.astro

@@ -0,0 +1,24 @@
+---
+import { Discord } from "simple-icons-astro";
+import pkg from "../../package.json";
+---
+
+<div class="hero bg-base-300 min-h-[30vh]">
+  <div class="hero-content flex-col text-center">
+    <div class="text-accent/60 text-lg">Discord</div>
+    <div class="text-4xl font-semibold">Join Our Community</div>
+    <div class="text-2xl font-semibold">
+      Have a suggestion, feedback or just a question?
+    </div>
+    <div class="flex flex-wrap gap-2 justify-center md:justify-start">
+      <a
+        class="bg-primary rounded-full text-primary-content p-2 px-4 hover:bg-accent hover:text-accent-content cursor-pointer flex gap-2"
+        href={pkg.socials.discord}
+        target="_blank"
+      >
+        <Discord />
+        Join Us
+      </a>
+    </div>
+  </div>
+</div>

src/components/Footer.astro

@@ -17,6 +17,7 @@ import pkg from "../../package.json";
     <a class="link link-hover" href={pkg.socials.aboutus}>About us</a>
     <a class="link link-hover" href={pkg.socials.packages}>Packages</a>
     <a class="link link-hover" href={pkg.socials.store}>Store</a>
+    <a class="link link-hover" href={pkg.socials.discord}>Discord</a>
     <a class="link link-hover" href={pkg.sponsor.url}>Sponsor</a>
   </nav>
   <nav>

src/components/Header.astro

@@ -1,5 +1,5 @@
 ---
-import { Github } from "simple-icons-astro";
+import { Github, Discord } from "simple-icons-astro";
 import { HandCoins } from "@lucide/astro";
 import Icon from "../assets/icon.svg";
 import pkg from "../../package.json";
@@ -21,9 +21,14 @@ import { releaseData } from "../scripts/getters";
       href={pkg.sponsor.url}
       ><HandCoins />
     </a>
+    <a
+      class="hidden md:flex gap-2 bg-base-300 cursor-pointer rounded-full p-1 px-3 text-xl hover:bg-accent hover:text-accent-content"
+      href={pkg.socials.discord}
+      ><Discord />
+    </a>
     <a
       title="Sponsor"
-      class="hidden sm:hidden md:flex gap-2 bg-base-300 cursor-pointer rounded-full p-1 px-3 text-xl hover:bg-accent hover:text-accent-content"
+      class="hidden md:flex gap-2 bg-base-300 cursor-pointer rounded-full p-1 px-3 text-xl hover:bg-accent hover:text-accent-content"
       href={pkg.socials.github}
       ><Github />GitHub
     </a>

src/components/Integrations.astro

@@ -1,28 +1,39 @@
 ---
 import { Puzzle } from "@lucide/astro";
+import { Rclone } from "simple-icons-astro";
 import { emulators } from "../scripts/getters";
 ---
 
 <div class="divider sm:my-8 md:my-16"><Puzzle size={48} />Integrations</div>
-<div class="grid sm:grid-cols-1 md:grid-cols-2 gap-8 p-8">
+<ul class="flex flex-wrap gap-2 justify-center-safe px-16">
-  <ul
+  <a
-    class="grid sm:grid-cols-2 md:lg:grid-cols-3 lg:grid-cols-4 gap-2 sm:border-b-3 sm:border-b-base-content/10 sm:pb-8 md:border-r-3 md:border-r-base-content/10 md:pr-8 items-start"
+    href="https://romm.app/"
+    target="_blank"
+    class="bg-base-300 rounded-full p-2 flex items-center justify-center gap-2 hover:bg-base-100"
   >
-    <li class="bg-base-300 rounded-full p-2 flex items-center justify-center">
+    <img
-      ROMM
+      class="size-8"
-    </li>
+      src="https://cdn.jsdelivr.net/gh/homarr-labs/dashboard-icons/svg/romm.svg"
-    <li class="bg-base-300 rounded-full p-2 flex items-center justify-center">
+    />ROMM
+  </a>
+  <a
+    href="https://emulatorjs.org/"
+    target="_blank"
+    class="bg-base-300 rounded-full p-2 flex items-center justify-center gap-2 hover:bg-base-100"
+  >
+    <img
+      class="size-8"
+      src="https://cdn.jsdelivr.net/gh/homarr-labs/dashboard-icons/svg/emulatorjs.svg"
+    />
     Emulator JS
-    </li>
+  </a>
-    <li class="bg-base-300 rounded-full p-2 flex items-center justify-center">
+  <a
-      RClone
+    href="https://rclone.org/"
-    </li>
+    target="_blank"
-    <li class="bg-base-300 rounded-full p-2 flex items-center justify-center">
+    class="bg-base-300 rounded-full p-2 flex items-center justify-center gap-2 hover:bg-base-100"
-      UMU
+  >
-    </li>
+    <Rclone size="32" />RClone
-  </ul>
+  </a>
-
-  <ul class="grid sm:grid-cols-1 md:lg:grid-cols-2 lg:grid-cols-3 gap-2">
   {
     emulators.map((e) => (
       <a
@@ -35,5 +46,4 @@ import { emulators } from "../scripts/getters";
       </a>
     ))
   }
-  </ul>
+</ul>
-</div>

src/components/Welcome.astro

@@ -8,6 +8,7 @@ import Integrations from "./Integrations.astro";
 import Keywords from "./Keywords.astro";
 import Footer from "./Footer.astro";
 import Features from "./Features.astro";
+import Community from "./Community.astro";
 ---
 
 <Header />
@@ -26,9 +27,10 @@ import Features from "./Features.astro";
   </div>
   <Features />
   <Integrations />
-  <div>
+  <div class="py-16">
-    <Screenshots />
+    <Community />
   </div>
+  <Screenshots />
 </div>
 <Keywords />
 <Footer />