From 8ca9b863eb1a65d5bdc389d16bb0b2f31f6c80f3 Mon Sep 17 00:00:00 2001
From: "Joseph.Rawlings" <root0091@gmail.com>
Date: Mon, 22 Dec 2025 23:21:25 -0500
Subject: [PATCH] feat: enhance control panel and infrastructure sections with
 gradient backgrounds for improved visual appeal

---
 themes/lucentui/views/home.blade.php | 64 +++++++++++++++-------------
 1 file changed, 34 insertions(+), 30 deletions(-)

diff --git a/themes/lucentui/views/home.blade.php b/themes/lucentui/views/home.blade.php
index fb7024abd..b3aa6357d 100644
--- a/themes/lucentui/views/home.blade.php
+++ b/themes/lucentui/views/home.blade.php
@@ -177,16 +177,17 @@
     <!-- Control Panel Features - Modern Bento Layout -->
     <section id="panel-features" class="py-24 md:py-32 relative">
         <div class="container mx-auto px-4">
-            <!-- Section Header -->
-            <div class="max-w-2xl mb-12">
-                <p class="text-sm font-medium text-primary uppercase tracking-wider mb-3">Control Panel</p>
-                <h2 class="text-3xl md:text-4xl font-bold text-color-base mb-4">
-                    {{ theme('panel_title', 'Complete Server Management') }}
-                </h2>
-                <p class="text-base text-color-muted leading-relaxed">
-                    {{ theme('panel_subtitle', 'Take full control of your VPS with our comprehensive management dashboard. Every tool you need, right at your fingertips.') }}
-                </p>
-            </div>
+            <div class="bg-gradient-to-b from-background-secondary/50 to-background-secondary/20 rounded-3xl p-8 md:p-12">
+                <!-- Section Header -->
+                <div class="max-w-2xl mb-12">
+                    <p class="text-sm font-medium text-primary uppercase tracking-wider mb-3">Control Panel</p>
+                    <h2 class="text-3xl md:text-4xl font-bold text-color-base mb-4">
+                        {{ theme('panel_title', 'Complete Server Management') }}
+                    </h2>
+                    <p class="text-base text-color-muted leading-relaxed">
+                        {{ theme('panel_subtitle', 'Take full control of your VPS with our comprehensive management dashboard. Every tool you need, right at your fingertips.') }}
+                    </p>
+                </div>
 
             <!-- Bento Grid -->
             <div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-12 gap-4 md:gap-6">
@@ -480,15 +481,16 @@
     <!-- Infrastructure Features - Alternating Layout -->
     <section id="features" class="py-24 md:py-32">
         <div class="container mx-auto px-4">
-            <div class="text-center max-w-2xl mx-auto mb-14">
-                <p class="text-sm font-medium text-primary uppercase tracking-wider mb-3">Infrastructure</p>
-                <h2 class="text-3xl md:text-4xl font-bold text-color-base mb-4">
-                    {{ theme('features_title', 'Enterprise Infrastructure') }}
-                </h2>
-                <p class="text-base text-color-muted leading-relaxed">
-                    {{ theme('features_subtitle', 'Built on carrier-grade hardware with redundant systems, delivering the reliability your business demands') }}
-                </p>
-            </div>
+            <div class="bg-gradient-to-b from-background-secondary/50 to-background-secondary/20 rounded-3xl p-8 md:p-12">
+                <div class="text-center max-w-2xl mx-auto mb-14">
+                    <p class="text-sm font-medium text-primary uppercase tracking-wider mb-3">Infrastructure</p>
+                    <h2 class="text-3xl md:text-4xl font-bold text-color-base mb-4">
+                        {{ theme('features_title', 'Enterprise Infrastructure') }}
+                    </h2>
+                    <p class="text-base text-color-muted leading-relaxed">
+                        {{ theme('features_subtitle', 'Built on carrier-grade hardware with redundant systems, delivering the reliability your business demands') }}
+                    </p>
+                </div>
 
             <!-- Feature Rows - Alternating -->
             <div class="space-y-8">
@@ -543,19 +545,20 @@
     </section>
 
     <!-- Quick Actions - Modern Cards -->
-    <section class="py-24 md:py-32 bg-gradient-to-b from-transparent via-background-secondary/30 to-transparent">
+    <section class="py-24 md:py-32">
         <div class="container mx-auto px-4">
-            <div class="text-center max-w-xl mx-auto mb-12">
-                <p class="text-sm font-medium text-primary uppercase tracking-wider mb-3">Quick Start</p>
-                <h2 class="text-3xl md:text-4xl font-bold text-color-base mb-3">
-                    {{ theme('quick_actions_title', 'Get Started in Seconds') }}
-                </h2>
-                <p class="text-base text-color-muted leading-relaxed">
-                    {{ theme('quick_actions_subtitle', 'Deploy your VPS and start managing it immediately') }}
-                </p>
-            </div>
+            <div class="bg-gradient-to-b from-background-secondary/50 to-background-secondary/20 rounded-3xl p-8 md:p-12">
+                <div class="text-center max-w-xl mx-auto mb-12">
+                    <p class="text-sm font-medium text-primary uppercase tracking-wider mb-3">Quick Start</p>
+                    <h2 class="text-3xl md:text-4xl font-bold text-color-base mb-3">
+                        {{ theme('quick_actions_title', 'Get Started in Seconds') }}
+                    </h2>
+                    <p class="text-base text-color-muted leading-relaxed">
+                        {{ theme('quick_actions_subtitle', 'Deploy your VPS and start managing it immediately') }}
+                    </p>
+                </div>
 
-            <div class="grid md:grid-cols-2 lg:grid-cols-4 gap-6 max-w-6xl mx-auto">
+                <div class="grid md:grid-cols-2 lg:grid-cols-4 gap-6 max-w-6xl mx-auto">
                 <!-- Deploy VPS -->
                 <a href="{{ theme('buy_server_link', '#services') }}" class="group relative overflow-hidden bg-gradient-to-br from-primary to-primary/80 p-8 rounded-3xl shadow-xl shadow-primary/20 hover:shadow-2xl hover:shadow-primary/30 transition-all duration-500 hover:-translate-y-2">
                     <div class="absolute top-0 right-0 w-32 h-32 bg-white/10 rounded-full blur-2xl -translate-y-1/2 translate-x-1/2"></div>
@@ -617,6 +620,7 @@
                     </div>
                 </a>
             </div>
+            </div>
         </div>
     </section>