Add data deletion instructions and related pages

src/lib/components/organisms/DataDeletion.svelte

@@ -0,0 +1,75 @@
+<section id="policy">
+
+	<h1>Data Deletion Instructions</h1>
+
+	*Effective Date: 21, December 2023*
+
+		If you would like to request the deletion of your personal data from languageXchange, please follow the instructions below:
+
+	1. Account Deletion:
+
+		-	Log in to your languageXchange account.
+		-	Navigate to the profile section.
+		- Navigate to the upper right corner of the interface and select the settings icon, represented by a gear symbol.
+		- Please proceed to select the "Account" option.
+		- Within "Other" section, you will find two options: one to **delete your account** and another to freeze it.
+		-	Follow the provided prompts to confirm and initiate the deletion process.
+
+	2. Contacting Support:
+
+		If you encounter any issues or need assistance with the data deletion process, you can contact our support team at [[email protected]]. Please provide the following information in your email:
+
+		-	Subject: Data Deletion Request
+		-	Your full name
+		-	The email address associated with your languageXchange account
+		-	A brief description of your request
+
+	3. Verification:
+
+		To protect the security of your data, we may need to verify your identity before processing the deletion request. This may involve confirming details associated with your account.
+
+	4. Timeline:
+
+		Upon receiving a valid data deletion request, we will make reasonable efforts to delete your personal information from our records within 14 business days. Please note that some residual information may remain in our backup systems for a limited period.
+
+	5. Limitations:
+
+		Certain legal obligations or business needs may require us to retain certain information even after a deletion request. We will inform you if such circumstances apply.
+
+	6. Third-Party Services:
+
+		Should you choose to delete your LanguageXchange account, please be informed that all data linked to third-party services will also be automatically deleted.	
+
+	7. Confirmation:
+
+		Once your data has been successfully deleted, you will receive a confirmation email at the address associated with your languageXchange account.
+
+	8. Changes to Instructions:
+
+		We reserve the right to update these Data Deletion Instructions. Any changes will be reflected on our website or App.
+
+		If you have any questions or concerns regarding the data deletion process, please contact us at [[email protected]].
+
+
+</section>
+
+<style lang="scss">
+	@import '$lib/scss/breakpoints.scss';
+
+	#policy {
+		position: relative;
+		display: grid;
+		align-items: start; /* Align to the start for better readability */
+		justify-content: space-between;
+		padding: 50px; /* Add padding around the text */
+		line-height: 1.5; /* Increase line height for better readability */
+		max-width: 800px; /* Limit the width of the text */
+		margin: 0 auto; /* Center the text block */
+
+		@include for-phone-only {
+			grid-template-columns: 1fr;
+			justify-items: center;
+			gap: 20px;
+		}
+	}
+</style>

src/lib/components/organisms/Footer.svelte

@@ -34,6 +34,7 @@
 				<li><small><a href="privacy-policy">Privacy Policy</a></small></li>
 				<li><small><a href="terms-conditions">Terms & Conditions</a></small></li>
 				<li><small><a href="cookie-policy">Cookie Policy</a></small></li>
+				<li><small><a href="data-deletion">Data Deletion</a></small></li>
 			</ul>
 		</div>
 		<div class="copyright">© 2024 languageXchange - Practice, Learn, Succeed!</div>

src/routes/data-deletion/+layout.svelte

@@ -0,0 +1,35 @@
+<script>
+	import Waves from '$lib/components/organisms/Waves.svelte';
+	import Header from '$lib/components/organisms/Header.svelte';
+	import Footer from '$lib/components/organisms/Footer.svelte';
+
+	import { description, image, keywords, title, siteBaseUrl } from '$lib/data/meta';
+</script>
+
+<svelte:head>
+	<link rel="“canonical”" href={siteBaseUrl} />
+	<meta name="keywords" content={keywords.join(', ')} />
+
+	<meta name="description" content={description} />
+	<meta property="og:description" content={description} />
+	<meta name="twitter:description" content={description} />
+
+	<title>{title}</title>
+	<meta property="og:title" content={title} />
+	<meta name="twitter:title" content={title} />
+
+	<meta property="og:image" content={image} />
+	<meta name="twitter:image" content={image} />
+
+	<meta name="twitter:card" content="summary_large_image" />
+</svelte:head>
+
+<Waves />
+
+<Header />
+
+<main>
+	<slot />
+</main>
+
+<Footer />

src/routes/data-deletion/+page.svelte

@@ -0,0 +1,9 @@
+<script lang="ts">
+	import Hero from '$lib/components/organisms/Hero.svelte';
+	import DataDeletion from '$lib/components/organisms/DataDeletion.svelte';
+</script>
+
+<div class="container">
+	<Hero />
+	<DataDeletion />
+</div>

src/routes/data-deletion/+page.ts

@@ -0,0 +1,9 @@
+import { dev } from '$app/environment';
+
+// we don't need any JS on this page, though we'll load
+// it in dev so that we get hot module replacement
+export const csr = dev;
+
+// since there's no dynamic data here, we can prerender
+// it so that it gets served as a static asset in production
+export const prerender = true;