Press n or j to go to the next uncovered block, b, p or k for the previous block.
| 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 100 101 102 103 104 105 106 107 108 109 110 111 112 113 114 115 116 117 118 119 120 121 122 123 124 125 126 127 128 129 130 131 132 133 134 135 136 137 138 139 140 | 4x 4x | import React from "react";
import {useTranslation} from "react-i18next";
/**
* Privacy component displays the privacy policy page.
*
* It uses translations from `react-i18next` to render privacy information sections,
* including owner details, data types collected, purposes, legal basis, recipients,
* data transfer, retention, user rights, cookie policy, and change notifications.
*
* @component
* @module pages/Privacy
* @returns {JSX.Element} The rendered privacy policy page
*/
export default function Privacy() {
const {t} = useTranslation();
return (
<main className="max-w-4xl mx-auto p-8 bg-white text-gray-900 dark:bg-gray-900 dark:text-gray-300 min-h-screen">
<h1 className="text-4xl font-bold mb-6">{t("privacy.title")}</h1>
<section className="mb-8">
<h2 className="text-2xl font-semibold mb-2">{t("privacy.intro_title")}</h2>
<p>
{t("privacy.intro_text1")}{" "}
<a
href="https://www.ingdanielemasone.com/"
className="text-blue-600 dark:text-blue-400 underline hover:text-blue-800 dark:hover:text-blue-300"
>
https://www.ingdanielemasone.com/
</a>. {t("privacy.intro_text2")}
</p>
</section>
<section className="mb-8">
<h2 className="text-2xl font-semibold mb-2">{t("privacy.owner_title")}</h2>
<address className="not-italic mb-2">
<strong>Daniele Masone</strong>
<br/>
{t("privacy.address")}
<br/>
Email:{" "}
<a
href="mailto:masone.daniele@gmail.com"
className="text-blue-600 dark:text-blue-400 underline"
>
masone.daniele@gmail.com
</a>
</address>
</section>
<section className="mb-8">
<h2 className="text-2xl font-semibold mb-2">{t("privacy.data_types_title")}</h2>
<ul className="list-disc pl-6 space-y-1">
<li>
<strong>{t("privacy.browsing_data")}:</strong> {t("privacy.browsing_data_details")}
</li>
<li>
<strong>{t("privacy.voluntary_data")}:</strong> {t("privacy.voluntary_data_details")}
</li>
</ul>
</section>
<section className="mb-8">
<h2 className="text-2xl font-semibold mb-2">{t("privacy.purpose_title")}</h2>
<ul className="list-disc pl-6 space-y-1">
<li>{t("privacy.purpose_1")}</li>
<li>{t("privacy.purpose_2")}</li>
<li>{t("privacy.purpose_3")}</li>
</ul>
</section>
<section className="mb-8">
<h2 className="text-2xl font-semibold mb-2">{t("privacy.legal_basis_title")}</h2>
<ul className="list-disc pl-6 space-y-1">
<li>{t("privacy.legal_1")}</li>
<li>{t("privacy.legal_2")}</li>
<li>{t("privacy.legal_3")}</li>
</ul>
</section>
<section className="mb-8">
<h2 className="text-2xl font-semibold mb-2">{t("privacy.recipients_title")}</h2>
<p>{t("privacy.recipients_text")}</p>
</section>
<section className="mb-8">
<h2 className="text-2xl font-semibold mb-2">{t("privacy.transfer_title")}</h2>
<p>{t("privacy.transfer_text")}</p>
</section>
<section className="mb-8">
<h2 className="text-2xl font-semibold mb-2">{t("privacy.retention_title")}</h2>
<p>{t("privacy.retention_text")}</p>
</section>
<section className="mb-8">
<h2 className="text-2xl font-semibold mb-2">{t("privacy.rights_title")}</h2>
<ul className="list-disc pl-6 space-y-1">
<li>{t("privacy.rights_1")}</li>
<li>{t("privacy.rights_2")}</li>
<li>{t("privacy.rights_3")}</li>
</ul>
<p>
{t("privacy.rights_exercise")}{" "}
<a
href="mailto:masone.daniele@gmail.com"
className="text-blue-600 dark:text-blue-400 underline"
>
masone.daniele@gmail.com
</a>
</p>
</section>
<section className="mb-8">
<h2 className="text-2xl font-semibold mb-2">{t("privacy.cookie_title")}</h2>
<p>
{t("privacy.cookie_text")}{" "}
<a
href="/cookie-policy"
className="text-blue-600 dark:text-blue-400 underline"
>
{t("privacy.cookie_link")}
</a>.
</p>
</section>
<section className="mb-8">
<h2 className="text-2xl font-semibold mb-2">{t("privacy.changes_title")}</h2>
<p>{t("privacy.changes_text")}</p>
</section>
<footer
className="border-t border-gray-300 dark:border-gray-700 pt-4 text-sm text-gray-500 dark:text-gray-600 text-center">
{t("privacy.last_updated")}: {t("privacy.last_date_updated")}
</footer>
</main>
);
}
|