Make everything look nicer

package.json

@@ -11,18 +11,18 @@
   },
   "devDependencies": {
     "@types/react": "18.2.73",
-    "eslint": "^8.56.0",
-    "eslint-config-next": "^14.1.4",
+    "eslint": "^8.57.0",
+    "eslint-config-next": "^14.2.3",
     "eslint-config-prettier": "^9.1.0",
-    "eslint-plugin-prettier": "^5.1.2",
-    "prettier": "^3.1.1",
+    "eslint-plugin-prettier": "^5.1.3",
+    "prettier": "^3.2.5",
     "typescript": "5.4.3"
   },
   "dependencies": {
-    "@neato/guider": "^1.0.1",
-    "next": "^14.1.4",
+    "@neato/guider": "^1.0.2",
+    "next": "^14.2.3",
     "next-seo": "^6.5.0",
-    "react": "^18.2.0",
-    "react-dom": "^18.2.0"
+    "react": "^18.3.0",
+    "react-dom": "^18.3.0"
   }
 }

pages/index.tsx

@@ -18,7 +18,7 @@ export default function LandingPage() {
         <Hero.Actions>
           <Button to="/self-hosting/hosting-intro">Get Started</Button>
           <Button to="https://github.com/sussy-code/smov" type="secondary">
-            Open on GitHub →
+            Open on GitHub
           </Button>
         </Hero.Actions>
       </Hero>

pages/instances.mdx

@@ -7,8 +7,12 @@ title: 'Instances'
 This page showcases sudo-flix instances hosted by the community. 
 
 <Note>
-Instances with a 📦 next to the link have the NSBX API meaning there's more sources and features!
+* Sites with a `🛡️` next to them are official instances hosted by the sudo-flix team.
+* Sites with a `💾` next to them use the sudo-backend meaning your data is synced across these sites.
+* Sites with a `📱` next to them have PWA support meaning you can use the site as a native app on your phone.
 </Note>
 
-- [sudo-flix.lol](https://sudo-flix.lol) 📦
-- [kanded.xyz](https://flix.kanded.xyz)
+| Site                                   | Host              | Stats       |
+|:---------------------------------------|:------------------|:------------|
+| [sudo-flix.lol](https://sudo-flix.lol) | sudo-flix team    | 🛡️💾📱      |
+| [kanded.xyz](https://flix.kanded.xyz)  | sudo-flix team    | 🛡️💾📱      |

theme.config.tsx

@@ -4,8 +4,22 @@ import { NextSeo } from 'next-seo';
 import coverUrl from "./public/cover.png"; 
 import faviconUrl from "./public/favicon.ico";
 
+const starLinks = [
+  link('GitHub', 'https://github.com/sussy-code/smov', {
+    style: 'star',
+    newTab: true,
+    icon: 'akar-icons:github-fill',
+  }),
+  link('Discord', 'https://discord.gg/9vmr6vBQKS', {
+    style: 'star',
+    newTab: true,
+    icon: 'fa6-brands:discord',
+  }),
+];
+
 export default defineTheme({
   github: "sussy-code/smov",
+  navigation: [link('Check it out', 'https://sudo-flix.lol')],
   contentFooter: {
     text: "Made with :3 (sillyness)",
     editRepositoryBase: "https://github.com/sussy-code/docs/blob/master",
@@ -39,6 +53,7 @@ export default defineTheme({
   ),
   settings: {
     logo: () => <Logo />,
+    backgroundPattern: 'flare',
     colors: {
       "primary": "#A476D9",
       "primaryLighter": "#C4ADDE",
@@ -51,11 +66,12 @@ export default defineTheme({
       "text": "#8C899A",
       "textLighter": "#A6A4AE",
       "textHighlight": "#fff"
-    }
+    },
   },
   directories: [
     directory("main", {
       sidebar: [
+        ...starLinks,
         group("Global", [
           link("Instances", "/instances", { icon: 'mdi:web' }),
           link("Browser extension", "/extension", { icon: 'mdi:extension' }),