feat: add new category "extra guides"

Author: prplwtf

Cargo.lock

@@ -1,6 +1,6 @@
 [package]
 name = "web"
-version = "3.1.11"
+version = "3.1.12"
 edition = "2024"
 
 [dependencies]

apps/backend/Cargo.toml

@@ -183,5 +183,10 @@
     "from": "/docs?page=about/changelog/alpha-F0V",
     "to": "/releases/alpha-f0v",
     "status": 301
+  },
+  {
+    "from": "/guides/community/install-update-nodejs",
+    "to": "/guides/extra/install-update-nodejs",
+    "status": 301
   }
 ]

apps/backend/redirects.json

@@ -2,7 +2,7 @@
 title: How to install Node.js on Ubuntu/Debian
 description: Install or update/downgrade Node.js to use it for Pterodactyl and Blueprint
 author: Emma
-category: community
+category: extra
 thumbnail: nodejs.jpeg
 ---
 

…uides/community/install-update-nodejs.md …nt/guides/extra/install-update-nodejs.mdapps/frontend/content/guides/community/install-update-nodejs.md renamed to apps/frontend/content/guides/extra/install-update-nodejs.md apps/frontend/content/guides/community/install-update-nodejs.md renamed to apps/frontend/content/guides/extra/install-update-nodejs.md

@@ -21,6 +21,11 @@ export const guidesCategories: Record<string, CategoryConfig> = {
     label: 'Community Guides',
     order: 3,
   },
+  extra: {
+    icon: 'memory:dagger',
+    label: 'Extra Guides',
+    order: 4,
+  },
 }
 
 export const defaultCategory: CategoryConfig = {

apps/frontend/public/img/infoblur.jpeg

@@ -0,0 +1,36 @@
+<template>
+  <div
+    class="upsell-container group cursor-pointer border-neutral-700 bg-neutral-900 md:border-b"
+    @click="link?.click()"
+  >
+    <div
+      class="bg-linear-to-r min-h-25 flex w-full flex-col gap-2 from-neutral-900 via-neutral-900 to-neutral-950/50 md:p-8"
+    >
+      <h2>The game-hosting industry builds on Blueprint</h2>
+      <p>
+        Pterodactyl's favorite modding community. Develop, collaborate and
+        install extensions with the extension platform that puts you first.
+      </p>
+      <a href="/" tabindex="-1" ref="link">
+        <button
+          class="text-brand-50 flex cursor-pointer items-center gap-1 font-bold transition-all group-hover:gap-2"
+        >
+          <span> Learn more </span>
+          <Icon name="memory:chevron-right" :size="22" />
+        </button>
+      </a>
+    </div>
+  </div>
+</template>
+
+<style scoped>
+.upsell-container {
+  background: url(/img/infoblur_alt.jpeg) no-repeat;
+  background-size: 50%;
+  background-position: center right;
+}
+</style>
+
+<script setup lang="ts">
+const link = useTemplateRef('link')
+</script>

apps/frontend/public/img/infoblur_alt.jpeg

@@ -43,6 +43,7 @@
             </div>
           </div>
         </div>
+        <UiUpsellExtraguidesInitial v-if="data.category == 'extra'" />
         <div class="w-full md:p-8">
           <ContentRenderer :value="data" class="prose-content space-y-2" />
         </div>