Refactor frontend system primitives and surfaces
This commit is contained in:
@@ -203,7 +203,7 @@ export function SiteSettingsForm({
|
||||
</CardHeader>
|
||||
<CardContent className="grid gap-4 lg:grid-cols-3">
|
||||
{localeFields.map((locale) => (
|
||||
<div key={locale.key} className="space-y-4 rounded-lg border bg-card p-4 shadow-sm">
|
||||
<AppCard key={locale.key} padding="sm" className="space-y-4 rounded-nested">
|
||||
<div>
|
||||
<p className="text-sm font-medium text-foreground">{locale.label}</p>
|
||||
<p className="mt-1 text-xs text-muted-foreground">Globale Standardwerte fuer diese Sprache.</p>
|
||||
@@ -312,7 +312,7 @@ export function SiteSettingsForm({
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</AppCard>
|
||||
))}
|
||||
</CardContent>
|
||||
</AppCard>
|
||||
@@ -429,7 +429,7 @@ export function SiteSettingsForm({
|
||||
: `${locale.sampleTitle} | ${localeSettings.siteName}`;
|
||||
|
||||
return (
|
||||
<div key={locale.key} className="rounded-md border bg-card p-3">
|
||||
<AppCard key={locale.key} className="rounded-nested p-3">
|
||||
<p className="font-medium text-foreground">{locale.label}</p>
|
||||
<p className="mt-2 text-xs text-muted-foreground">
|
||||
Example page title: {locale.sampleTitle}
|
||||
@@ -441,7 +441,7 @@ export function SiteSettingsForm({
|
||||
<p className="mt-2 text-xs text-muted-foreground">
|
||||
{localeSettings.subhead || "No subhead"}
|
||||
</p>
|
||||
</div>
|
||||
</AppCard>
|
||||
);
|
||||
})}
|
||||
</div>
|
||||
@@ -451,7 +451,7 @@ export function SiteSettingsForm({
|
||||
Header Logo Preview
|
||||
</div>
|
||||
<div className="grid gap-3">
|
||||
<div className="rounded-md border bg-card p-4">
|
||||
<AppCard padding="sm" className="rounded-nested">
|
||||
<p className="mb-3 text-xs font-medium uppercase tracking-[0.2em] text-muted-foreground">
|
||||
Light
|
||||
</p>
|
||||
@@ -466,8 +466,8 @@ export function SiteSettingsForm({
|
||||
Default light logo will be used
|
||||
</div>
|
||||
)}
|
||||
</div>
|
||||
<div className="rounded-md border border-border/70 bg-slate-950 p-4">
|
||||
</AppCard>
|
||||
<div className="rounded-nested border border-border/70 bg-slate-950 p-4">
|
||||
<p className="mb-3 text-xs font-medium uppercase tracking-[0.2em] text-white/55">
|
||||
Dark
|
||||
</p>
|
||||
@@ -489,7 +489,7 @@ export function SiteSettingsForm({
|
||||
<Search className="h-4 w-4 text-brand-primary" />
|
||||
Search Preview
|
||||
</div>
|
||||
<div className="rounded-md border bg-card p-4">
|
||||
<AppCard padding="sm" className="rounded-nested">
|
||||
<div className="flex items-center gap-3">
|
||||
{faviconPreviewUrl ? (
|
||||
<img src={faviconPreviewUrl} alt="Favicon" className="h-5 w-5 rounded-sm" />
|
||||
@@ -512,13 +512,13 @@ export function SiteSettingsForm({
|
||||
<p className="mt-2 text-xs text-muted-foreground/80">
|
||||
{settings.locales.de.subhead || "No subhead"}
|
||||
</p>
|
||||
</div>
|
||||
</AppCard>
|
||||
|
||||
<div className="flex items-center gap-2 text-sm font-medium text-foreground">
|
||||
<ImageIcon className="h-4 w-4 text-brand-secondary" />
|
||||
Social Preview
|
||||
</div>
|
||||
<div className="overflow-hidden rounded-md border bg-card">
|
||||
<AppCard className="overflow-hidden rounded-nested">
|
||||
{defaultOgImagePreviewUrl ? (
|
||||
<img src={defaultOgImagePreviewUrl} alt="Default OG" className="h-32 w-full object-cover" />
|
||||
) : (
|
||||
@@ -538,7 +538,7 @@ export function SiteSettingsForm({
|
||||
{settings.locales.en.siteDescription || "No description"}
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
</AppCard>
|
||||
</CardContent>
|
||||
</AppCard>
|
||||
</div>
|
||||
|
||||
Reference in New Issue
Block a user