Move coming-soon storefront into website Next.js app.

Co-authored-by: Cursor <cursoragent@cursor.com>
2026-09-07 21:00:21 +03:30
parent e171222b16
commit 2f857f1a90
22 changed files with 7427 additions and 1 deletions
@@ -0,0 +1,81 @@
+import Image from "next/image";
+import ManaLogo from "@/components/ui/ManaLogo";
+
+const STORE_LOGIN =
+  process.env.NEXT_PUBLIC_STORE_URL?.replace(/\/$/, "") ||
+  "http://store.mana-collection.com:3001";
+
+export default function HomePage() {
+  return (
+    <main className="coming-soon relative min-h-dvh overflow-hidden bg-[#f7f7f5] text-ink">
+      {/* dir=ltr keeps content on visual left, image on visual right */}
+      <div dir="ltr" className="grid min-h-dvh grid-cols-1 lg:grid-cols-2">
+        {/* Content — left */}
+        <section className="relative order-2 flex min-h-[52dvh] flex-col lg:order-1 lg:min-h-dvh">
+          <div className="mana-canvas absolute inset-0" aria-hidden />
+
+          <div
+            dir="rtl"
+            className="relative z-10 flex flex-1 flex-col px-7 py-8 sm:px-12 sm:py-10 lg:px-16 lg:py-14"
+          >
+            <header className="coming-soon-seq coming-soon-seq-1 flex shrink-0 justify-center">
+              <ManaLogo
+                href=""
+                width={400}
+                priority
+                showTagline
+                variant="white"
+                blackBg
+                className="w-[400px] max-w-[min(400px,100%)]"
+              />
+            </header>
+
+            <div className="flex flex-1 flex-col items-center justify-center py-12 text-center sm:py-16">
+              <div className="max-w-md">
+                <p
+                  dir="ltr"
+                  className="coming-soon-seq coming-soon-seq-2 mb-4 font-display text-sm tracking-[0.2em] text-muted sm:text-base"
+                >
+                  Coming soon
+                </p>
+                <h1 className="coming-soon-seq coming-soon-seq-3 mb-5 text-4xl leading-tight text-ink sm:text-5xl">
+                  به‌زودی
+                </h1>
+                <p className="coming-soon-seq coming-soon-seq-4 text-sm leading-8 text-muted sm:text-base sm:leading-8">
+                  در این آدرس میزبان شما خواهیم بود.
+                </p>
+              </div>
+            </div>
+
+            <footer className="coming-soon-seq coming-soon-seq-5 shrink-0 pt-6">
+              <div className="flex flex-wrap items-center justify-between gap-4">
+                <p className="text-xs leading-6 text-muted">
+                  حساب دارید؟ وارد شوید.
+                </p>
+                <a
+                  href={`${STORE_LOGIN}/login`}
+                  className="coming-soon-login inline-flex items-center justify-center border border-ink bg-ink px-7 py-2.5 text-sm text-white transition-colors hover:bg-white hover:text-ink"
+                >
+                  ورود
+                </a>
+              </div>
+            </footer>
+          </div>
+        </section>
+
+        {/* Image — right */}
+        <aside className="coming-soon-seq-image relative order-1 min-h-[42dvh] overflow-hidden lg:order-2 lg:min-h-dvh">
+          <Image
+            src="/images/image1.jpg"
+            alt="مانا کالکشن"
+            fill
+            priority
+            sizes="(max-width: 1024px) 100vw, 50vw"
+            className="coming-soon-image object-cover object-center"
+          />
+          <div className="pointer-events-none absolute inset-0 bg-gradient-to-l from-transparent via-transparent to-black/10" />
+        </aside>
+      </div>
+    </main>
+  );
+}