From 636b040671fb4c9d0b0969f969f314c9623e4214 Mon Sep 17 00:00:00 2001
From: Aaron <80724707+Sirdug@users.noreply.github.com>
Date: Sun, 20 Oct 2024 23:47:59 -0400
Subject: [PATCH] started site overhual

---
 index.html                      | 43 +++++++++++++--------
 about.html => legacy/about.html |  0
 about.js => legacy/about.js     |  0
 script.js                       | 39 ++++++-------------
 style.css                       | 66 ++++++++++++++++++++++++++++++++-
 temppass.txt                    |  1 -
 6 files changed, 104 insertions(+), 45 deletions(-)
 rename about.html => legacy/about.html (100%)
 rename about.js => legacy/about.js (100%)
 delete mode 100644 temppass.txt
diff --git a/index.html b/index.html
index 22450ae..f8a93a4 100644
--- a/index.html
+++ b/index.html
@@ -6,43 +6,55 @@
   <title>sirdug.dev</title>
   <link rel="icon" type="image/x-icon" href="/images/sirdug.jpg">
   <link rel="stylesheet" href="./style.css">
-
+  <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.0.0-beta3/css/all.min.css">
 </head>
 
 <body>
-  <nav class="navbar">
-    <ul class="navbar-menu">
-      <li><a class="homepage" href="index.html">Home</a></li>
-      <li><a href="about.html">About</a></li>
-      <li><a href="games.html">Games</a></li>
-      <li><a href="servers.html">Servers</a></li>
-      <li><a href="AI.html">AI Chatbot</a></li>
-    </ul>
-  </nav>
+  <div class="navbar-menu">
+    <button class="button-86" onclick="location.href='index.html'">Home</button>
+    <button class="button-86" onclick="toggleDropdown()">About</button>
+    <button class="button-86" onclick="location.href='games.htm'">Games</button>
+    <button class="button-86" onclick="location.href='servers.htm'">Servers</button>
+    <button class="button-86" onclick="location.href='AI.htm'">AI Chatbot</button>
+  </div>
+
+  <div id="aboutDropdown" class="dropdown-content">
+    <div class="pokemon-card">
+      <img src="/images/sirdug.jpg" alt="Pokemon" class="pokemon-image">
+      <div class="pokemon-info">
+        <h2>Sirdug</h2>
+        <p>I made this junk :)</p>
+      </div>
+      <div class="pokemon-discord">
+        <i class="fab fa-discord"></i>
+        <span>sirdug</span>
+      </div>
+      <div class="pokemon-github">
+        <i class="fab fa-github"></i>
+        <span>sirdug</span>
+      </div>
+    </div>
+  </div>
 
   <div class="card">
     <svg viewBox="0 0 100% 100%" xmlns='http://www.w3.org/2000/svg' class="noise">
       <filter id='noiseFilter'>
         <feTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='6' stitchTiles='stitch' />
       </filter>
-
       <rect width='100%' height='100%' preserveAspectRatio="xMidYMid meet" filter='url(#noiseFilter)' />
     </svg>
     <div class="content">
-
       <h1>Homepage</h1>
       <p class="lol">This is under construction</p>
       <p class="lol">...also idk what to put here</p>
-
-
     </div>
   </div>
+
   <div class="gradient-bg">
     <svg viewBox="0 0 100vw 100vw" xmlns='http://www.w3.org/2000/svg' class="noiseBg">
       <filter id='noiseFilterBg'>
         <feTurbulence type='fractalNoise' baseFrequency='0.6' stitchTiles='stitch' />
       </filter>
-
       <rect width='100%' height='100%' preserveAspectRatio="xMidYMid meet" filter='url(#noiseFilterBg)' />
     </svg>
     <svg xmlns="http://www.w3.org/2000/svg" class="svgBlur">
@@ -65,7 +77,6 @@ <h1>Homepage</h1>
   </div>
 
   <script src="./script.js"></script>
-
 </body>
 
 <footer class="footer1">
diff --git a/about.html b/legacy/about.html
similarity index 100%
rename from about.html
rename to legacy/about.html
diff --git a/about.js b/legacy/about.js
similarity index 100%
rename from about.js
rename to legacy/about.js
diff --git a/script.js b/script.js
index 3e26ed4..eec3f24 100644
--- a/script.js
+++ b/script.js
@@ -21,51 +21,36 @@ document.addEventListener('DOMContentLoaded', () => {
 });
 
 function clicktocopy() {
-  // Get the text field
   var copyText = document.getElementById("sirdug");
-
-  // Select the text field
   copyText.select();
   copyText.setSelectionRange(0, 99999); // For mobile devices
-
-   // Copy the text inside the text field
   navigator.clipboard.writeText(copyText.value);
-
-  // Alert the copied text
   alert("Copied the text: " + copyText.value);
 }
 
-
-
-
-
-
-
-
 var countDownDate = new Date("August 18, 2024 12:00:00").getTime();
-
-// Update the count down every 1 second
 var x = setInterval(function() {
-
-  // Get todays date and time
   var now = new Date().getTime();
-
-  // Find the distance between now an the count down date
   var distance = countDownDate - now;
-
-  // Time calculations for days, hours, minutes and seconds
   var days = Math.floor(distance / (1000 * 60 * 60 * 24));
   var hours = Math.floor((distance % (1000 * 60 * 60 * 24)) / (1000 * 60 * 60));
   var minutes = Math.floor((distance % (1000 * 60 * 60)) / (1000 * 60));
   var seconds = Math.floor((distance % (1000 * 60)) / 1000);
-
-  // Display the result in the element with id="demo"
   document.getElementById("demo").innerHTML = days + "d " + hours + "h "
   + minutes + "m " + seconds + "s ";
-
-  // If the count down is finished, write some text 
   if (distance < 0) {
     clearInterval(x);
     document.getElementById("demo").innerHTML = "EXPIRED";
   }
-}, 1000);
\ No newline at end of file
+}, 1000);
+
+function toggleDropdown() {
+  const dropdown = document.getElementById('aboutDropdown');
+  if (dropdown.classList.contains('show')) {
+    dropdown.classList.remove('show');
+    dropdown.classList.add('hide');
+  } else {
+    dropdown.classList.remove('hide');
+    dropdown.classList.add('show');
+  }
+}
\ No newline at end of file
diff --git a/style.css b/style.css
index 3985fd6..3bedbe8 100644
--- a/style.css
+++ b/style.css
@@ -336,6 +336,12 @@ p {
 }
 
 .navbar-menu {
+  position: fixed;
+  top: 0;
+  width: 100%;
+  background-color: transparent; /* Make background transparent */
+  z-index: 1000;
+  padding: 10px 20px;
   display: flex;
   justify-content: center;
   gap: 20px;
@@ -351,6 +357,7 @@ p {
   font-family: "Montserrat", sans-serif;
   font-weight: 700;
   transition: color 0.3s;
+  
 }
 
 .navbar-menu a:hover {
@@ -478,4 +485,61 @@ padding: 30px;
   font-family: "Montserrat", sans-serif;
   font-weight: 700;
   box-shadow: 0 -2px 10px rgba(0, 0, 0, 0.5);
-}
\ No newline at end of file
+}
+
+.dropdown-content {
+  visibility: hidden;
+  position: fixed;
+  top: 50%;
+  left: 50%;
+  transform: translate(-50%, -50%) scale(0.9);
+  background-color: rgba(255, 255, 255, 0.2); /* Semi-transparent background */
+  backdrop-filter: blur(10px); /* Blur effect */
+  min-width: 200px;
+  box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
+  z-index: 1001;
+  padding: 20px;
+  border-radius: 8px;
+  opacity: 0;
+  transition: opacity 0.5s ease, transform 0.5s ease;
+}
+
+.dropdown-content.show {
+  visibility: visible;
+  opacity: 1;
+  transform: translate(-50%, -50%) scale(1);
+}
+
+.dropdown-content.hide {
+  visibility: hidden;
+  opacity: 0;
+  transform: translate(-50%, -50%) scale(0.9);
+}
+
+.pokemon-card {
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+}
+
+.pokemon-image {
+  width: 100px;
+  height: 100px;
+  border-radius: 50%;
+  border: 3px solid #000;
+}
+
+.pokemon-info {
+  padding-top: 15px;
+  text-align: center;
+}
+
+.pokemon-discord,
+.pokemon-github {
+  display: flex;
+  align-items: center;
+  gap: 8px;
+  padding-top: 10px;
+  font-size: 24px;
+}
+
diff --git a/temppass.txt b/temppass.txt
deleted file mode 100644
index 8e55920..0000000
--- a/temppass.txt
+++ /dev/null
@@ -1 +0,0 @@
-5357d8ee2fcd53184e2b2e2aec8837bfa83725a2
