Update DoBT to be up to date with the current site.

Alex-Toucan · Nov 30, 2024 · 5430c30 · 5430c30
1 parent 0a30dfe
commit 5430c30
Show file tree

Hide file tree

Showing 12 changed files with 6,729 additions and 36,215 deletions.
diff --git a/public/static/bootstrap.css b/public/static/bootstrap.css
diff --git a/public/static/bootstrap.css.map b/public/static/bootstrap.css.map
diff --git a/public/static/other.css b/public/static/other.css
diff --git a/public/static/purecookie.js b/public/static/purecookie.js
@@ -2,75 +2,55 @@
 var purecookieTitle = "Cookies."; // Title
 var purecookieIcon = '<i class="bi bi-cookie me-2"></i>' // Cookie icon
 var purecookieDesc = "By using this website, you automatically accept that we use cookies."; // Description
-var purecookieLink = '<a href="https://atproducts.xyz/privacy#cookies" target="_blank" rel="noopener noreferrer">Why?</a>'; // Cookiepolicy link
+var purecookieLink = '<a href="/privacy#cookies" target="_blank" rel="noopener noreferrer">Why?</a>'; // Cookie policy link
 var purecookieButton = "Understood"; // Button text
 // ---        --- //
 
+function pureFadeIn(elem, display) {
+  $("#" + elem).css({opacity: 0, display: display || "block"}).animate({opacity: 1}, 500);
+}
 
-function pureFadeIn(elem, display){
-  var el = document.getElementById(elem);
-  el.style.opacity = 0;
-  el.style.display = display || "block";
-
-  (function fade() {
-    var val = parseFloat(el.style.opacity);
-    if (!((val += .02) > 1)) {
-      el.style.opacity = val;
-      requestAnimationFrame(fade);
-    }
-  })();
-};
-
-function pureFadeOut(elem){
-  var el = document.getElementById(elem);
-  el.style.opacity = 1;
-
-  (function fade() {
-    if ((el.style.opacity -= .02) < 0) {
-      el.style.display = "none";
-    } else {
-      requestAnimationFrame(fade);
-    }
-      setTimeout(() => {
-      var theelement = document.querySelector('#cookieConsentContainer');
-     		if (theelement) {
-      		theelement.remove();
-      	};
-      }, 1350);
-  })();
-};
+function pureFadeOut(elem) {
+  $("#" + elem).animate({opacity: 0}, 500, function(){
+    $(this).css("display", "none").delay(1350).queue(function(){
+      $(this).remove().dequeue();
+    });
+  });
+}
 
-function setCookie(name,value,days) {
-    var expires = "";
-    if (days) {
-        var date = new Date();
-        date.setTime(date.getTime() + (days*24*60*60*1000));
-        expires = "; expires=" + date.toUTCString();
-    }
-    document.cookie = name + "=" + (value || "")  + expires + "; path=/";
+function setCookie(name, value, days) {
+  var expires = "";
+  if (days) {
+    var date = new Date();
+    date.setTime(date.getTime() + (days*24*60*60*1000*4.28571428571));
+    expires = "; expires=" + date.toUTCString();
+  }
+  document.cookie = name + "=" + (value || "") + expires + "; path=/";
 }
+
 function getCookie(name) {
-    var nameEQ = name + "=";
-    var ca = document.cookie.split(';');
-    for(var i=0;i < ca.length;i++) {
-        var c = ca[i];
-        while (c.charAt(0)==' ') c = c.substring(1,c.length);
-        if (c.indexOf(nameEQ) == 0) return c.substring(nameEQ.length,c.length);
-    }
-    return null;
+  var nameEQ = name + "=";
+  var ca = document.cookie.split(';');
+  for (var i = 0; i < ca.length; i++) {
+    var c = ca[i];
+    while (c.charAt(0) == ' ') c = c.substring(1, c.length);
+    if (c.indexOf(nameEQ) == 0) return c.substring(nameEQ.length, c.length);
+  }
+  return null;
 }
+
 function eraseCookie(name) {
-    document.cookie = name+'=; Max-Age=-99999999;';
+  document.cookie = name + '=; Max-Age=-99999999;';
 }
 
-document.addEventListener('DOMContentLoaded', () => {
-      if (!getCookie('purecookieDismiss')) {
-        document.querySelector('div#page').innerHTML += '<div class="cookieConsentContainer" id="cookieConsentContainer"><div class="cookieTitle"><span>' + purecookieIcon + '' + purecookieTitle + '</span></div><div class="cookieDesc"><p>' + purecookieDesc + ' ' + purecookieLink + '</p></div><div class="cookieButton"><button onClick="purecookieDismiss();">' + purecookieButton + '</button></div></div>';
-    	pureFadeIn("cookieConsentContainer");
-      }
+$(document).ready(function() {
+  if (!getCookie('purecookieDismiss')) {
+    $('div#page').append('<div class="cookieConsentContainer bg-secondary-subtle rounded-md-3 shadow-lg" id="cookieConsentContainer"><div class="h4">' + purecookieIcon + '' + purecookieTitle + '</div><div class="my-3"><p>' + purecookieDesc + ' ' + purecookieLink + '</p></div><button class="btn btn-dl" onclick="purecookieDismiss();">Understood</button></div>');
+    pureFadeIn("cookieConsentContainer");
+  }
 });
 
 function purecookieDismiss() {
-  setCookie('purecookieDismiss','1',7);
+  setCookie('purecookieDismiss', '1', 7);
   pureFadeOut("cookieConsentContainer");
-}
+}
diff --git a/src/layouts/Head.astro b/src/layouts/Head.astro
@@ -1,15 +1,23 @@
 ---
-const { title, heroid, icon, bulletin, description, keywords, author, additionalContent } = Astro.props;
+const { highlight, title, heroid, icon, bulletin, description, keywords, author, additionalContent } = Astro.props;
 ---
+
 <!DOCTYPE html>
 <html class="fixedtopnavimage" lang="en">
   <head>
       <title>{title}</title> 
+      <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.css" integrity="sha384-QWTKZyjpPEjISv5WaRU9OFeRpok6YctnYmDr5pNlyT2bRjXh0JMhjY6hW+ALEwIH" crossorigin="anonymous">
+      <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/[email protected]/font/bootstrap-icons.min.css">
+      {highlight && (
+        <link rel="stylesheet" href="/static/highlight.css">
+      )}
       <link rel="stylesheet" href="/static/cookie.css">
-      <link rel="stylesheet" href="/static/bootstrap.css">
-      <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap-icons/font/bootstrap-icons.min.css">
-      <link rel="preload" as="style" href="/static/bootstrap.css">
+      <link rel="stylesheet" href="/static/other.css">
+      <link rel="preload" as="style" href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/css/bootstrap.min.css">
+      <link rel="preload" as="style" href="/static/other.css">
       <link rel="preload" as="script" href="/static/darkmode.js">
+      <link rel="preload" as="script" href="/static/alert-1.js">
+      <link rel="preload" as="script" href="/static/alert-2.js">
       {heroid ?
         <>
         <link rel="preload" as="image" href={`/media/images/hero-${heroid}.webp`}>
@@ -21,7 +29,7 @@ const { title, heroid, icon, bulletin, description, keywords, author, additional
       }
       {bulletin && bulletin.map(({ bulletinImage }, index) => (
         bulletinImage ? (
-            <link key={index} rel="preload" as="image" href={`/media/slideshow/${bulletinImage}`} />
+            <link rel="preload" as="image" href={`/media/slideshow/${bulletinImage}`} />
         ) : null
       ))}
       {icon ?
@@ -41,11 +49,11 @@ const { title, heroid, icon, bulletin, description, keywords, author, additional
           <link rel="mask-icon" href="/media/favicon/safari-pinned-tab.svg" color="#5bbad5">
           <meta property="og:image" content="/media/favicon/iconembed.png">
           <meta name="twitter:image" content="/media/favicon/iconembed.png">
-          <meta name="msapplication-TileColor" content="#da532c">
         </Fragment>
       }    
       <link rel="manifest" href="/media/favicon/site.webmanifest">
       <meta charset="UTF-8">
+      <meta name="msapplication-TileColor" content="#da532c">
       <meta name="title" content={title}>
       <meta name="description" content={description}>
       <meta name="twitter:card" content="summary">
@@ -62,7 +70,8 @@ const { title, heroid, icon, bulletin, description, keywords, author, additional
       <meta property="og:title" content={title}>
       <meta property="og:description" content={description}>
       <meta name="viewport" content="width=device-width, initial-scale=1.0">
+      <meta http-equiv="X-UA-Compatible" content="IE=edge">
       <Fragment set:html={additionalContent}>
       <script is:inline src="/static/darkmode.js"></script>
   </head>
-  <body class="fixedtopnavimage">
+  <body class="fixedtopnavimage">
diff --git a/src/layouts/Scripts.astro b/src/layouts/Scripts.astro
@@ -1,23 +1,28 @@
 ---
-const { fourofour, index, modal, accordion, scrollspy } = Astro.props;
+const { highlight, fourofour, index, modal, accordion, scrollspy } = Astro.props;
 ---
-<script is:inline src="https://cdn.jsdelivr.net/npm/bootstrap/dist/js/bootstrap.bundle.min.js"></script>
-<script is:inline src="https://cdn.jsdelivr.net/npm/jquery@4.0.0-beta/dist/jquery.min.js"></script>
+<script is:inline src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/js/bootstrap.bundle.min.js" integrity="sha384-YvpcrYf0tY3lHB60NNkmXc5s9fDVZLESaAA55NDzOxhy9GkcIdslK1eN7N6jIeHz" crossorigin="anonymous"></script>
+<script is:inline src="https://cdn.jsdelivr.net/npm/jquery@3.7.1/dist/jquery.min.js"></script>
 <script is:inline src="https://cdn.jsdelivr.net/npm/jquery-ui/dist/jquery-ui.min.js"></script>
+{highlight && (
+  <script src="https://cdnjs.cloudflare.com/ajax/libs/highlight.js/11.9.0/highlight.min.js"></script>
+  <script src="https://cdnjs.cloudflare.com/ajax/libs/highlight.js/11.9.0/languages/go.min.js"></script>
+  <script>hljs.highlightAll();</script>
+)}
+<script is:inline src="/static/message.js"></script>
 <script is:inline src="/static/scroll.js"></script>
 <script is:inline src="/static/purecookie.js"></script>
+<script is:inline src="/static/alert-1.js"></script>
+<script is:inline src="/static/alert-2.js"></script>
 <script is:inline src="/static/enabler.js"></script>
 {fourofour && (
   <script is:inline src="/static/404.js"></script>
 )}
 {modal && (
   <script is:inline src="/static/modal-id.js"></script>
-  <script is:inline src="/static/accordion-id.js"></script>
-  <script is:inline src="/static/scrollspy-id.js"></script>
 )} 
 {accordion && (
   <script is:inline src="/static/accordion-id.js"></script>
-  <script is:inline src="/static/scrollspy-id.js"></script>
 )}    
 {scrollspy && (
   <script is:inline src="/static/scrollspy-id.js"></script>
@@ -26,4 +31,4 @@ const { fourofour, index, modal, accordion, scrollspy } = Astro.props;
   <script is:inline src="/static/index.js"></script>
 )}    
 </body>
-</html>
+</html>
diff --git a/src/pages/404.astro b/src/pages/404.astro
@@ -8,21 +8,21 @@ import BackToTop from '../components/BackToTop.astro';
 ---
 
 <Head title="Error 404" heroid="web" description="The content the publisher attempted to share, doesn't exist. This is a 404 page after all..." author="Alex Toucan" />
-      <div id="page">
-<Navbar />
-     <main id="404" class="text-center">
-         <Hero
-         id="web"
-         title="404"
-         titleClasses="lh-1 fs-16"
-         description="Oops, it seems like you hit the wrong page, as the HTML error 404 means that the file you attempted to reach was not found/invalid. Either, check the URL bar to see if there's a spelling mistake or redirect to the previous page."
-         errorButton="<input class='btn btn-primary w-100 col-md' type='button' value='Return' id='404btn' aria-label='Return'>"
-         secondaryHref="/"
-         secondaryText="Index Page"
-         container="true"
-       />
-</main>
-<Footer hr="none"/>
-<BackToTop />
+<div id="page">
+  <Navbar />
+  <main id="404" class="text-center">
+    <Hero
+      id="web"
+      title="404"
+      titleClasses="lh-1 fs-16"
+      description="Oops, it seems like you hit the wrong page, as the HTML error 404 means that the file you attempted to reach was not found/invalid. Either, check the URL bar to see if there's a spelling mistake or redirect to the previous page."
+      errorButton="<input class='btn btn-primary w-100 col-md' type='button' value='Return' id='404btn' aria-label='Return'>"
+      secondaryHref="/"
+      secondaryText="Index Page"
+      container="true"
+    />
+  </main>
+  <Footer hr="none"/>
+  <BackToTop />
 </div>
 <Scripts fourofour="true" />
diff --git a/src/pages/apply/index.astro b/src/pages/apply/index.astro
@@ -8,61 +8,61 @@ import BackToTop from '../../components/BackToTop.astro';
 ---
 
 <Head title="ATPLLC DoBT - Applying for the DoBT" description="Apply for the Department of Beta Testing of AT Products LLC." author="Alex Toucan"/>
-      <div id="page">
-<Navbar />
- <Hero
-  id="codinghome"
-  title="Applying for the DoBT"
-  description="Apply for the DoBT today!"
-  primaryHref="#form"
-  primaryText="Application Form"
-  secondaryHref="/media/pdf/DoBT Backup Application Form.pdf"
-  secondaryText="Backup Physical Form"
+<div id="page">
+  <Navbar />
+  <Hero
+    id="codinghome"
+    title="Applying for the DoBT"
+    description="Apply for the DoBT today!"
+    primaryHref="#form"
+    primaryText="Application Form"
+    secondaryHref="/media/pdf/DoBT Backup Application Form.pdf"
+    secondaryText="Backup Physical Form"
   />
-    <main id="apply" class="container">
-<div id="how">
+  <main id="apply" class="container">
+    <div id="how">
       <h2>How to Apply</h2>
       <p><b>We highly recommend that all applicants read our <a href="/guidelines">guidelines</a> before submitting their application.</b></p>
       <p>If you cannot take this online form, you may take this <a href="/media/pdf/DoBT Backup Application Form.pdf">PDF version form</a> instead.</p>
       <p>To apply as a beta tester, please fill out the form below and include a brief statement about why you want to join our beta testing team. Your insights and feedback are invaluable to us!</p>
       <p>Upon submission of your application, our team will review it and provide you with further instructions via email. Please note that beta testing with us is voluntary and unpaid unless otherwise specified.</p>
       <p>We look forward to welcoming you to the AT Products LLC's Department of Beta Testing!</p>
-</div>
-<hr>
-<div id="form">
-<h2>Application Form</h2>
-    <p>To apply for the Department of Beta Testing, please fill out the form below. This form is specifically for applying to become a beta tester and should not be used for general inquiries. If you have general questions or feedback, please use the <a href="https://atproducts.xyz/form/">main website's contact form</a> or <a href="mailto:[email protected]">email us directly</a>.</p>
-<form
-  name="DoBT Apply Form" 
-  action="/form/success"
-  method="POST"
-  data-netlify="true"
-  enctype="multipart/form-data"
-class>
-<div class="d-sm-flex gap-2">
-<div class="col">
-    <div class="mb-3">
-      <label for="nameInput" class="form-label fw-bold">Name</label>
-      <input name="name" class="form-control" id="nameInput" placeholder="John Doe" required>
     </div>
-</div>
-<div class="col">
-<div class="mb-3">
-  <label for="emailInput" class="form-label fw-bold">Email address</label>
-  <input name="Email" type="email" class="form-control" id="emailInput" placeholder="[email protected]" required>
-</div>
-</div>
-</div>
-<div class="mb-2">
-  <label for="textareaInput" class="form-label fw-bold">Application</label>
-  <textarea name="Text" class="form-control" id="textareaInput" rows="3" required></textarea>
-</div>
-<small>If you wish to upload files, you will have to resort to <a href="mailto:[email protected]">emailing us manually</a> due to Netlify complications.</small>
-<button type="submit" class="mt-2 btn btn-lg btn-primary col-12">Submit</button>
-</form>
-</div>
-</main>
-<Footer />
-<BackToTop />
+    <hr>
+    <div id="form">
+      <h2>Application Form</h2>
+          <p>To apply for the Department of Beta Testing, please fill out the form below. This form is specifically for applying to become a beta tester and should not be used for general inquiries. If you have general questions or feedback, please use the <a href="https://atproducts.xyz/form/">main website's contact form</a> or <a href="mailto:[email protected]">email us directly</a>.</p>
+      <form
+        name="DoBT Apply Form" 
+        action="/form/success"
+        method="POST"
+        data-netlify="true"
+        enctype="multipart/form-data"
+      >
+        <div class="d-sm-flex gap-2">
+          <div class="col">
+              <div class="mb-3">
+                <label for="nameInput" class="form-label fw-bold">Name</label>
+                <input name="name" class="form-control" id="nameInput" placeholder="John Doe" required>
+              </div>
+          </div>
+          <div class="col">
+            <div class="mb-3">
+              <label for="emailInput" class="form-label fw-bold">Email address</label>
+              <input name="Email" type="email" class="form-control" id="emailInput" placeholder="[email protected]" required>
+            </div>
+          </div>
+        </div>
+        <div class="mb-2">
+          <label for="textareaInput" class="form-label fw-bold">Application</label>
+          <textarea name="Text" class="form-control" id="textareaInput" rows="3" required></textarea>
+        </div>
+        <small>If you wish to upload files, you will have to resort to <a href="mailto:[email protected]">emailing us manually</a> due to Netlify complications.</small>
+        <button type="submit" class="mt-2 btn btn-lg btn-primary col-12">Submit</button>
+      </form>
+    </div>
+  </main>
+  <Footer />
+  <BackToTop />
 </div>
 <Scripts />
diff --git a/src/pages/apply/success.astro b/src/pages/apply/success.astro
@@ -7,17 +7,17 @@ import BackToTop from '../../components/BackToTop.astro';
 ---
 
 <Head title="Success - Application Form" description="We got your submission successfully!" author="Alex Toucan"/>
-      <div id="page">
-<Navbar />
-    <main id="success" class="container text-center my-4">
-      <i class="bi bi-check-lg fs-16 text-body-secondary"></i>
-      <p class="mt-3 text-body-secondary fs-2">Thanks for your submission, we'll reach out to you soon.</p>
-      <a class="icon-link icon-link-hover fs-5" href="/">Return Home
-      <i class="bi bi-arrow-right h-100"></i></a>
-<hr class="mx-2 mt-5">
-      <p class="figure-caption">Reloading this page may resubmit what you previously submitted.</p>
-    </main>
-<Footer />
-<BackToTop />
+<div id="page">
+  <Navbar />
+  <main id="success" class="container text-center my-4">
+    <i class="bi bi-check-lg fs-16 text-body-secondary"></i>
+    <p class="mt-3 text-body-secondary fs-2">Thanks for your submission, we'll reach out to you soon.</p>
+    <a class="icon-link icon-link-hover fs-5" href="/">Return Home
+    <i class="bi bi-arrow-right h-100"></i></a>
+    <hr class="mx-2 mt-5">
+    <p class="figure-caption">Reloading this page may resubmit what you previously submitted.</p>
+  </main>
+  <Footer />
+  <BackToTop />
 </div>
 <Scripts />