Skip to content

Commit c896380

Browse files
feat: implement light/dark mode theme system (#182)
* feat: implement light/dark mode theme system - Add semantic color CSS variables (success, warning, info, error) for both themes - Create ThemeProvider with React context and localStorage persistence - Add ThemeToggle component with sun/moon icons for header region - Add theme switcher in General Settings modal - Replace 200+ hardcoded Tailwind colors with CSS variables across 30+ components - Update layout.tsx to remove forced dark mode - Keep terminal colors unchanged as requested - Default to dark mode, with seamless light/dark switching Components updated: - High-priority: InstalledScriptsTab, ScriptInstallationCard, LXCSettingsModal, ScriptsGrid - All remaining component files with hardcoded colors - UI components: button, toggle, badge variants - Modal components: ErrorModal, ConfirmationModal, AuthModal, SetupModal - Form components: ServerForm, FilterBar, CategorySidebar - Display components: ScriptCard, ScriptCardList, DiffViewer, TextViewer Theme switchers: - Header: Small nuanced toggle in top-right - Settings: Detailed Light/Dark selection in General Settings * fix: resolve ESLint warnings - Fix missing dependencies in useCallback and useEffect hooks - Prefix unused parameter with underscore to satisfy ESLint rules - Build now completes without warnings * fix: improve toggle component styling for better visibility - Use explicit gray colors instead of CSS variables for toggle background - Ensure proper contrast in both light and dark modes - Toggle switches now display correctly with proper visual states * fix: improve toggle visual states for better UX - Use explicit conditional styling instead of peer classes - Active toggles now clearly show primary color background - Inactive toggles show gray background for clear distinction - Much easier to tell which toggles are on/off at a glance * fix: improve toggle contrast in dark mode - Change inactive toggle background from gray-700 to gray-600 for better visibility - Add darker border color (gray-500) for toggle handle in dark mode - Toggles now have proper contrast against dark backgrounds - Both light and dark modes now have clear visual distinction * fix: resolve dependency loop and improve dropdown styling - Fix circular dependency in InstalledScriptsTab status check - Remove fetchContainerStatuses function and inline logic in useEffect - Make all dropdown menu items grey with consistent hover effects - Update both ScriptInstallationCard and InstalledScriptsTab dropdowns - Remove unused useCallback import - Build now completes without warnings or errors * fix: restore proper button colors and eliminate dependency loop - Restore red color for Stop/Destroy buttons and green for Start buttons - Fix circular dependency by using ref for containerStatusMutation - Update both InstalledScriptsTab and ScriptInstallationCard dropdowns - Maintain grey color for other menu items (Update, Shell, Open UI, etc.) - Build now completes without warnings or dependency loops * feat: add missing hover utility classes for semantic colors - Add hover states for success, warning, info, error colors - Add hover:bg-success/20, hover:bg-error/20, etc. classes - Add hover:text-success-foreground, hover:text-error-foreground classes - Start/Stop and Destroy buttons now have proper hover effects - All dropdown menu items now have consistent hover behavior * feat: improve status cards with useful LXC container information - Replace useless 'Successful/Failed/In Progress' cards with meaningful data - Show 'Running LXC' count in green (actual running containers) - Show 'Stopped LXC' count in red (actual stopped containers) - Keep 'Total Installations' for overall count - Change layout from 4 columns to 3 columns for better spacing - Status cards now show real-time container states instead of installation status * style: center content in status cards - Add text-center class to each individual status card - Numbers and labels now centered within each card - Improves visual balance and readability - All three cards (Total, Running LXC, Stopped LXC) now have centered content
1 parent d031216 commit c896380

File tree

223 files changed

+1370
-987
lines changed

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

223 files changed

+1370
-987
lines changed

scripts/json/configarr.json

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -23,7 +23,7 @@
2323
"ram": 512,
2424
"hdd": 4,
2525
"os": "Debian",
26-
"version": "12"
26+
"version": "13"
2727
}
2828
}
2929
],

scripts/json/docmost.json

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -23,7 +23,7 @@
2323
"ram": 4096,
2424
"hdd": 8,
2525
"os": "debian",
26-
"version": "12"
26+
"version": "13"
2727
}
2828
}
2929
],

scripts/json/guardian.json

Lines changed: 35 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,35 @@
1+
{
2+
"name": "Guardian",
3+
"slug": "guardian",
4+
"categories": [
5+
13
6+
],
7+
"date_created": "2025-10-15",
8+
"type": "ct",
9+
"updateable": true,
10+
"privileged": false,
11+
"interface_port": 3000,
12+
"documentation": "https://github.com/HydroshieldMKII/Guardian/blob/main/README.md",
13+
"config_path": "/opt/guardian/.env",
14+
"website": "https://github.com/HydroshieldMKII/Guardian",
15+
"logo": null,
16+
"description": "Guardian is a lightweight companion app for Plex that lets you monitor, approve or block devices in real time. It helps you enforce per-user or global policies, stop unwanted sessions automatically and grant temporary access - all through a simple web interface.",
17+
"install_methods": [
18+
{
19+
"type": "default",
20+
"script": "ct/guardian.sh",
21+
"resources": {
22+
"cpu": 2,
23+
"ram": 2048,
24+
"hdd": 6,
25+
"os": "Debian",
26+
"version": "13"
27+
}
28+
}
29+
],
30+
"default_credentials": {
31+
"username": null,
32+
"password": null
33+
},
34+
"notes": []
35+
}

scripts/json/komga.json

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -23,7 +23,7 @@
2323
"ram": 2048,
2424
"hdd": 4,
2525
"os": "debian",
26-
"version": "12"
26+
"version": "13"
2727
}
2828
}
2929
],

scripts/json/lazylibrarian.json

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -23,7 +23,7 @@
2323
"ram": 1024,
2424
"hdd": 4,
2525
"os": "debian",
26-
"version": "12"
26+
"version": "13"
2727
}
2828
}
2929
],

scripts/json/leantime.json

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -23,7 +23,7 @@
2323
"ram": 2048,
2424
"hdd": 20,
2525
"os": "Debian",
26-
"version": "12"
26+
"version": "13"
2727
}
2828
}
2929
],

scripts/json/librespeed-rust.json

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -23,7 +23,7 @@
2323
"ram": 512,
2424
"hdd": 4,
2525
"os": "Debian",
26-
"version": "12"
26+
"version": "13"
2727
}
2828
}
2929
],

scripts/json/libretranslate.json

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -23,7 +23,7 @@
2323
"ram": 2048,
2424
"hdd": 20,
2525
"os": "debian",
26-
"version": "12"
26+
"version": "13"
2727
}
2828
}
2929
],

scripts/json/lidarr.json

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -23,7 +23,7 @@
2323
"ram": 1024,
2424
"hdd": 4,
2525
"os": "debian",
26-
"version": "12"
26+
"version": "13"
2727
}
2828
}
2929
],

scripts/json/limesurvey.json

Lines changed: 40 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,40 @@
1+
{
2+
"name": "LimeSurvey",
3+
"slug": "limesurvey",
4+
"categories": [
5+
25
6+
],
7+
"date_created": "2025-10-15",
8+
"type": "ct",
9+
"updateable": true,
10+
"privileged": false,
11+
"interface_port": 80,
12+
"documentation": "https://www.limesurvey.org/manual/LimeSurvey_Manual",
13+
"config_path": "",
14+
"website": "https://community.limesurvey.org/",
15+
"logo": "https://cdn.jsdelivr.net/gh/selfhst/icons/webp/limesurvey.webp",
16+
"description": "LimeSurvey is the simple, quick and anonymous online survey tool that's bursting with juicy insights. Calling students, professionals and enterprises: design a survey and get the best insights, it’s free and as easy as squeezing a lime. Make a free online survey now!",
17+
"install_methods": [
18+
{
19+
"type": "default",
20+
"script": "ct/limesurvey.sh",
21+
"resources": {
22+
"cpu": 1,
23+
"ram": 512,
24+
"hdd": 2,
25+
"os": "Debian",
26+
"version": "13"
27+
}
28+
}
29+
],
30+
"default_credentials": {
31+
"username": null,
32+
"password": null
33+
},
34+
"notes": [
35+
{
36+
"text": "You will need to input database credentials into LimeSurvey installer. Use `cat ~/limesurvey.creds` inside LXC.",
37+
"type": "info"
38+
}
39+
]
40+
}

0 commit comments

Comments
 (0)