refactor(legal): combine imprint and privacy policy into tabbed view
All checks were successful
Deploy Waveform to VPS / deploy (push) Successful in 1m24s
All checks were successful
Deploy Waveform to VPS / deploy (push) Successful in 1m24s
This commit is contained in:
Chneemann
parent
a957991bee
commit
1cd01ad88c
6 changed files with 267 additions and 247 deletions
|
|
@ -1,110 +0,0 @@
|
||||||
/**
|
|
||||||
* @file app/(legal)/imprint/page.tsx
|
|
||||||
* @description Server component rendering the imprint/legal notice page tailored to the app layout design.
|
|
||||||
*/
|
|
||||||
|
|
||||||
import AppFooter from "@/components/layout/AppFooter";
|
|
||||||
import { AppHeader } from "@/components/layout/AppHeader";
|
|
||||||
|
|
||||||
export default async function ImprintPage() {
|
|
||||||
return (
|
|
||||||
<div className="flex flex-col h-full w-full bg-background p-4 min-h-0 overflow-hidden">
|
|
||||||
<AppHeader isLegalImprint />
|
|
||||||
<div className="flex-1 overflow-y-auto flex flex-col gap-4 py-4 min-h-0 pr-1">
|
|
||||||
{/* Information pursuant to § 5 DDG */}
|
|
||||||
<div className="bg-surface border border-muted/20 rounded-xl p-6 shadow-xl space-y-3">
|
|
||||||
<h2 className="text-base font-semibold text-white flex items-center gap-2 font-mono">
|
|
||||||
<span className="text-accent">//</span> Information Pursuant to § 5
|
|
||||||
DDG
|
|
||||||
</h2>
|
|
||||||
<div className="font-mono text-xs bg-background border border-surface/80 rounded-xl p-4 text-foreground space-y-1">
|
|
||||||
<p className="font-semibold text-white">André Kempf</p>
|
|
||||||
<p className="text-accent">Full-Stack Web Developer</p>
|
|
||||||
<p className="text-muted">Großschneidersweg 2a</p>
|
|
||||||
<p className="text-muted">76149 Karlsruhe, Germany</p>
|
|
||||||
</div>
|
|
||||||
<p className="text-xs text-muted">
|
|
||||||
Also responsible for content pursuant to § 18 Abs. 2 MStV.
|
|
||||||
</p>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
{/* Contact */}
|
|
||||||
<div className="bg-surface border border-muted/20 rounded-xl p-6 shadow-xl space-y-3">
|
|
||||||
<h2 className="text-base font-semibold text-white flex items-center gap-2 font-mono">
|
|
||||||
<span className="text-accent">//</span> Contact
|
|
||||||
</h2>
|
|
||||||
<div className="p-4 bg-background border border-surface/80 rounded-xl font-mono text-xs">
|
|
||||||
<p className="text-muted">
|
|
||||||
<span className="text-white">Email:</span>{" "}
|
|
||||||
<span className="text-accent hover:underline cursor-pointer">
|
|
||||||
dev@andre-kempf.com
|
|
||||||
</span>
|
|
||||||
</p>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
{/* Disclaimer */}
|
|
||||||
<div className="bg-surface border border-muted/20 rounded-xl p-6 shadow-xl space-y-3">
|
|
||||||
<h2 className="text-base font-semibold text-white flex items-center gap-2 font-mono">
|
|
||||||
<span className="text-accent">//</span> Disclaimer & Legal Notes
|
|
||||||
</h2>
|
|
||||||
<div className="space-y-1">
|
|
||||||
<h3 className="font-semibold text-white text-sm">
|
|
||||||
Liability for Content
|
|
||||||
</h3>
|
|
||||||
<p className="text-muted">
|
|
||||||
As a service provider, I am responsible for my own content on
|
|
||||||
these pages according to general laws pursuant to § 7 Abs. 1 DDG.
|
|
||||||
However, according to §§ 8 to 10 DDG, I am not obligated to
|
|
||||||
monitor transmitted or stored third-party information or to
|
|
||||||
investigate circumstances that indicate illegal activity.
|
|
||||||
</p>
|
|
||||||
</div>
|
|
||||||
<div className="space-y-1 pt-3 border-t border-surface/60">
|
|
||||||
<h3 className="font-semibold text-white text-sm">
|
|
||||||
Liability for Links
|
|
||||||
</h3>
|
|
||||||
<p className="text-muted">
|
|
||||||
My website contains links to external third-party websites over
|
|
||||||
whose content I have no control. Therefore, I cannot accept any
|
|
||||||
liability for these external contents. The respective provider or
|
|
||||||
operator of the pages is always responsible for the content of the
|
|
||||||
linked pages.
|
|
||||||
</p>
|
|
||||||
</div>
|
|
||||||
<div className="space-y-1 pt-3 border-t border-surface/60">
|
|
||||||
<h3 className="font-semibold text-white text-sm">Copyright</h3>
|
|
||||||
<p className="text-muted">
|
|
||||||
The content and works created on these pages are subject to German
|
|
||||||
copyright law. Duplication, processing, distribution, or any form
|
|
||||||
of commercialization beyond the scope of copyright law require the
|
|
||||||
prior written consent of the author or creator.
|
|
||||||
</p>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
{/* Dispute Resolution */}
|
|
||||||
<div className="bg-surface border border-muted/20 rounded-xl p-6 shadow-xl space-y-3">
|
|
||||||
<h2 className="text-base font-semibold text-white flex items-center gap-2 font-mono">
|
|
||||||
<span className="text-accent">//</span> Dispute Resolution
|
|
||||||
</h2>
|
|
||||||
<p className="text-muted">
|
|
||||||
The European Commission provides a platform for online dispute
|
|
||||||
resolution (OS):{" "}
|
|
||||||
<a
|
|
||||||
href="https://ec.europa.eu/consumers/odr/"
|
|
||||||
target="_blank"
|
|
||||||
rel="noopener noreferrer"
|
|
||||||
className="text-accent hover:underline break-all"
|
|
||||||
>
|
|
||||||
https://ec.europa.eu/consumers/odr/
|
|
||||||
</a>
|
|
||||||
.<br />I am neither willing nor obligated to participate in dispute
|
|
||||||
resolution proceedings before a consumer arbitration board.
|
|
||||||
</p>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<AppFooter />
|
|
||||||
</div>
|
|
||||||
);
|
|
||||||
}
|
|
||||||
|
|
@ -1,135 +0,0 @@
|
||||||
/**
|
|
||||||
* @file app/(legal)/privacy/page.tsx
|
|
||||||
* @description Server component rendering the privacy policy page tailored to the app layout design.
|
|
||||||
*/
|
|
||||||
|
|
||||||
import AppFooter from "@/components/layout/AppFooter";
|
|
||||||
import { AppHeader } from "@/components/layout/AppHeader";
|
|
||||||
|
|
||||||
export default async function PrivacyPage() {
|
|
||||||
return (
|
|
||||||
<div className="flex flex-col h-full w-full bg-background p-4 min-h-0 overflow-hidden">
|
|
||||||
<AppHeader isLegalPrivacy />
|
|
||||||
<div className="flex-1 overflow-y-auto flex flex-col gap-4 py-4 min-h-0 pr-1">
|
|
||||||
{/* Overview */}
|
|
||||||
<div className="bg-surface border border-muted/20 rounded-xl p-6 shadow-xl space-y-3">
|
|
||||||
<h2 className="text-base font-semibold text-white flex items-center gap-2 font-mono">
|
|
||||||
<span className="text-accent">//</span> Data Protection at a Glance
|
|
||||||
</h2>
|
|
||||||
<div className="space-y-2">
|
|
||||||
<h3 className="font-semibold text-white text-sm">
|
|
||||||
General Information
|
|
||||||
</h3>
|
|
||||||
<p className="text-muted">
|
|
||||||
The following notes provide a simple overview of what happens to
|
|
||||||
your personal data when you visit this website. Personal data is
|
|
||||||
any data that can be used to personally identify you.
|
|
||||||
</p>
|
|
||||||
</div>
|
|
||||||
<div className="space-y-2">
|
|
||||||
<h3 className="font-semibold text-white text-sm">
|
|
||||||
Data Collection on This Website
|
|
||||||
</h3>
|
|
||||||
<p className="text-muted">
|
|
||||||
Data processing on this website is carried out by the website
|
|
||||||
operator. Your data is collected when you provide it to us, or
|
|
||||||
automatically by our IT systems when you visit the site.
|
|
||||||
</p>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
{/* Responsible Party */}
|
|
||||||
<div className="bg-surface border border-muted/20 rounded-xl p-6 shadow-xl space-y-3">
|
|
||||||
<h2 className="text-base font-semibold text-white flex items-center gap-2 font-mono">
|
|
||||||
<span className="text-accent">//</span> Responsible Party
|
|
||||||
(Controller)
|
|
||||||
</h2>
|
|
||||||
<p className="text-muted">
|
|
||||||
The controller responsible for data processing on this website is:
|
|
||||||
</p>
|
|
||||||
<div className="font-mono text-xs bg-background border border-surface/80 rounded-xl p-4 text-foreground space-y-1">
|
|
||||||
<p className="font-semibold text-white">André Kempf</p>
|
|
||||||
<p className="text-muted">Großschneidersweg 2a</p>
|
|
||||||
<p className="text-muted">76149 Karlsruhe, Germany</p>
|
|
||||||
<p className="pt-2 text-muted">
|
|
||||||
Email:{" "}
|
|
||||||
<span className="text-accent hover:underline cursor-pointer font-medium">
|
|
||||||
dev@andre-kempf.com
|
|
||||||
</span>
|
|
||||||
</p>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
{/* Hosting & Server Log Files */}
|
|
||||||
<div className="bg-surface border border-muted/20 rounded-xl p-6 shadow-xl space-y-3">
|
|
||||||
<h2 className="text-base font-semibold text-white flex items-center gap-2 font-mono">
|
|
||||||
<span className="text-accent">//</span> Hosting & Server
|
|
||||||
Infrastructure
|
|
||||||
</h2>
|
|
||||||
<p className="text-muted">
|
|
||||||
This website is hosted externally on web servers operated by Netcup
|
|
||||||
GmbH. Personal data processed on this website is stored on the
|
|
||||||
host's secure servers.
|
|
||||||
</p>
|
|
||||||
<p className="text-muted">
|
|
||||||
The hosting provider automatically processes technical access data
|
|
||||||
in server environment variables necessary to establish a stable
|
|
||||||
connection and deliver page assets securely.
|
|
||||||
</p>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
{/* Server Analytics */}
|
|
||||||
<div className="bg-surface border border-muted/20 rounded-xl p-6 shadow-xl space-y-3">
|
|
||||||
<h2 className="text-base font-semibold text-white flex items-center gap-2 font-mono">
|
|
||||||
<span className="text-accent">//</span> Server Analytics &
|
|
||||||
Privacy-First Tracking
|
|
||||||
</h2>
|
|
||||||
<p className="text-muted">
|
|
||||||
To evaluate website reach and optimize user experience, this website
|
|
||||||
processes minimal access metrics (e.g., total daily views, coarse
|
|
||||||
device category, and daily visitor counts).
|
|
||||||
</p>
|
|
||||||
<div className="p-4 rounded-xl bg-background/80 border border-surface/80 space-y-2 text-xs font-mono">
|
|
||||||
<p className="text-emerald-400 font-semibold">
|
|
||||||
// Key privacy guarantees:
|
|
||||||
</p>
|
|
||||||
<ul className="list-disc list-inside space-y-1 text-muted">
|
|
||||||
<li>
|
|
||||||
<strong className="text-white">No Cookies:</strong> We do not
|
|
||||||
store cookies or local storage identifiers on your device.
|
|
||||||
</li>
|
|
||||||
<li>
|
|
||||||
<strong className="text-white">Anonymized IPs:</strong> IP
|
|
||||||
addresses are instantly hashed with a daily salt and never
|
|
||||||
stored in plain text.
|
|
||||||
</li>
|
|
||||||
<li>
|
|
||||||
<strong className="text-white">Zero Third Parties:</strong>{" "}
|
|
||||||
Analytics data is processed locally on our own server and never
|
|
||||||
shared with external tracking services.
|
|
||||||
</li>
|
|
||||||
</ul>
|
|
||||||
</div>
|
|
||||||
<p className="text-xs text-muted">
|
|
||||||
The legal basis for this processing is our legitimate interest in
|
|
||||||
maintaining and optimizing our online portfolio (Art. 6(1)(f) GDPR).
|
|
||||||
</p>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
{/* Your Rights */}
|
|
||||||
<div className="bg-surface border border-muted/20 rounded-xl p-6 shadow-xl space-y-3">
|
|
||||||
<h2 className="text-base font-semibold text-white flex items-center gap-2 font-mono">
|
|
||||||
<span className="text-accent">//</span> Your Rights
|
|
||||||
</h2>
|
|
||||||
<p className="text-muted">
|
|
||||||
You have the right at any time to receive information free of charge
|
|
||||||
about the origin, recipient, and purpose of your stored personal
|
|
||||||
data. You also have a right to request the correction or deletion of
|
|
||||||
this data.
|
|
||||||
</p>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<AppFooter />
|
|
||||||
</div>
|
|
||||||
);
|
|
||||||
}
|
|
||||||
100
app/(app)/legal/imprint/page.tsx
Normal file
100
app/(app)/legal/imprint/page.tsx
Normal file
|
|
@ -0,0 +1,100 @@
|
||||||
|
/**
|
||||||
|
* @file app/(app)/legal/imprint/page.tsx
|
||||||
|
* @description Server component rendering the imprint/legal notice page tailored to the app layout design.
|
||||||
|
*/
|
||||||
|
|
||||||
|
/** Renders the imprint page containing legal information and statutory disclosures. */
|
||||||
|
export default function ImprintPage() {
|
||||||
|
return (
|
||||||
|
<div className="text-sm space-y-3">
|
||||||
|
{/* Information pursuant to § 5 DDG */}
|
||||||
|
<div className="bg-surface border border-muted/20 rounded-xl p-6 shadow-xl space-y-3">
|
||||||
|
<h2 className="text-base font-semibold flex items-center gap-2 font-mono">
|
||||||
|
<span className="text-accent">//</span> Information Pursuant to § 5
|
||||||
|
DDG
|
||||||
|
</h2>
|
||||||
|
<div className="font-mono bg-background border border-surface/80 rounded-xl p-4 space-y-1">
|
||||||
|
<p className="font-semibold">André Kempf</p>
|
||||||
|
<p className="text-accent">Full-Stack Web Developer</p>
|
||||||
|
<p className="text-muted">Großschneidersweg 2a</p>
|
||||||
|
<p className="text-muted">76149 Karlsruhe, Germany</p>
|
||||||
|
</div>
|
||||||
|
<p className=" text-muted text-xs">
|
||||||
|
Also responsible for content pursuant to § 18 Abs. 2 MStV.
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
{/* Contact */}
|
||||||
|
<div className="bg-surface border border-muted/20 rounded-xl p-6 shadow-xl space-y-3">
|
||||||
|
<h2 className="text-base font-semibold flex items-center gap-2 font-mono">
|
||||||
|
<span className="text-accent">//</span> Contact
|
||||||
|
</h2>
|
||||||
|
<div className="p-4 bg-background border border-surface/80 rounded-xl font-mono">
|
||||||
|
<p>
|
||||||
|
<span>Email:</span>{" "}
|
||||||
|
<span className="text-accent hover:underline cursor-pointer">
|
||||||
|
dev@andre-kempf.com
|
||||||
|
</span>
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
{/* Disclaimer */}
|
||||||
|
<div className="bg-surface border border-muted/20 rounded-xl p-6 shadow-xl space-y-3">
|
||||||
|
<h2 className="text-base font-semibold flex items-center gap-2 font-mono">
|
||||||
|
<span className="text-accent">//</span> Disclaimer & Legal Notes
|
||||||
|
</h2>
|
||||||
|
<div className="space-y-1">
|
||||||
|
<h3 className="font-semibold">Liability for Content</h3>
|
||||||
|
<p className="text-muted">
|
||||||
|
As a service provider, I am responsible for my own content on these
|
||||||
|
pages according to general laws pursuant to § 7 Abs. 1 DDG. However,
|
||||||
|
according to §§ 8 to 10 DDG, I am not obligated to monitor
|
||||||
|
transmitted or stored third-party information or to investigate
|
||||||
|
circumstances that indicate illegal activity.
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
|
<div className="space-y-1 pt-3 border-t border-surface/60">
|
||||||
|
<h3 className="font-semibold">Liability for Links</h3>
|
||||||
|
<p className="text-muted">
|
||||||
|
My website contains links to external third-party websites over
|
||||||
|
whose content I have no control. Therefore, I cannot accept any
|
||||||
|
liability for these external contents. The respective provider or
|
||||||
|
operator of the pages is always responsible for the content of the
|
||||||
|
linked pages.
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
|
<div className="space-y-1 pt-3 border-t border-surface/60">
|
||||||
|
<h3 className="font-semibold">Copyright</h3>
|
||||||
|
<p className="text-muted">
|
||||||
|
The content and works created on these pages are subject to German
|
||||||
|
copyright law. Duplication, processing, distribution, or any form of
|
||||||
|
commercialization beyond the scope of copyright law require the
|
||||||
|
prior written consent of the author or creator.
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
{/* Dispute Resolution */}
|
||||||
|
<div className="bg-surface border border-muted/20 rounded-xl p-6 shadow-xl space-y-3">
|
||||||
|
<h2 className="text-base font-semibold flex items-center gap-2 font-mono">
|
||||||
|
<span className="text-accent">//</span> Dispute Resolution
|
||||||
|
</h2>
|
||||||
|
<p className="text-muted">
|
||||||
|
The European Commission provides a platform for online dispute
|
||||||
|
resolution (OS):{" "}
|
||||||
|
<a
|
||||||
|
href="https://ec.europa.eu/consumers/odr/"
|
||||||
|
target="_blank"
|
||||||
|
rel="noopener noreferrer"
|
||||||
|
className="text-accent hover:underline break-all"
|
||||||
|
>
|
||||||
|
https://ec.europa.eu/consumers/odr/
|
||||||
|
</a>
|
||||||
|
.<br />I am neither willing nor obligated to participate in dispute
|
||||||
|
resolution proceedings before a consumer arbitration board.
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
);
|
||||||
|
}
|
||||||
37
app/(app)/legal/page.tsx
Normal file
37
app/(app)/legal/page.tsx
Normal file
|
|
@ -0,0 +1,37 @@
|
||||||
|
/**
|
||||||
|
* @file app/(app)/legal/page.tsx
|
||||||
|
* @description Legal page component handling tabbed navigation between imprint and privacy policy views.
|
||||||
|
*/
|
||||||
|
|
||||||
|
"use client";
|
||||||
|
|
||||||
|
import { useSearchParams } from "next/navigation";
|
||||||
|
import { AppHeader } from "@/components/layout/AppHeader";
|
||||||
|
import ImprintPage from "./imprint/page";
|
||||||
|
import PrivacyPage from "./privacy/page";
|
||||||
|
import AppFooter from "@/components/layout/AppFooter";
|
||||||
|
|
||||||
|
/** Renders the legal section layout with tab-based toggling between imprint and privacy notices. */
|
||||||
|
export default function LegalPage() {
|
||||||
|
const searchParams = useSearchParams();
|
||||||
|
|
||||||
|
const tabParam = searchParams.get("tab");
|
||||||
|
const activeTab: "imprint" | "privacy" =
|
||||||
|
tabParam === "privacy" ? "privacy" : "imprint";
|
||||||
|
|
||||||
|
return (
|
||||||
|
<div className="flex flex-col h-full w-full bg-background p-4 min-h-0 overflow-hidden">
|
||||||
|
<AppHeader
|
||||||
|
isLegalImprint={activeTab === "imprint"}
|
||||||
|
isLegalPrivacy={activeTab === "privacy"}
|
||||||
|
/>
|
||||||
|
|
||||||
|
{/* Content Area */}
|
||||||
|
<div className="flex-1 overflow-y-auto flex flex-col gap-4 py-4 min-h-0 pr-1">
|
||||||
|
{activeTab === "imprint" ? <ImprintPage /> : <PrivacyPage />}
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<AppFooter />
|
||||||
|
</div>
|
||||||
|
);
|
||||||
|
}
|
||||||
124
app/(app)/legal/privacy/page.tsx
Normal file
124
app/(app)/legal/privacy/page.tsx
Normal file
|
|
@ -0,0 +1,124 @@
|
||||||
|
/**
|
||||||
|
* @file app/(app)/legal/privacy/page.tsx
|
||||||
|
* @description Server component rendering the privacy policy page tailored to the app layout design.
|
||||||
|
*/
|
||||||
|
|
||||||
|
/** Renders the privacy policy page detailing data protection and privacy practices. */
|
||||||
|
export default function PrivacyPage() {
|
||||||
|
return (
|
||||||
|
<div className="text-sm space-y-3">
|
||||||
|
{/* Overview */}
|
||||||
|
<div className="bg-surface border border-muted/20 rounded-xl p-6 shadow-xl space-y-3">
|
||||||
|
<h2 className="text-base font-semibold flex items-center gap-2 font-mono">
|
||||||
|
<span className="text-accent">//</span> Data Protection at a Glance
|
||||||
|
</h2>
|
||||||
|
<div className="space-y-2">
|
||||||
|
<h3 className="font-semibold">General Information</h3>
|
||||||
|
<p className="text-muted">
|
||||||
|
The following notes provide a simple overview of what happens to
|
||||||
|
your personal data when you visit this website. Personal data is any
|
||||||
|
data that can be used to personally identify you.
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
|
<div className="space-y-2">
|
||||||
|
<h3 className="font-semibold">Data Collection on This Website</h3>
|
||||||
|
<p className="text-muted">
|
||||||
|
Data processing on this website is carried out by the website
|
||||||
|
operator. Your data is collected when you provide it to us, or
|
||||||
|
automatically by our IT systems when you visit the site.
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
{/* Responsible Party */}
|
||||||
|
<div className="bg-surface border border-muted/20 rounded-xl p-6 shadow-xl space-y-3">
|
||||||
|
<h2 className="text-base font-semibold flex items-center gap-2 font-mono">
|
||||||
|
<span className="text-accent">//</span> Responsible Party (Controller)
|
||||||
|
</h2>
|
||||||
|
<p className="text-muted">
|
||||||
|
The controller responsible for data processing on this website is:
|
||||||
|
</p>
|
||||||
|
<div className="font-mono bg-background border border-surface/80 rounded-xl p-4 text-foreground space-y-1">
|
||||||
|
<p className="font-semibold">André Kempf</p>
|
||||||
|
<p className="text-muted">Großschneidersweg 2a</p>
|
||||||
|
<p className="text-muted">76149 Karlsruhe, Germany</p>
|
||||||
|
<p className="pt-2">
|
||||||
|
Email:{" "}
|
||||||
|
<span className="text-accent hover:underline cursor-pointer font-medium">
|
||||||
|
dev@andre-kempf.com
|
||||||
|
</span>
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
{/* Hosting & Server Log Files */}
|
||||||
|
<div className="bg-surface border border-muted/20 rounded-xl p-6 shadow-xl space-y-3">
|
||||||
|
<h2 className="text-base font-semibold flex items-center gap-2 font-mono">
|
||||||
|
<span className="text-accent">//</span> Hosting & Server
|
||||||
|
Infrastructure
|
||||||
|
</h2>
|
||||||
|
<p className="text-muted">
|
||||||
|
This website is hosted externally on web servers operated by Netcup
|
||||||
|
GmbH. Personal data processed on this website is stored on the
|
||||||
|
host's secure servers.
|
||||||
|
</p>
|
||||||
|
<p className="text-muted">
|
||||||
|
The hosting provider automatically processes technical access data in
|
||||||
|
server environment variables necessary to establish a stable
|
||||||
|
connection and deliver page assets securely.
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
{/* Server Analytics */}
|
||||||
|
<div className="bg-surface border border-muted/20 rounded-xl p-6 shadow-xl space-y-3">
|
||||||
|
<h2 className="text-base font-semibold flex items-center gap-2 font-mono">
|
||||||
|
<span className="text-accent">//</span> Server Analytics &
|
||||||
|
Privacy-First Tracking
|
||||||
|
</h2>
|
||||||
|
<p className="text-muted">
|
||||||
|
To evaluate website reach and optimize user experience, this website
|
||||||
|
processes minimal access metrics (e.g., total daily views, coarse
|
||||||
|
device category, and daily visitor counts).
|
||||||
|
</p>
|
||||||
|
<div className="p-4 rounded-xl bg-background/80 border border-surface/80 space-y-2 font-mono">
|
||||||
|
<p className="text-emerald-400 font-semibold">
|
||||||
|
// Key privacy guarantees:
|
||||||
|
</p>
|
||||||
|
<ul className="list-disc list-inside space-y-1 text-muted">
|
||||||
|
<li>
|
||||||
|
<strong className="text-foreground">No Cookies:</strong> We do not
|
||||||
|
store cookies or local storage identifiers on your device.
|
||||||
|
</li>
|
||||||
|
<li>
|
||||||
|
<strong className="text-foreground">Anonymized IPs:</strong> IP
|
||||||
|
addresses are instantly hashed with a daily salt and never stored
|
||||||
|
in plain text.
|
||||||
|
</li>
|
||||||
|
<li>
|
||||||
|
<strong className="text-foreground">Zero Third Parties:</strong>{" "}
|
||||||
|
Analytics data is processed locally on our own server and never
|
||||||
|
shared with external tracking services.
|
||||||
|
</li>
|
||||||
|
</ul>
|
||||||
|
</div>
|
||||||
|
<p className="text-xs text-muted">
|
||||||
|
The legal basis for this processing is our legitimate interest in
|
||||||
|
maintaining and optimizing our online portfolio (Art. 6(1)(f) GDPR).
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
{/* Your Rights */}
|
||||||
|
<div className="bg-surface border border-muted/20 rounded-xl p-6 shadow-xl space-y-3">
|
||||||
|
<h2 className="text-base font-semiboldflex items-center gap-2 font-mono">
|
||||||
|
<span className="text-accent">//</span> Your Rights
|
||||||
|
</h2>
|
||||||
|
<p className="text-muted">
|
||||||
|
You have the right at any time to receive information free of charge
|
||||||
|
about the origin, recipient, and purpose of your stored personal data.
|
||||||
|
You also have a right to request the correction or deletion of this
|
||||||
|
data.
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
);
|
||||||
|
}
|
||||||
|
|
@ -7,8 +7,12 @@ import { FileText, ShieldCheck } from "lucide-react";
|
||||||
|
|
||||||
/** List of legal navigation links with their corresponding route paths and icon identifiers. */
|
/** List of legal navigation links with their corresponding route paths and icon identifiers. */
|
||||||
export const LEGAL_LINKS = [
|
export const LEGAL_LINKS = [
|
||||||
{ name: "Imprint", href: "/imprint", iconName: "FileText" },
|
{ name: "Imprint", href: "/legal?tab=imprint", iconName: "FileText" },
|
||||||
{ name: "Privacy Policy", href: "/privacy", iconName: "ShieldCheck" },
|
{
|
||||||
|
name: "Privacy Policy",
|
||||||
|
href: "/legal?tab=privacy",
|
||||||
|
iconName: "ShieldCheck",
|
||||||
|
},
|
||||||
] as const;
|
] as const;
|
||||||
|
|
||||||
/** Mapping object linking string identifiers to their respective Lucide icon components. */
|
/** Mapping object linking string identifiers to their respective Lucide icon components. */
|
||||||
|
|
|
||||||
Loading…
Reference in a new issue