feat: button has been migrated

docs/index.html

@@ -36,6 +36,14 @@
         <li><a href="https://derec4.github.io/ut-grade-distribution-viewer/index">Home</a></li>
         <li><a href="https://derec4.github.io/ut-grade-distribution-viewer/about">About</a></li>
         <li><a href="https://derec4.github.io/ut-grade-distribution-viewer/changelog">Changelog</a></li>
+        <div class="top-left">
+          <input type="checkbox" class="checkbox" id="colorToggle">
+          <label for="colorToggle" class="checkbox-label">
+            <i class="fas fa-moon"></i>
+            <i class="fas fa-sun"></i>
+            <span class="ball"></span>
+          </label>
+        </div>
     </ul>
   </nav>  
   <div class="wrapper">
@@ -101,16 +109,10 @@
       </div>
     </div>
   </div>
-  <div class="footy">Created by Derek Chen
+  <div class="footy">
+    <p>Created by Derek Chen</p>
     <!-- because VAPA lecture was a bit boring that day -->
-    <div>
+    <p>Help keep our site up by <a href="https://www.paypal.com/donate/?business=ND35WHTPKM494&no_recurring=0&item_name=Help+support+our+grade+distribution+site+and+other+tools%21&currency_code=USD">supporting it here!</a></p>
-      <input type="checkbox" class="checkbox" id="colorToggle">
-      <label for="colorToggle" class="checkbox-label">
-        <i class="fas fa-moon"></i>
-        <i class="fas fa-sun"></i>
-        <span class="ball"></span>
-      </label>
-    </div>
     <iframe
       src="https://ghbtns.com/github-btn.html?user=Derec4&repo=ut-grade-distribution-viewer&type=star&count=true&size=large"
       frameborder="0" scrolling="0" width="100" height="30" title="GitHub">

docs/main.css

@@ -206,6 +206,15 @@ h1 {
     gap: 10px;
 }
 
+.top-left {
+    position: fixed;
+    top: 10px;
+    left: 15px;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+}
+
 .checkbox {
     opacity: 0;
     position: absolute;