Initial open-source self-hosted Songs2YT edition

2026-07-17 02:23:59 +02:00
commit 2aa8a84781
134 changed files with 17758 additions and 0 deletions
@@ -0,0 +1,62 @@
+import Link from "next/link";
+import type { ReactNode } from "react";
+import { Logo } from "@/components/Logo";
+import { LEGAL_LAST_UPDATED } from "@/lib/legal/constants";
+
+type Props = {
+  title: string;
+  description?: string;
+  children: ReactNode;
+};
+
+export function LegalPageLayout({ title, description, children }: Props) {
+  return (
+    <div className="min-h-screen bg-surface-dark">
+      <header className="border-b border-gray-800 bg-black/30">
+        <div className="mx-auto flex max-w-3xl items-center justify-between px-6 py-6">
+          <Logo />
+          <Link
+            href="/"
+            className="text-sm text-gray-400 transition-colors duration-300 hover:text-white"
+          >
+            ← Back to home
+          </Link>
+        </div>
+      </header>
+
+      <main className="mx-auto max-w-3xl px-6 py-12">
+        <p className="mb-2 text-xs uppercase tracking-wider text-gray-500">
+          Last updated: {LEGAL_LAST_UPDATED}
+        </p>
+        <h1 className="mb-3 text-3xl font-bold text-white">{title}</h1>
+        {description && <p className="mb-10 text-gray-400">{description}</p>}
+
+        <article className="prose prose-invert prose-gray max-w-none prose-headings:font-semibold prose-headings:text-white prose-p:text-gray-300 prose-li:text-gray-300 prose-strong:text-gray-200 prose-a:text-accent prose-a:no-underline hover:prose-a:underline">
+          {children}
+        </article>
+      </main>
+
+      <footer className="border-t border-gray-800 py-8 text-center text-xs text-gray-500">
+        <div className="flex flex-wrap items-center justify-center gap-4">
+          <Link href="/privacy" className="hover:text-gray-300">
+            Privacy
+          </Link>
+          <Link href="/terms" className="hover:text-gray-300">
+            Terms
+          </Link>
+          <Link href="/refund" className="hover:text-gray-300">
+            Refund
+          </Link>
+          <a
+            href="https://status.atakanozban.com/status/2"
+            target="_blank"
+            rel="noopener noreferrer"
+            className="hover:text-gray-300"
+          >
+            Service Status
+          </a>
+        </div>
+      </footer>
+    </div>
+  );
+}