refactor: enhance admin panel styling with better card patterns

- Dashboard: use admin-card for sections, refine progress bars and action badges
- Applications: enhanced card styling with p-3 and better text hierarchy
- Emulator: convert remaining 'card' classes to 'admin-card'
- All changes eliminate inline styles and use consistent Tailwind patterns

Co-authored-by: openhands <[email protected]>
This commit is contained in:
openhands committed 2026-07-02 16:27:06 +02:00
1 parent 928544100b
commit 72ef74fc87
4 files changed
+39 -43

No files matched your search

+14 -16
View File
@@ -47,24 +47,23 @@ export default async function AdminEmulator() {
</div>
<section className="mt-6">
<h2>Settings</h2>
<h2 className="admin-section-title">Settings</h2>
<p className="muted" style={{ marginTop: "-0.4rem" }}>
{settings.length} keys.
</p>
<form
action={updateEmulatorSetting}
className="card"
style={{ marginBottom: "1.5rem" }}
className="admin-card mb-6"
>
<h3 style={{ marginTop: 0 }}>Add / overwrite setting</h3>
<div style={{ display: "flex", gap: "0.5rem", flexWrap: "wrap" }}>
<h3 className="text-sm font-bold text-[var(--color-text)] m-0 mb-3">Add / overwrite setting</h3>
<div className="flex gap-2 flex-wrap">
<input name="key" placeholder="key" maxLength={100} required />
<input
name="value"
placeholder="value"
maxLength={512}
style={{ flex: 1, minWidth: 200 }}
className="flex-1 min-w-[200px]"
/>
<button type="submit" className="btn btn-primary">
Save
@@ -112,24 +111,23 @@ export default async function AdminEmulator() {
</section>
<section className="mt-6">
<h2>Texts</h2>
<h2 className="admin-section-title">Texts</h2>
<p className="muted" style={{ marginTop: "-0.4rem" }}>
{textsCount} keys{textsTruncated ? ` (showing first ${texts.length})` : ""}.
</p>
<form
action={updateEmulatorText}
className="card"
style={{ marginBottom: "1.5rem" }}
className="admin-card mb-6"
>
<h3 style={{ marginTop: 0 }}>Add / overwrite text</h3>
<div style={{ display: "flex", gap: "0.5rem", flexWrap: "wrap" }}>
<h3 className="text-sm font-bold text-[var(--color-text)] m-0 mb-3">Add / overwrite text</h3>
<div className="flex gap-2 flex-wrap">
<input name="key" placeholder="key" maxLength={100} required />
<input
name="value"
placeholder="value"
maxLength={4096}
style={{ flex: 1, minWidth: 200 }}
className="flex-1 min-w-[200px]"
/>
<button type="submit" className="btn btn-primary">
Save
@@ -140,7 +138,7 @@ export default async function AdminEmulator() {
<table>
<thead>
<tr>
<th style={{ width: 320 }}>Key</th>
<th className="w-[320px]">Key</th>
<th>Value</th>
</tr>
</thead>
@@ -153,14 +151,14 @@ export default async function AdminEmulator() {
<td>
<form
action={updateEmulatorText}
style={{ display: "flex", gap: "0.5rem" }}
className="flex gap-2"
>
<input type="hidden" name="key" value={t.key} />
<input
name="value"
defaultValue={t.value}
maxLength={4096}
style={{ flex: 1 }}
className="flex-1"
/>
<button type="submit" className="btn btn-outline">
Save
@@ -172,7 +170,7 @@ export default async function AdminEmulator() {
</tbody>
</table>
{texts.length === 0 ? (
<p className="muted">No emulator texts found.</p>
<div className="admin-empty">No emulator texts found.</div>
) : null}
{textsTruncated ? (
<p className="muted">