Themes/ Ram Increased to 16GB

This commit is contained in:
JCBSComputer
2026-06-29 16:38:40 +02:00
parent 54b19123ca
commit 1d080761fb
11 changed files with 1074 additions and 91 deletions
+86 -39
View File
@@ -5,12 +5,14 @@ import { usePathname } from "next/navigation"
import { motion, AnimatePresence } from "framer-motion"
import { Sidebar } from "./sidebar"
import { Topbar } from "./topbar"
import { useWebsiteTheme } from "@/providers/website-theme-provider"
interface AppShellProps {
children: React.ReactNode
}
export function AppShell({ children }: AppShellProps) {
const { websiteTheme } = useWebsiteTheme()
const [sidebarCollapsed, setSidebarCollapsed] = useState(false)
const [mobileOpen, setMobileOpen] = useState(false)
const pathname = usePathname()
@@ -34,50 +36,95 @@ export function AppShell({ children }: AppShellProps) {
return (
<div className="min-h-screen bg-[#F8F8F8] dark:bg-[#0A0A0A] relative overflow-hidden"
style={{
style={websiteTheme === "spidey" ? {
backgroundImage: "radial-gradient(circle, #CC000010 1px, transparent 1px), radial-gradient(circle, #0033CC06 1px, transparent 1px)",
backgroundSize: "28px 28px, 14px 14px",
backgroundPosition: "0 0, 7px 7px",
}}
} : {}}
>
{/* Spider-Man top gradient bar */}
<div className="fixed top-0 left-0 right-0 h-[3px] w-full bg-gradient-to-r from-[#CC0000] via-[#FFFFFF] to-[#0033CC] dark:from-[#FF1111] dark:via-[#FFFFFF] dark:to-[#1144FF] z-50" />
{/* Spider-Man decorations — Spidey theme only */}
{websiteTheme === "spidey" && (
<>
<div className="fixed top-0 left-0 right-0 h-[3px] w-full bg-gradient-to-r from-[#CC0000] via-[#FFFFFF] to-[#0033CC] dark:from-[#FF1111] dark:via-[#FFFFFF] dark:to-[#1144FF] z-50" />
<div className="hidden lg:block fixed top-0 left-0 pointer-events-none z-0 opacity-[0.15] dark:opacity-[0.25]">
<svg width="180" height="180" viewBox="0 0 180 180" fill="none" xmlns="http://www.w3.org/2000/svg">
<line x1="0" y1="0" x2="180" y2="0" stroke="#CC0000" strokeWidth="0.8"/>
<line x1="0" y1="0" x2="180" y2="60" stroke="#CC0000" strokeWidth="0.8"/>
<line x1="0" y1="0" x2="180" y2="120" stroke="#CC0000" strokeWidth="0.8"/>
<line x1="0" y1="0" x2="180" y2="180" stroke="#CC0000" strokeWidth="0.8"/>
<line x1="0" y1="0" x2="120" y2="180" stroke="#CC0000" strokeWidth="0.8"/>
<line x1="0" y1="0" x2="60" y2="180" stroke="#CC0000" strokeWidth="0.8"/>
<line x1="0" y1="0" x2="0" y2="180" stroke="#CC0000" strokeWidth="0.8"/>
<path d="M0,30 Q30,30 30,0" stroke="#CC0000" strokeWidth="0.8" fill="none"/>
<path d="M0,60 Q60,60 60,0" stroke="#CC0000" strokeWidth="0.8" fill="none"/>
<path d="M0,90 Q90,90 90,0" stroke="#CC0000" strokeWidth="0.8" fill="none"/>
<path d="M0,120 Q120,120 120,0" stroke="#CC0000" strokeWidth="0.8" fill="none"/>
<path d="M0,150 Q150,150 150,0" stroke="#CC0000" strokeWidth="0.8" fill="none"/>
<path d="M0,180 Q180,180 180,0" stroke="#CC0000" strokeWidth="0.8" fill="none"/>
</svg>
</div>
<div className="hidden lg:block fixed top-0 right-0 pointer-events-none z-0 opacity-[0.15] dark:opacity-[0.25]">
<svg width="180" height="180" viewBox="0 0 180 180" fill="none" xmlns="http://www.w3.org/2000/svg" style={{ transform: "scaleX(-1)" }}>
<line x1="0" y1="0" x2="180" y2="0" stroke="#CC0000" strokeWidth="0.8"/>
<line x1="0" y1="0" x2="180" y2="60" stroke="#CC0000" strokeWidth="0.8"/>
<line x1="0" y1="0" x2="180" y2="120" stroke="#CC0000" strokeWidth="0.8"/>
<line x1="0" y1="0" x2="180" y2="180" stroke="#CC0000" strokeWidth="0.8"/>
<line x1="0" y1="0" x2="120" y2="180" stroke="#CC0000" strokeWidth="0.8"/>
<line x1="0" y1="0" x2="60" y2="180" stroke="#CC0000" strokeWidth="0.8"/>
<line x1="0" y1="0" x2="0" y2="180" stroke="#CC0000" strokeWidth="0.8"/>
<path d="M0,30 Q30,30 30,0" stroke="#CC0000" strokeWidth="0.8" fill="none"/>
<path d="M0,60 Q60,60 60,0" stroke="#CC0000" strokeWidth="0.8" fill="none"/>
<path d="M0,90 Q90,90 90,0" stroke="#CC0000" strokeWidth="0.8" fill="none"/>
<path d="M0,120 Q120,120 120,0" stroke="#CC0000" strokeWidth="0.8" fill="none"/>
<path d="M0,150 Q150,150 150,0" stroke="#CC0000" strokeWidth="0.8" fill="none"/>
<path d="M0,180 Q180,180 180,0" stroke="#CC0000" strokeWidth="0.8" fill="none"/>
</svg>
</div>
</>
)}
{/* Corner spider webs */}
<div className="hidden lg:block fixed top-0 left-0 pointer-events-none z-0 opacity-[0.15] dark:opacity-[0.25]">
<svg width="180" height="180" viewBox="0 0 180 180" fill="none" xmlns="http://www.w3.org/2000/svg">
<line x1="0" y1="0" x2="180" y2="0" stroke="#CC0000" strokeWidth="0.8"/>
<line x1="0" y1="0" x2="180" y2="60" stroke="#CC0000" strokeWidth="0.8"/>
<line x1="0" y1="0" x2="180" y2="120" stroke="#CC0000" strokeWidth="0.8"/>
<line x1="0" y1="0" x2="180" y2="180" stroke="#CC0000" strokeWidth="0.8"/>
<line x1="0" y1="0" x2="120" y2="180" stroke="#CC0000" strokeWidth="0.8"/>
<line x1="0" y1="0" x2="60" y2="180" stroke="#CC0000" strokeWidth="0.8"/>
<line x1="0" y1="0" x2="0" y2="180" stroke="#CC0000" strokeWidth="0.8"/>
<path d="M0,30 Q30,30 30,0" stroke="#CC0000" strokeWidth="0.8" fill="none"/>
<path d="M0,60 Q60,60 60,0" stroke="#CC0000" strokeWidth="0.8" fill="none"/>
<path d="M0,90 Q90,90 90,0" stroke="#CC0000" strokeWidth="0.8" fill="none"/>
<path d="M0,120 Q120,120 120,0" stroke="#CC0000" strokeWidth="0.8" fill="none"/>
<path d="M0,150 Q150,150 150,0" stroke="#CC0000" strokeWidth="0.8" fill="none"/>
<path d="M0,180 Q180,180 180,0" stroke="#CC0000" strokeWidth="0.8" fill="none"/>
</svg>
</div>
<div className="hidden lg:block fixed top-0 right-0 pointer-events-none z-0 opacity-[0.15] dark:opacity-[0.25]">
<svg width="180" height="180" viewBox="0 0 180 180" fill="none" xmlns="http://www.w3.org/2000/svg" style={{ transform: "scaleX(-1)" }}>
<line x1="0" y1="0" x2="180" y2="0" stroke="#CC0000" strokeWidth="0.8"/>
<line x1="0" y1="0" x2="180" y2="60" stroke="#CC0000" strokeWidth="0.8"/>
<line x1="0" y1="0" x2="180" y2="120" stroke="#CC0000" strokeWidth="0.8"/>
<line x1="0" y1="0" x2="180" y2="180" stroke="#CC0000" strokeWidth="0.8"/>
<line x1="0" y1="0" x2="120" y2="180" stroke="#CC0000" strokeWidth="0.8"/>
<line x1="0" y1="0" x2="60" y2="180" stroke="#CC0000" strokeWidth="0.8"/>
<line x1="0" y1="0" x2="0" y2="180" stroke="#CC0000" strokeWidth="0.8"/>
<path d="M0,30 Q30,30 30,0" stroke="#CC0000" strokeWidth="0.8" fill="none"/>
<path d="M0,60 Q60,60 60,0" stroke="#CC0000" strokeWidth="0.8" fill="none"/>
<path d="M0,90 Q90,90 90,0" stroke="#CC0000" strokeWidth="0.8" fill="none"/>
<path d="M0,120 Q120,120 120,0" stroke="#CC0000" strokeWidth="0.8" fill="none"/>
<path d="M0,150 Q150,150 150,0" stroke="#CC0000" strokeWidth="0.8" fill="none"/>
<path d="M0,180 Q180,180 180,0" stroke="#CC0000" strokeWidth="0.8" fill="none"/>
</svg>
</div>
{/* Cosmic decorations */}
{websiteTheme === "cosmic" && (
<>
<div className="fixed top-0 left-0 right-0 h-[2px] w-full bg-gradient-to-r from-transparent via-[#00CCB3] to-transparent dark:via-[#00CCB3] z-50 opacity-60" />
<div className="hidden lg:block fixed top-0 left-0 pointer-events-none z-0 opacity-[0.12]">
<svg width="200" height="200" viewBox="0 0 200 200" fill="none" xmlns="http://www.w3.org/2000/svg">
<circle cx="40" cy="30" r="2" fill="#00CCB3" opacity="0.8"/>
<circle cx="85" cy="65" r="1.5" fill="#a855f7" opacity="0.6"/>
<circle cx="25" cy="120" r="1" fill="#00CCB3" opacity="0.5"/>
<circle cx="60" cy="170" r="2.5" fill="#a855f7" opacity="0.7"/>
<circle cx="120" cy="25" r="1.5" fill="#00CCB3" opacity="0.6"/>
<circle cx="160" cy="80" r="1" fill="#a855f7" opacity="0.4"/>
<circle cx="140" cy="150" r="2" fill="#00CCB3" opacity="0.7"/>
<circle cx="180" cy="40" r="1.5" fill="#a855f7" opacity="0.5"/>
<circle cx="50" cy="90" r="3" fill="#00CCB3" opacity="0.08"/>
<circle cx="130" cy="110" r="4" fill="#a855f7" opacity="0.06"/>
<path d="M40,30 Q60,50 85,65" stroke="#00CCB3" strokeWidth="0.4" opacity="0.25"/>
<path d="M85,65 Q100,120 60,170" stroke="#a855f7" strokeWidth="0.4" opacity="0.2"/>
<path d="M25,120 Q80,140 140,150" stroke="#00CCB3" strokeWidth="0.4" opacity="0.2"/>
<path d="M120,25 Q150,50 160,80" stroke="#a855f7" strokeWidth="0.3" opacity="0.2"/>
</svg>
</div>
<div className="hidden lg:block fixed top-0 right-0 pointer-events-none z-0 opacity-[0.12]">
<svg width="200" height="200" viewBox="0 0 200 200" fill="none" xmlns="http://www.w3.org/2000/svg" style={{ transform: "scaleX(-1)" }}>
<circle cx="40" cy="30" r="2" fill="#a855f7" opacity="0.8"/>
<circle cx="85" cy="65" r="1.5" fill="#00CCB3" opacity="0.6"/>
<circle cx="25" cy="120" r="1" fill="#a855f7" opacity="0.5"/>
<circle cx="60" cy="170" r="2.5" fill="#00CCB3" opacity="0.7"/>
<circle cx="120" cy="25" r="1.5" fill="#a855f7" opacity="0.6"/>
<circle cx="160" cy="80" r="1" fill="#00CCB3" opacity="0.4"/>
<circle cx="140" cy="150" r="2" fill="#a855f7" opacity="0.7"/>
<circle cx="180" cy="40" r="1.5" fill="#00CCB3" opacity="0.5"/>
<circle cx="50" cy="90" r="3" fill="#a855f7" opacity="0.08"/>
<circle cx="130" cy="110" r="4" fill="#00CCB3" opacity="0.06"/>
<path d="M40,30 Q60,50 85,65" stroke="#a855f7" strokeWidth="0.4" opacity="0.25"/>
<path d="M85,65 Q100,120 60,170" stroke="#00CCB3" strokeWidth="0.4" opacity="0.2"/>
<path d="M25,120 Q80,140 140,150" stroke="#a855f7" strokeWidth="0.4" opacity="0.2"/>
<path d="M120,25 Q150,50 160,80" stroke="#00CCB3" strokeWidth="0.3" opacity="0.2"/>
</svg>
</div>
</>
)}
<Sidebar
collapsed={sidebarCollapsed}
+1 -1
View File
@@ -2,7 +2,7 @@
import { useState, useEffect } from "react"
const RAM_LIMIT_MB = 8192
const RAM_LIMIT_MB = 16000
const CPU_LIMIT_PCT = 400
interface SystemMonitorProps {