QoL Improvements

contact_page/contact.html

@@ -206,7 +206,7 @@ <h1> Contact Me</h1>
               </a>
             </div>
             By contacting me, you agree that your data may be managed in-line with our <button
-              class="abstract-link under-overlay under-modal-overlay" type="button" aria-expanded="false"
+              class="abstract-link under-overlay under-modal-overlay privacy-link" type="button" aria-expanded="false"
               aria-controls="Privacy_Policy" style="margin-left:0.1rem"> <i class="abstract-icon icon-angle-right"></i>
               Privacy Policy
             </button>
@@ -254,6 +254,11 @@ <h1> Contact Me</h1>
                 ask us to restrict the processing of your personal information at any stage. You can remove your
                 consent to us storing communications at any time, by contacting us once more with your request.
               </p>
+              <div class="close-privacy-bar">
+                <button class="under-modal-overlay under-overlay" id="close-privacy-button" type="button"
+                  aria-expanded="false" aria-controls="Privacy_Policy" aria-label="close privacy policy">Close<i
+                    class="abstract-icon icon-close"></i></button>
+              </div>
             </div>
 
             <div class="contact-spacer"></div>

global/main.css

@@ -654,10 +654,9 @@ main a:visited {
 }
 
 .Review-section {
-  border-radius: 10px;
-  padding: 5px 15px;
-  padding-bottom: 10px;
-  margin: 20px 5px;
+  border-radius: 0.6rem;
+  padding: 0.3rem 0.9rem 0.6rem 0.9rem;
+  margin: 1.2rem 0.3rem;
   background-color: var(--background-mid-accent);
 }
 
@@ -674,6 +673,7 @@ a:focus-visible,
 button:focus-visible,
 #menu-toggle:focus-visible,
 #close-terms-button:focus-visible,
+#close-privacy-button:focus-visible,
 #terms-conditions:focus-visible,
 .sidebar-nav .sidebar-text li a:focus-visible {
   border: 2px solid white;
@@ -684,7 +684,8 @@ button:focus-visible,
 #wrapper button:focus-visible,
 #menu-toggle:focus-visible,
 #terms-conditions:focus-visible,
-#close-terms-button:focus-visible {
+#close-terms-button:focus-visible,
+#close-privacy-button:focus-visible {
   outline: none;
 }
 
@@ -951,6 +952,27 @@ button:focus-visible,
   padding-right: 0.3rem;
 }
 
+.close-privacy-bar {
+  display: flex;
+  flex-direction: row;
+}
+
+#close-privacy-button {
+  margin: 0rem 1rem 0.5rem 1rem;
+  display: inline-block;
+  justify-content: flex-end;
+  flex-grow: 1;
+  align-self: right;
+  align-items: right;
+  text-align: right;
+  cursor: pointer;
+  font-size: var(--footnote-font-size);
+  color: var(--foreground-active-blue);
+  background: none;
+  border: none;
+  padding: 0;
+}
+
 .form-container {
   margin: 0.2rem;
 }
@@ -1439,9 +1461,7 @@ textarea {
 }
 
 .Youtube-section {
-  padding-right: 0;
-  padding-top: 8px;
-  padding-bottom: 8px;
+  padding: 0.5rem 0.3rem 0.5rem 0.9rem;
   margin-top: 0.3rem;
   margin-bottom: 0.3rem;
 }
@@ -1632,6 +1652,11 @@ textarea {
     text-decoration: underline;
   }
 
+  #close-privacy-button:hover {
+    color: var(--foreground-clicked-blue);
+    text-decoration: underline;
+  }
+
   /* Buttons in card carousel */
   .slider-button:hover {
     border-color: var(--foreground-clicked-blue);
@@ -1800,7 +1825,7 @@ textarea {
   }
 
   .Youtube-section {
-    padding-right: 5px;
+    padding-right: 0.9rem;
   }
 
   .teach-column-inner {

global/script.js

@@ -12,7 +12,7 @@ $(document).ready(function () {
         )
       )
         check = true;
-    })(navigator.userAgent || navigator.vendor || window.opera);
+    })(navigator.userAgent || window.opera);
     return check;
   }
 
@@ -95,13 +95,43 @@ $(document).ready(function () {
   $(".abstract-link").click(function () {
     if ($(this).hasClass("abstract-toggled")) {
       $(this).attr("aria-expanded", "false");
+      if ($(this).hasClass("privacy-link")) {
+        $(this)
+          .next(".abstract-container")
+          .children()
+          .children("#close-privacy-button")
+          .attr("aria-expanded", "false");
+      }
     } else {
       $(this).attr("aria-expanded", "true");
+      if ($(this).hasClass("privacy-link")) {
+        $(this)
+          .next(".abstract-container")
+          .children()
+          .children("#close-privacy-button")
+          .attr("aria-expanded", "true");
+      }
     }
     $(this).next(".abstract-container").slideToggle(200);
     $(this).toggleClass("abstract-toggled");
   });
 
+  // JQuery for privacy
+  $("#close-privacy-button").click(function () {
+    $(this).parent().parent(".abstract-container").slideToggle(200);
+    $(this)
+      .parent()
+      .parent(".abstract-container")
+      .prev(".abstract-link")
+      .toggleClass("abstract-toggled");
+    $(this)
+      .parent()
+      .parent(".abstract-container")
+      .prev(".abstract-link")
+      .attr("aria-expanded", "false");
+    $(this).attr("aria-expanded", "false");
+  });
+
   // JQuery for closing sidebar if element linking to current page clicked
   $(".dropdown-item-current").click(function () {
     onFadeOut();

index.html

@@ -290,15 +290,15 @@ <h3 class="card-name"> New Pages Coming Soon!
                         </p>
                         <ul class="compact-list">
                           <li>
-                            Art Gallery Page,
+                            Art Gallery Page
                           </li>
                           <li>
                             Code Catalogue (In the meantime, samples of my code can be found on my <a
                               href="https://github.com/LewisN3142/"
                               class="under-overlay under-modal-overlay external-link link-back-card" tabindex="-1"
                               rel="noopener noreferrer">
                               GitHub
-                            </a>),
+                            </a>)
                           </li>
                           <li>
                             Music Page (including covers and original recordings)