This commit is contained in:
2026-03-14 22:21:31 -05:00
parent 2cf6bf858d
commit 6589581908
18 changed files with 197 additions and 196 deletions

View File

@@ -92,7 +92,7 @@ export function CompanySettingsPage() {
}, [logoUrl]);
if (!form || !token) {
return <div className="rounded-[28px] border border-line/70 bg-surface/90 p-6 text-sm text-muted shadow-panel">{status}</div>;
return <div className="rounded-[28px] border border-line/70 bg-surface/90 p-4 text-sm text-muted shadow-panel">{status}</div>;
}
async function handleSave(event: React.FormEvent<HTMLFormElement>) {
@@ -145,11 +145,11 @@ export function CompanySettingsPage() {
return (
<form className="space-y-6" onSubmit={handleSave}>
<section className="rounded-[28px] border border-line/70 bg-surface/90 p-6 shadow-panel backdrop-blur 2xl:p-7">
<section className="rounded-[28px] border border-line/70 bg-surface/90 p-4 shadow-panel backdrop-blur 2xl:p-5">
<div className="flex flex-col gap-6 lg:flex-row lg:items-start lg:justify-between">
<div>
<p className="text-xs font-semibold uppercase tracking-[0.24em] text-muted">Company Profile</p>
<h3 className="mt-3 text-xl font-bold text-text">Branding and legal identity</h3>
<h3 className="mt-2 text-lg font-bold text-text">Branding and legal identity</h3>
<p className="mt-2 max-w-2xl text-sm text-muted">Every internal document and PDF template will inherit its company identity from this profile.</p>
</div>
<div className="rounded-3xl border border-dashed border-line/70 bg-page/80 p-4">
@@ -186,33 +186,33 @@ export function CompanySettingsPage() {
))}
</div>
</section>
<section className="rounded-[28px] border border-line/70 bg-surface/90 p-6 shadow-panel backdrop-blur 2xl:p-7">
<section className="rounded-[28px] border border-line/70 bg-surface/90 p-4 shadow-panel backdrop-blur 2xl:p-5">
<p className="text-xs font-semibold uppercase tracking-[0.24em] text-muted">Theme</p>
<div className="mt-5 grid gap-4 md:grid-cols-2 2xl:grid-cols-4">
<label className="block">
<span className="mb-2 block text-sm font-semibold text-text">Primary color</span>
<input type="color" value={form.theme.primaryColor} onChange={(event) => updateField("theme", { ...form.theme, primaryColor: event.target.value })} className="h-12 w-full rounded-2xl border border-line/70 bg-page p-2" />
<input type="color" value={form.theme.primaryColor} onChange={(event) => updateField("theme", { ...form.theme, primaryColor: event.target.value })} className="h-10 w-full rounded-2xl border border-line/70 bg-page p-2" />
</label>
<label className="block">
<span className="mb-2 block text-sm font-semibold text-text">Accent color</span>
<input type="color" value={form.theme.accentColor} onChange={(event) => updateField("theme", { ...form.theme, accentColor: event.target.value })} className="h-12 w-full rounded-2xl border border-line/70 bg-page p-2" />
<input type="color" value={form.theme.accentColor} onChange={(event) => updateField("theme", { ...form.theme, accentColor: event.target.value })} className="h-10 w-full rounded-2xl border border-line/70 bg-page p-2" />
</label>
<label className="block">
<span className="mb-2 block text-sm font-semibold text-text">Surface color</span>
<input type="color" value={form.theme.surfaceColor} onChange={(event) => updateField("theme", { ...form.theme, surfaceColor: event.target.value })} className="h-12 w-full rounded-2xl border border-line/70 bg-page p-2" />
<input type="color" value={form.theme.surfaceColor} onChange={(event) => updateField("theme", { ...form.theme, surfaceColor: event.target.value })} className="h-10 w-full rounded-2xl border border-line/70 bg-page p-2" />
</label>
<label className="block">
<span className="mb-2 block text-sm font-semibold text-text">Font family</span>
<input value={form.theme.fontFamily} onChange={(event) => updateField("theme", { ...form.theme, fontFamily: event.target.value })} className="w-full rounded-2xl border border-line/70 bg-page px-2 py-2 text-text outline-none transition focus:border-brand" />
</label>
</div>
<div className="mt-5 flex flex-col gap-3 rounded-2xl border border-line/70 bg-page/70 px-4 py-4 lg:flex-row lg:items-center lg:justify-between">
<div className="mt-5 flex flex-col gap-3 rounded-2xl border border-line/70 bg-page/70 px-2 py-2 lg:flex-row lg:items-center lg:justify-between">
<span className="min-w-0 text-sm text-muted">{status}</span>
<div className="flex flex-wrap gap-3">
<button
type="button"
onClick={handlePdfPreview}
className="rounded-2xl border border-line/70 px-4 py-3 text-sm font-semibold text-text"
className="rounded-2xl border border-line/70 px-2 py-2 text-sm font-semibold text-text"
>
Preview PDF
</button>