This commit is contained in:
Raven Scott
2026-05-29 13:26:03 -04:00
parent 1e519b66db
commit b21830d57a
3 changed files with 26 additions and 72 deletions
+5 -51
View File
@@ -85,12 +85,7 @@ body {
gap: 1.125rem;
font-size: 1.0625rem;
line-height: 1.75;
color: rgb(3 7 18);
}
[data-legal-page] .dark .legal-prose,
.dark [data-legal-page] .legal-prose {
color: rgb(243 244 246);
color: rgb(229 231 235);
}
[data-legal-page] .legal-prose > h2 {
@@ -99,7 +94,7 @@ body {
font-size: 1.5rem;
font-weight: 700;
letter-spacing: -0.025em;
color: rgb(3 7 18);
color: rgb(255 255 255);
}
[data-legal-page] .legal-prose > h2:first-child {
@@ -110,21 +105,11 @@ body {
margin-top: 0;
}
[data-legal-page] .dark .legal-prose > h2,
.dark [data-legal-page] .legal-prose > h2 {
color: rgb(255 255 255);
}
[data-legal-page] .legal-prose > h3 {
margin-top: 1.5rem;
margin-bottom: 0.5rem;
font-size: 1.25rem;
font-weight: 600;
color: rgb(3 7 18);
}
[data-legal-page] .dark .legal-prose > h3,
.dark [data-legal-page] .legal-prose > h3 {
color: rgb(255 255 255);
}
@@ -137,33 +122,18 @@ body {
[data-legal-page] .legal-prose a {
font-weight: 500;
color: rgb(29 78 216);
color: rgb(147 197 253);
text-decoration: underline;
text-underline-offset: 3px;
transition: color 0.15s ease;
}
[data-legal-page] .legal-prose a:hover {
color: rgb(30 64 175);
}
[data-legal-page] .dark .legal-prose a,
.dark [data-legal-page] .legal-prose a {
color: rgb(147 197 253);
}
[data-legal-page] .dark .legal-prose a:hover,
.dark [data-legal-page] .legal-prose a:hover {
color: rgb(191 219 254);
}
[data-legal-page] .legal-prose strong {
font-weight: 600;
color: rgb(3 7 18);
}
[data-legal-page] .dark .legal-prose strong,
.dark [data-legal-page] .legal-prose strong {
color: rgb(255 255 255);
}
@@ -190,11 +160,6 @@ body {
width: 0.375rem;
height: 0.375rem;
border-radius: 9999px;
background-color: rgb(37 99 235);
}
[data-legal-page] .dark .legal-prose ul > li::before,
.dark [data-legal-page] .legal-prose ul > li::before {
background-color: rgb(96 165 250);
}
@@ -212,13 +177,8 @@ body {
left: 0;
font-weight: 600;
font-size: 0.875rem;
color: rgb(29 78 216);
font-variant-numeric: tabular-nums;
}
[data-legal-page] .dark .legal-prose ol > li::before,
.dark [data-legal-page] .legal-prose ol > li::before {
color: rgb(147 197 253);
font-variant-numeric: tabular-nums;
}
[data-legal-page] .legal-prose li > ul,
@@ -240,13 +200,7 @@ body {
padding: 1rem 1.25rem;
border-radius: 0.5rem;
background-color: rgb(239 246 255);
color: rgb(30 58 138);
color: rgb(229 231 235);
font-size: 0.9375rem;
}
[data-legal-page] .dark .legal-prose blockquote,
.dark [data-legal-page] .legal-prose blockquote {
background-color: rgb(30 58 138 / 0.25);
color: rgb(191 219 254);
}
}
+8 -8
View File
@@ -30,22 +30,22 @@ export default function LegalHubPage() {
<div className="min-h-screen bg-[#111829]" data-legal-page>
<section
data-legal-hero
className="py-20 bg-gradient-to-b from-blue-50 to-white dark:from-gray-900 dark:to-gray-800 text-gray-950 dark:text-gray-100"
className="py-20 bg-gradient-to-b from-blue-50 to-white dark:from-gray-900 dark:to-gray-800 text-white"
>
<div className="max-w-4xl mx-auto px-4 sm:px-6 lg:px-8">
<h1 className="text-4xl sm:text-5xl font-bold text-gray-900 dark:text-white mb-6">
<h1 className="text-4xl sm:text-5xl font-bold text-white mb-6">
Legal
</h1>
<p className="text-xl text-gray-800 dark:text-gray-200">
<p className="text-xl text-gray-200">
Policies and agreements for the P2NS open-source project and this website.
</p>
<p className="mt-4 text-sm text-gray-700 dark:text-gray-300">
<p className="mt-4 text-sm text-gray-300">
Last updated {LEGAL_LAST_UPDATED}
</p>
</div>
</section>
<section data-legal-content className="py-20 bg-white dark:bg-gray-900 text-gray-950 dark:text-gray-100">
<section data-legal-content className="py-20 bg-white dark:bg-gray-900 text-white">
<div className="max-w-6xl mx-auto px-4 sm:px-6 lg:px-8">
<div className="grid md:grid-cols-2 lg:grid-cols-3 gap-6">
{legalDocuments.map((doc) => {
@@ -54,17 +54,17 @@ export default function LegalHubPage() {
<Link
key={doc.href}
href={doc.href}
className="group bg-white dark:bg-gray-800 p-6 rounded-lg border border-gray-200 dark:border-gray-700 hover:border-blue-500 dark:hover:border-blue-500 transition-all hover:shadow-lg"
className="group bg-white dark:bg-gray-800 p-6 rounded-lg border border-gray-200 dark:border-gray-700 hover:border-blue-500 dark:hover:border-blue-500 transition-all hover:shadow-lg text-gray-900"
>
<div className="flex items-center space-x-3 mb-4">
<div className="p-2 bg-blue-100 dark:bg-blue-900 rounded-lg group-hover:bg-blue-200 dark:group-hover:bg-blue-800 transition-colors">
<Icon className="h-6 w-6 text-blue-600 dark:text-blue-400" />
</div>
<h2 className="text-xl font-semibold text-gray-950 dark:text-white">
<h2 className="text-xl font-semibold text-gray-900 dark:text-white">
{doc.title}
</h2>
</div>
<p className="text-gray-800 dark:text-gray-200">{doc.description}</p>
<p className="text-gray-600 dark:text-gray-300">{doc.description}</p>
</Link>
);
})}
+13 -13
View File
@@ -23,41 +23,41 @@ export default function LegalDocumentLayout({
<div className="min-h-screen bg-[#111829]" data-legal-page>
<section
data-legal-hero
className="py-20 bg-gradient-to-b from-blue-50 to-white dark:from-gray-900 dark:to-gray-800 text-gray-950 dark:text-gray-100"
className="py-20 bg-gradient-to-b from-blue-50 to-white dark:from-gray-900 dark:to-gray-800 text-white"
>
<div className="max-w-4xl mx-auto px-4 sm:px-6 lg:px-8">
<nav
aria-label="Breadcrumb"
className="flex flex-wrap items-center gap-1.5 text-sm text-gray-700 dark:text-gray-300 mb-6"
className="flex flex-wrap items-center gap-1.5 text-sm text-gray-300 mb-6"
>
<Link
href="/legal"
className="inline-flex items-center gap-1 text-gray-900 dark:text-white hover:text-blue-600 dark:hover:text-blue-400 transition-colors"
className="inline-flex items-center gap-1 text-white hover:text-blue-300 transition-colors"
>
<Scale className="h-4 w-4 shrink-0 opacity-70" aria-hidden />
<Scale className="h-4 w-4 shrink-0 opacity-80" aria-hidden />
Legal
</Link>
<ChevronRight className="h-4 w-4 shrink-0 opacity-50" aria-hidden />
<span className="font-medium text-gray-900 dark:text-white">{title}</span>
<span className="font-medium text-white">{title}</span>
</nav>
<h1 className="text-4xl sm:text-5xl font-bold text-gray-900 dark:text-white mb-4">
<h1 className="text-4xl sm:text-5xl font-bold text-white mb-4">
{title}
</h1>
{description && (
<p className="text-xl text-gray-800 dark:text-gray-200">{description}</p>
<p className="text-xl text-gray-200">{description}</p>
)}
<p className="mt-4 text-sm text-gray-700 dark:text-gray-300">
<p className="mt-4 text-sm text-gray-300">
Last updated {LEGAL_LAST_UPDATED}
</p>
</div>
</section>
<section data-legal-content className="py-20 bg-white dark:bg-gray-900 text-gray-950 dark:text-gray-100">
<section data-legal-content className="py-20 bg-white dark:bg-gray-900 text-white">
<div className="max-w-4xl mx-auto px-4 sm:px-6 lg:px-8">
{showNotice && (
<div
role="note"
className="mb-8 flex gap-3 rounded-lg border border-amber-200 dark:border-amber-800 bg-amber-50 dark:bg-amber-900/30 px-4 py-3 text-sm leading-relaxed text-amber-950 dark:text-amber-100"
className="mb-8 flex gap-3 rounded-lg border border-amber-200 dark:border-amber-800 bg-amber-50 dark:bg-amber-900/30 px-4 py-3 text-sm leading-relaxed text-white"
>
<span className="mt-0.5 shrink-0" aria-hidden>
@@ -70,7 +70,7 @@ export default function LegalDocumentLayout({
{seeAlso && seeAlso.length > 0 && (
<aside className="mt-12 pt-8">
<h2 className="text-lg font-semibold text-gray-950 dark:text-white mb-4">
<h2 className="text-lg font-semibold text-white mb-4">
See also
</h2>
<ul className="grid gap-3 sm:grid-cols-2">
@@ -78,10 +78,10 @@ export default function LegalDocumentLayout({
<li key={link.href}>
<Link
href={link.href}
className="group flex items-center justify-between gap-3 rounded-lg border border-gray-200 dark:border-gray-700 bg-white dark:bg-gray-800 px-4 py-3 text-sm font-medium text-gray-950 dark:text-white transition-all hover:border-blue-500 dark:hover:border-blue-500 hover:shadow-md"
className="group flex items-center justify-between gap-3 rounded-lg border border-gray-200 dark:border-gray-700 bg-white dark:bg-gray-800 px-4 py-3 text-sm font-medium text-gray-900 dark:text-white transition-all hover:border-blue-500 dark:hover:border-blue-500 hover:shadow-md"
>
<span>{link.label}</span>
<ChevronRight className="h-4 w-4 shrink-0 text-gray-600 dark:text-gray-400 group-hover:text-blue-600 dark:group-hover:text-blue-400 transition-colors" />
<ChevronRight className="h-4 w-4 shrink-0 text-gray-300 group-hover:text-blue-300 transition-colors" />
</Link>
</li>
))}