From 785c9f1c071f7c1671f07ee38bef103fbe39ea47 Mon Sep 17 00:00:00 2001
From: Adam Jaamour <dev@jaamour.com>
Date: Sun, 19 May 2024 12:12:35 +0200
Subject: [PATCH] Add privacy policy

---
 _includes/contact.html |  2 +-
 _includes/footer.html  | 72 ++++++++++++++++++++++++++++++++++++++++--
 _includes/head.html    |  1 +
 assets/css/modal.css   | 41 ++++++++++++++++++++++++
 4 files changed, 113 insertions(+), 3 deletions(-)
 create mode 100644 assets/css/modal.css

diff --git a/_includes/contact.html b/_includes/contact.html
index 71ea14f..9d889b7 100644
--- a/_includes/contact.html
+++ b/_includes/contact.html
@@ -5,7 +5,7 @@ <h1>Contact Me</h1>
 </div>
 
 <div class="center-align-content">
-    <form action="https://formspree.io/adam@jaamour.com" method="POST" class="pure-form pure-form-aligned">
+    <form id="contact" action="https://formspree.io/adam@jaamour.com" method="POST" class="pure-form pure-form-aligned">
         <fieldset>
             <div class="pure-control-group">
                 <input type="text" name="name" class="pure-input-2-3" placeholder="Name" required/>
diff --git a/_includes/footer.html b/_includes/footer.html
index c372055..1b8b294 100755
--- a/_includes/footer.html
+++ b/_includes/footer.html
@@ -1,6 +1,6 @@
 <footer class="footer">
     <p>
-        Built with Jekyll and <span class="love">❤</span> by <a href="https://github.com/Adamouization">Adam Jaamour</a> &copy; <span id="year"></span>
+        Built with Jekyll and <span class="love">❤</span> by <a href="https://github.com/Adamouization">Adam Jaamour</a> &copy; <span id="year"></span> | <a href="#" id="privacy-policy-link">Privacy Policy</a>
     </p>
 </footer>
 
@@ -10,4 +10,72 @@
 <script src="{{ '/assets/js/modernizer.js' | prepend: site.baseurl }}"></script>
 <script src="{{ '/assets/js/typewriter.js' | prepend: site.baseurl }}"></script>
 <script src="{{ '/assets/js/stackoverflow.js' | prepend: site.baseurl }}"></script>
-{% include google-analytics.html %}
\ No newline at end of file
+{% include google-analytics.html %}
+
+<!-- Privacy Policy content. Generated using ChatGPT. -->
+<div id="privacy-policy-modal" class="modal">
+    <div class="modal-content">
+        <span class="close">&times;</span>
+        <h1>Privacy Policy</h1>
+        <p><strong>Effective Date:</strong> 19 May 2024</p>
+
+        <h2>1. Introduction</h2>
+        <p>Welcome to the Adam Jaamour Portfolio website (<a href="http://www.adam.jaamour.com/">http://www.adam.jaamour.com/</a>). This Privacy Policy explains how we collect, use, and protect your information when you visit our website.</p>
+
+        <h2>2. Information We Collect</h2>
+        <p>We do not collect any personal data unless you choose to provide it through our contact form. The only data collected is the information you voluntarily submit.</p>
+
+        <h2>3. Non-Personal Data Collection</h2>
+        <p>We use Google Analytics to collect non-personal data about your visit to our website. This data includes information such as your IP address, browser type, and pages visited. This information is used solely for analytics purposes to help us understand how our website is used and to improve our services.</p>
+
+        <h2>4. Purpose of Data Collection</h2>
+        <p>The non-personal data collected through Google Analytics is used to analyze website traffic and improve our website's functionality and content.</p>
+
+        <h2>5. Data Sharing</h2>
+        <p>We do not share any collected data with third parties. All data is used internally for the purposes outlined in this Privacy Policy.</p>
+
+        <h2>6. Children's Privacy</h2>
+        <p>We do not knowingly collect any information from children. Our website is not directed towards children, and we take steps to ensure we do not collect data from children.</p>
+
+        <h2>7. Updates to This Privacy Policy</h2>
+        <p>We may update this Privacy Policy from time to time. We encourage you to review this Privacy Policy periodically to stay informed about how we are protecting your information.</p>
+
+        <h2>8. Contact Information</h2>
+        <p>If you have any questions or concerns about this Privacy Policy, please contact us at <a href="mailto:hello@jaamour.com">hello@jaamour.com</a> or via the <a href="http://www.adam.jaamour.com/#contact">contact form</a>.</p>
+
+        <h2>9. Consent</h2>
+        <p>By using our website, you hereby consent to our Privacy Policy and agree to its terms.</p>
+
+        <p><strong>Last Updated:</strong> 19 May 2024</p>
+    </div>
+</div>
+
+<!-- Privacy Policy modal logic. -->
+<script>
+    // Get the modal
+    const modal = document.getElementById("privacy-policy-modal");
+
+    // Get the link that opens the modal
+    const link = document.getElementById("privacy-policy-link");
+
+    // Get the <span> element that closes the modal
+    const span = document.getElementsByClassName("close")[0];
+
+    // When the user clicks the link, open the modal
+    link.onclick = function(event) {
+        event.preventDefault();
+        modal.style.display = "block";
+    }
+
+    // When the user clicks on <span> (x), close the modal
+    span.onclick = function() {
+        modal.style.display = "none";
+    }
+
+    // When the user clicks anywhere outside the modal, close it
+    window.onclick = function(event) {
+        if (event.target === modal) {
+            modal.style.display = "none";
+        }
+    }
+</script>
\ No newline at end of file
diff --git a/_includes/head.html b/_includes/head.html
index a746d8b..72da71b 100755
--- a/_includes/head.html
+++ b/_includes/head.html
@@ -17,6 +17,7 @@
     <link rel="stylesheet" href="{{ '/assets/css/project-cards.css' | prepend: site.baseurl }}">
     <link rel="stylesheet" href="{{ '/assets/css/buttons.css' | prepend: site.baseurl }}">
     <link rel="stylesheet" href="{{ '/assets/css/stackoverflow.css' | prepend: site.baseurl }}">
+    <link rel="stylesheet" href="{{ '/assets/css/modal.css' | prepend: site.baseurl }}">
     <link rel="shortcut icon" type="image/png" href="{{ '/assets/favicon.ico' }}">
 
     <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
diff --git a/assets/css/modal.css b/assets/css/modal.css
new file mode 100644
index 0000000..cc48e10
--- /dev/null
+++ b/assets/css/modal.css
@@ -0,0 +1,41 @@
+.modal {
+    display: none;
+    position: fixed;
+    z-index: 1;
+    left: 0;
+    top: 0;
+    width: 100%;
+    height: 100%;
+    overflow: auto;
+    background-color: rgba(0, 0, 0, 0.5);
+}
+
+.modal-content {
+    background-color: #fefefe;
+    margin: 15% auto;
+    padding: 20px;
+    border: 1px solid #888;
+    width: 80%;
+    max-width: 50%;
+    box-shadow: 0 5px 15px rgba(0, 0, 0, 0.3);
+    animation: modalopen 0.4s;
+}
+
+@keyframes modalopen {
+    from { opacity: 0; transform: translateY(-50px); }
+    to { opacity: 1; transform: translateY(0); }
+}
+
+.close {
+    color: #aaa;
+    float: right;
+    font-size: 28px;
+    font-weight: bold;
+}
+
+.close:hover,
+.close:focus {
+    color: black;
+    text-decoration: none;
+    cursor: pointer;
+}
\ No newline at end of file