Skip to content

Commit 2e7de34

Browse files
najdeknajdek
committed
frontend: update SettingsView layout to responsive grid and improve UI consistency
1 parent 10c4233 commit 2e7de34

1 file changed

Lines changed: 6 additions & 11 deletions

File tree

‎frontend/src/components/views/SettingsView.jsx‎

Lines changed: 6 additions & 11 deletions
Original file line numberDiff line numberDiff line change
@@ -8,7 +8,7 @@ const SettingsView = ({ config, onSaveConfig, isPS5, logs, setLogs, showLogs, se
88
const autoloadDelay = config.AUTOLOAD_DELAY || 5
99

1010
const SettingRow = ({ title, description, children, icon: Icon }) => (
11-
<div className="flex items-center justify-between p-8 bg-white/[0.03] rounded-3xl border border-white/10 hover:border-ps-blue/30 transition-all group">
11+
<div className="flex items-center justify-between p-8 bg-white/[0.03] rounded-3xl border border-white/10 hover:border-ps-blue/30 transition-all group h-full">
1212
<div className="flex items-center space-x-6">
1313
{Icon && (
1414
<div className="p-4 bg-white/5 rounded-2xl group-hover:bg-ps-blue/10 transition-colors">
@@ -27,7 +27,7 @@ const SettingsView = ({ config, onSaveConfig, isPS5, logs, setLogs, showLogs, se
2727
)
2828

2929
return (
30-
<div className="max-w-5xl space-y-16 pb-20">
30+
<div className="max-w-5xl mx-auto space-y-16 pb-20">
3131
<div className="space-y-4">
3232
<h2 className="text-4xl font-extrabold text-white tracking-tight">
3333
Settings
@@ -36,12 +36,7 @@ const SettingsView = ({ config, onSaveConfig, isPS5, logs, setLogs, showLogs, se
3636

3737
{/* Startup Settings */}
3838
<section className="space-y-8">
39-
<h3 className="label-caps !text-ps-blue !opacity-100 flex items-center space-x-4 text-xl tracking-[0.2em]">
40-
<Zap className="w-6 h-6" />
41-
<span>Startup & Automation</span>
42-
</h3>
43-
44-
<div className="space-y-4">
39+
<div className="grid grid-cols-1 xl:grid-cols-2 gap-6">
4540
<SettingRow
4641
title="Auto-open Browser"
4742
description="Automatically launch the browser when Payload Manager payload is executed."
@@ -114,7 +109,7 @@ const SettingsView = ({ config, onSaveConfig, isPS5, logs, setLogs, showLogs, se
114109
</button>
115110
</SettingRow>
116111

117-
<div className="p-8 bg-white/[0.03] rounded-3xl border border-white/10 space-y-8">
112+
<div className="flex flex-col justify-between p-8 bg-white/[0.03] rounded-3xl border border-white/10 space-y-8 h-full">
118113
<div className="flex justify-between items-center">
119114
<div className="space-y-1">
120115
<p className="font-bold text-white uppercase text-lg tracking-tight">Autoload Delay</p>
@@ -147,7 +142,7 @@ const SettingsView = ({ config, onSaveConfig, isPS5, logs, setLogs, showLogs, se
147142
<section className="space-y-8">
148143
<h3 className="label-caps !text-ps-blue !opacity-100 flex items-center space-x-4 text-xl tracking-[0.2em]">
149144
<Terminal className="w-6 h-6" />
150-
<span>System Diagnostics</span>
145+
<span>Diagnostics</span>
151146
</h3>
152147

153148
<button
@@ -160,7 +155,7 @@ const SettingsView = ({ config, onSaveConfig, isPS5, logs, setLogs, showLogs, se
160155
</div>
161156
<div className="space-y-1">
162157
<p className="font-bold text-white uppercase text-lg tracking-tight">Open Log Viewer</p>
163-
<p className="text-sm text-zinc-500 max-w-md">Access real-time debug output from the background daemon.</p>
158+
<p className="text-sm text-zinc-500 max-w-md">Access real-time debug output from the Payload Manager daemon.</p>
164159
</div>
165160
</div>
166161
<ChevronRight className="w-8 h-8 text-zinc-700 group-hover:text-ps-blue group-hover:translate-x-2 transition-all" />

0 commit comments

Comments
 (0)