style: align both card systems to shared design tokens
Unify the public site by making SectionCard and the verify status card use the same --radius-lg / --shadow-card tokens and primary-tint header as the existing CSS .content-card used by all content pages. This makes the entire (site) group visually consistent without rewriting every page, and keeps the shadcn Card in components/ui/card.tsx (used by admin) intact.
This commit is contained in:
1 parent
b3340dbfdf
commit
a3e3356ea7
4 files changed
+6
-10
No files matched your search
@@ -129,8 +129,7 @@ export default async function LoginPage() {
|
|||||||
borderColor:
|
borderColor:
|
||||||
"color-mix(in srgb, var(--color-primary) 20%, transparent)",
|
"color-mix(in srgb, var(--color-primary) 20%, transparent)",
|
||||||
background: `url(/assets/images/background.png) center/cover no-repeat`,
|
background: `url(/assets/images/background.png) center/cover no-repeat`,
|
||||||
boxShadow:
|
boxShadow: "var(--shadow-card)",
|
||||||
"0 1px 2px color-mix(in srgb, var(--color-text-muted) 12%, transparent), 0 8px 24px -12px color-mix(in srgb, var(--color-text-muted) 25%, transparent)",
|
|
||||||
}}
|
}}
|
||||||
>
|
>
|
||||||
<div
|
<div
|
||||||
|
|||||||
@@ -131,8 +131,7 @@ export default async function RegisterPage() {
|
|||||||
borderColor:
|
borderColor:
|
||||||
"color-mix(in srgb, var(--color-primary) 20%, transparent)",
|
"color-mix(in srgb, var(--color-primary) 20%, transparent)",
|
||||||
background: `url(/assets/images/background.png) center/cover no-repeat`,
|
background: `url(/assets/images/background.png) center/cover no-repeat`,
|
||||||
boxShadow:
|
boxShadow: "var(--shadow-card)",
|
||||||
"0 1px 2px color-mix(in srgb, var(--color-text-muted) 12%, transparent), 0 8px 24px -12px color-mix(in srgb, var(--color-text-muted) 25%, transparent)",
|
|
||||||
}}
|
}}
|
||||||
>
|
>
|
||||||
<div
|
<div
|
||||||
|
|||||||
@@ -36,8 +36,7 @@ function StatusCard({
|
|||||||
borderColor:
|
borderColor:
|
||||||
"color-mix(in srgb, var(--color-text-muted) 12%, transparent)",
|
"color-mix(in srgb, var(--color-text-muted) 12%, transparent)",
|
||||||
backgroundColor: "var(--color-surface)",
|
backgroundColor: "var(--color-surface)",
|
||||||
boxShadow:
|
boxShadow: "var(--shadow-card)",
|
||||||
"0 1px 2px color-mix(in srgb, var(--color-text-muted) 12%, transparent), 0 8px 24px -12px color-mix(in srgb, var(--color-text-muted) 25%, transparent)",
|
|
||||||
}}
|
}}
|
||||||
>
|
>
|
||||||
<div
|
<div
|
||||||
|
|||||||
@@ -34,17 +34,16 @@ export function SectionCard({
|
|||||||
style={{
|
style={{
|
||||||
borderColor:
|
borderColor:
|
||||||
"color-mix(in srgb, var(--color-text-muted) 12%, transparent)",
|
"color-mix(in srgb, var(--color-text-muted) 12%, transparent)",
|
||||||
boxShadow:
|
boxShadow: "var(--shadow-card)",
|
||||||
"0 1px 2px color-mix(in srgb, var(--color-text-muted) 12%, transparent), 0 8px 24px -12px color-mix(in srgb, var(--color-text-muted) 25%, transparent)",
|
|
||||||
}}
|
}}
|
||||||
>
|
>
|
||||||
<div
|
<div
|
||||||
className="flex items-center justify-between gap-3 border-b px-5 py-3.5"
|
className="flex items-center justify-between gap-3 border-b px-5 py-3.5"
|
||||||
style={{
|
style={{
|
||||||
borderColor:
|
borderColor:
|
||||||
"color-mix(in srgb, var(--color-text-muted) 10%, transparent)",
|
"color-mix(in srgb, var(--color-text-muted) 8%, transparent)",
|
||||||
background:
|
background:
|
||||||
"color-mix(in srgb, var(--color-text-muted) 4%, transparent)",
|
"color-mix(in srgb, var(--color-primary) 10%, var(--color-surface))",
|
||||||
}}
|
}}
|
||||||
>
|
>
|
||||||
<div className="flex items-center gap-2.5">
|
<div className="flex items-center gap-2.5">
|
||||||
|
|||||||
Reference in new issue
Block a user