redesign the homepage

2026-06-26 16:27:21 -04:00
parent 256ff0814e
commit d7fb7b7a7b
1030 changed files with 107374 additions and 2657 deletions
@@ -0,0 +1,96 @@
+'use client'
+
+import { localizedPath, type Locale } from '@/lib/localization/config'
+import Image from 'next/image'
+import type { ReactNode } from 'react'
+
+interface AuthShellProps {
+  locale: Locale
+  title: string
+  subtitle?: string
+  children: ReactNode
+}
+
+export function AuthShell({ locale, title, subtitle, children }: AuthShellProps) {
+  return (
+    <main
+      id="main-content"
+      tabIndex={-1}
+      style={{
+        display: 'flex',
+        flex: 1,
+        alignItems: 'center',
+        justifyContent: 'center',
+        padding: '2rem 1rem',
+        minHeight: 'calc(100vh - 80px)',
+      }}
+    >
+      <div style={{ width: '100%', maxWidth: '28rem' }}>
+        <div style={{ marginBottom: '2rem', textAlign: 'center' }}>
+          <a href={localizedPath('home', locale)}>
+            <Image
+              src="/rentaldrivego.jpeg"
+              alt="RentalDriveGo"
+              width={96}
+              height={96}
+              priority
+              style={{
+                borderRadius: '1.5rem',
+                border: '1px solid var(--color-border)',
+                background: 'var(--color-surface)',
+                padding: '0.375rem',
+                boxShadow: '0 1px 3px rgba(0,0,0,0.08)',
+              }}
+            />
+          </a>
+          <p
+            style={{
+              marginTop: '1rem',
+              fontSize: '0.75rem',
+              fontWeight: 700,
+              textTransform: 'uppercase',
+              letterSpacing: '0.28em',
+              color: 'var(--color-accent)',
+            }}
+          >
+            RentalDriveGo
+          </p>
+          <h1
+            style={{
+              marginTop: '0.5rem',
+              fontSize: '1.75rem',
+              fontWeight: 800,
+              letterSpacing: '-0.03em',
+              color: 'var(--color-heading)',
+            }}
+          >
+            {title}
+          </h1>
+          {subtitle ? (
+            <p
+              style={{
+                marginTop: '0.5rem',
+                fontSize: '0.875rem',
+                color: 'var(--color-text-secondary)',
+              }}
+            >
+              {subtitle}
+            </p>
+          ) : null}
+        </div>
+
+        <section
+          style={{
+            borderRadius: '2rem',
+            border: '1px solid var(--color-border)',
+            background: 'var(--color-surface)',
+            padding: '2rem',
+            boxShadow: '0 30px 80px rgba(28,25,23,0.06)',
+          }}
+        >
+          {children}
+        </section>
+      </div>
+    </main>
+  )
+}