feat: lots of refinement

Author: prplwtf

apps/frontend/content/guides/dev/adminconfiguration.md

@@ -1,11 +1,10 @@
 ---
-title: Admin configuration
-description: Add configuration options to your extension's admin page
+title: Configuration options in the admin panel
+description: Add a few configuration options to your extension's admin page
 author:
 category: dev
 thumbnail: adminconfiguration.jpeg
-order:
-unlisted: true
+unlisted: false
 ---
 
 ...

apps/frontend/content/guides/dev/admincontroller.md

@@ -1,11 +1,10 @@
 ---
-title: Admin controller
-description: Add a custom PHP controller to an extension's admin page
+title: Custom admin page controllers
+description: Render your admin page using a custom controller
 author:
 category: dev
 thumbnail: controller.jpeg
-order:
-unlisted: true
+unlisted: false
 ---
 
 ...

apps/frontend/content/guides/dev/adminpage.md

@@ -1,11 +1,10 @@
 ---
-title: Admin page
-description: Create your extension's admin page
+title: Your first admin page
+description: Learn how to build a simple admin page for your extension
 author: Emma
 category: dev
 thumbnail: adminpage.jpeg
-order:
-unlisted: false
+order: -1
 ---
 
 ## Introduction

apps/frontend/content/guides/dev/dashboardwrapper.md

@@ -1,11 +1,10 @@
 ---
-title: Dashboard wrappers
-description: Extend the Pterodactyl client and admin dashboard within the Laravel blade wrapper
+title: Extending the user dashboard wrapper
+description: Extend the Pterodactyl user dashboard using the Laravel blade wrapper
 author:
 category: dev
 thumbnail: dashboard.jpeg
-order:
-unlisted: true
+unlisted: false
 ---
 
 ...

apps/frontend/content/guides/dev/docker.md

@@ -3,7 +3,7 @@ title: Develop with Blueprint Docker
 description: Set up Blueprint Docker for local development
 author: Loki and Emma
 category: dev
-thumbnail: blueprintdocker.jpg
+thumbnail: blueprintdockerdev.jpg
 ---
 
 ::card

apps/frontend/content/guides/dev/packaging.md

@@ -1,13 +1,16 @@
 ---
-title: Packaging extensions
-description: Export extensions into ".blueprint" files for distribution
+title: Exporting your extension
+description: Export extensions into "myextension.blueprint" files for distribution
 author: Emma
 category: dev
 thumbnail: files.jpeg
-order:
 ---
 
-## Export your extension with the CLI
+## Introduction
+
+Blueprint extensions are distributed with `{identifier}.blueprint` files. Users can upload these files to their Pterodactyl directory and install your extension through the Blueprint CLI.
+
+## Export the extension
 
 To turn your development files into a distributable `{identifier}.blueprint` file, we'll need to use Blueprint's CLI utility to package it.
 
@@ -28,12 +31,20 @@ Blueprint can generate a temporary download link for your extension for easier e
 blueprint -export expose
 ```
 
-### Test your exported extension
+## Test the extension
 
 Testing is important! You should always check if an extension still works as expected, especially when using export scripts. Install your extension, test it on your panel and finally, if all is right, distribute it.
 
-## Manually export your extension
+```bash
+# Make sure to remove your extension beforehand, if it is
+# installed.
+blueprint -remove myextension
+
+# Install the myextension.blueprint file once again, which
+# should now exist in your Pterodactyl panel.
+blueprint -install myextension
+```
 
-Don't do this! Even though extensions are practically ZIP files, exporting manually can break your extension, in current and future releases of Blueprint.
+## That's it!
 
-Our CLI does more than just archiving extensions, it excludes certain directories, runs export scripts and enforces the folder structure Blueprint expects.
+You can now distribute your `{identifier}.blueprint` file. There are a few marketplaces that have specific categories/tags for Blueprint extensions. If your extension is open-source, add the [blueprint-extension](https://github.com/topics/blueprint-extension) tag to your repository!

apps/frontend/content/guides/dev/quickstart.md

@@ -4,7 +4,7 @@ description: Make your very own Blueprint extension
 author: Emma
 category: dev
 thumbnail: code.jpeg
-order: -1
+order: -2
 ---
 
 ::card

apps/frontend/public/img/guides/thumbnails/blueprintdockerdev.jpg

@@ -21,7 +21,6 @@
     :wrap="props.wrap"
     :class="props.class"
     @input="resize"
-    @click="resize"
     class="h-auto w-full resize-none overflow-hidden rounded-2xl border border-neutral-700 bg-gray-800/40 p-4 outline-0 transition-colors focus:bg-gray-800/60"
   />
 </template>

apps/frontend/src/components/elements/form/Textbox.vue

@@ -257,7 +257,7 @@
               <ElementsFormBinarytoggle
                 v-model="form.unlisted"
                 label="Visibility"
-                description="Public extensions are discoverable through the platform, unlisted extension only using their direct link. If your extension is pending review, this setting will immediately apply after approval."
+                description="Public extensions are discoverable through the platform, unlisted only available to users with access. If your extension is pending review, this setting will immediately apply after approval."
                 :options="[
                   {
                     value: false,
@@ -266,7 +266,7 @@
                   },
                   {
                     value: true,
-                    icon: 'pixelarticons:link',
+                    icon: 'pixelarticons:hidden',
                     label: 'Unlisted',
                   },
                 ]"
@@ -276,7 +276,7 @@
         </div>
       </div>
 
-      <div class="rounded-3xl border border-neutral-700">
+      <div class="overflow-hidden rounded-3xl border border-neutral-700">
         <div
           class="flex items-center justify-between gap-2 border-b border-neutral-700 p-4"
         >
@@ -288,20 +288,24 @@
             <SvgIconMarkdown :size="32" class="text-neutral-500" />
           </div>
         </div>
-        <div class="p-4">
-          <div
-            class="flex grid-cols-2 flex-col overflow-hidden rounded-2xl border border-neutral-700 xl:grid"
-          >
-            <div class="grid grid-cols-1 bg-neutral-800/40">
+        <div
+          class="bg-stripes flex grid-cols-2 flex-col divide-y divide-neutral-700 overflow-hidden rounded-2xl xl:grid xl:divide-x xl:divide-y-0"
+        >
+          <div>
+            <div
+              class="border-neutral-700 bg-neutral-950 p-4 xl:-mb-[2px] xl:border-b"
+            >
               <ElementsFormTextbox
                 v-model="form.description"
                 :rows="12"
-                class="rounded-none border-0 bg-transparent font-mono"
+                class="font-mono"
                 :placeholder="`(ﾉ*･_･)ﾉ \\\n**markdown** is supported`"
               />
             </div>
+          </div>
+          <div>
             <div
-              class="border-t border-neutral-700 p-4 xl:border-s xl:border-t-0"
+              class="border-neutral-700 bg-neutral-950 p-4 xl:-mb-[2px] xl:border-b"
             >
               <template v-if="!form.description || form.description == ''">
                 <p>(ﾉ*･_･)ﾉ</p>