From d735e3d9db57ccf63eca9b61974eb59207f28e4c Mon Sep 17 00:00:00 2001
From: "Claude (Chronicler #63)" <claude@firefrostgaming.com>
Date: Mon, 6 Apr 2026 12:13:14 +0000
Subject: [PATCH] fix(modpackchecker): Wizard review fixes - UI polish

Admin Panel (view.blade.php):
- Changed CurseForge API key from password dots to plain text
- Fixed callouts: dark theme (#1a1a2e) with Frost/Fire accent borders
- Improved code tag styling for readability
- Changed support link to firefrostgaming.com/discord

README.md:
- Added Prerequisites section (PHP 8.1+, Node.js 18+, Yarn, Blueprint)

Reviewed by: Michael 'Frostystyle' Krause (The Wizard)
Signed-off-by: Claude (Chronicler #63) <claude@firefrostgaming.com>
---
 .../blueprint-extension/README.md             |  8 +++++++
 .../blueprint-extension/admin/view.blade.php  | 24 ++++++++++---------
 2 files changed, 21 insertions(+), 11 deletions(-)

diff --git a/services/modpack-version-checker/blueprint-extension/README.md b/services/modpack-version-checker/blueprint-extension/README.md
index a97c179..5d60f66 100644
--- a/services/modpack-version-checker/blueprint-extension/README.md
+++ b/services/modpack-version-checker/blueprint-extension/README.md
@@ -129,6 +129,14 @@ blueprint-extension/
 
 ## Installation
 
+### Prerequisites
+
+- Pterodactyl Panel v1.11+
+- Blueprint Framework (beta-2026-01 or newer)
+- PHP 8.1+
+- Node.js 18+
+- Yarn package manager
+
 ### Standard Installation (BuiltByBit)
 
 1. Upload the downloaded `modpackchecker.blueprint` file to your Pterodactyl panel's root directory (usually `/var/www/pterodactyl`).
diff --git a/services/modpack-version-checker/blueprint-extension/admin/view.blade.php b/services/modpack-version-checker/blueprint-extension/admin/view.blade.php
index e331495..355e35e 100644
--- a/services/modpack-version-checker/blueprint-extension/admin/view.blade.php
+++ b/services/modpack-version-checker/blueprint-extension/admin/view.blade.php
@@ -74,7 +74,7 @@
                     <div class="form-group">
                         <label class="control-label">API Key (BYOK)</label>
                         <input
-                            type="password"
+                            type="text"
                             name="curseforge_api_key"
                             id="curseforge_api_key"
                             value="{{ $curseforge_api_key }}"
@@ -188,13 +188,15 @@
     <!-- Footer Info -->
     <div class="row">
         <div class="col-xs-12">
-            <div class="callout callout-info">
-                <h4><i class="fa fa-info-circle"></i> How It Works</h4>
-                <p style="margin-bottom: 0;">
+            <div style="background: #1a1a2e; border-left: 4px solid #4ECDC4; border-radius: 4px; padding: 15px; margin-bottom: 15px;">
+                <h4 style="margin: 0 0 10px 0; color: #fff;"><i class="fa fa-info-circle" style="color: #4ECDC4;"></i> How It Works</h4>
+                <p style="margin-bottom: 0; color: #ccc;">
                     ModpackChecker automatically detects modpacks via Egg Variables or file fingerprinting.
-                    Set <code>MODPACK_PLATFORM</code> and <code>MODPACK_ID</code> in your server's startup variables
-                    for the most reliable detection, or let the extension scan for <code>manifest.json</code> / 
-                    <code>modrinth.index.json</code> files.
+                    Set <code style="background: #2a2a3e; padding: 2px 6px; border-radius: 3px;">MODPACK_PLATFORM</code> and 
+                    <code style="background: #2a2a3e; padding: 2px 6px; border-radius: 3px;">MODPACK_ID</code> in your server's startup variables
+                    for the most reliable detection, or let the extension scan for 
+                    <code style="background: #2a2a3e; padding: 2px 6px; border-radius: 3px;">manifest.json</code> / 
+                    <code style="background: #2a2a3e; padding: 2px 6px; border-radius: 3px;">modrinth.index.json</code> files.
                 </p>
             </div>
         </div>
@@ -203,10 +205,10 @@
     <!-- Support -->
     <div class="row">
         <div class="col-xs-12">
-            <div class="callout callout-warning">
-                <h4><i class="fa fa-life-ring"></i> Need Help?</h4>
-                <p style="margin-bottom: 0;">
-                    Join our Discord for support: <a href="https://discord.firefrostgaming.com" target="_blank">discord.firefrostgaming.com</a>
+            <div style="background: #1a1a2e; border-left: 4px solid #FF6B35; border-radius: 4px; padding: 15px;">
+                <h4 style="margin: 0 0 10px 0; color: #fff;"><i class="fa fa-life-ring" style="color: #FF6B35;"></i> Need Help?</h4>
+                <p style="margin-bottom: 0; color: #ccc;">
+                    Join our Discord for support: <a href="https://firefrostgaming.com/discord" target="_blank" style="color: #4ECDC4;">firefrostgaming.com/discord</a>
                 </p>
             </div>
         </div>