FIX: nicer footer and about, also fixed 404 mechanism when visiting index

public/404.php

@@ -1 +1,2 @@
-<h1>Sie haben hier nichts zu suchen.</h1>
+<h1>You don't belong here.</h1>
+<p>The technical term would be '404' or something.</p>

public/about.php

@@ -1,19 +1,22 @@
 <h1 class='cat_heading'>> chosen file type: person<br>&nbsp;&nbsp;getting to know me is futile...<br>&nbsp;&nbsp;listing files...</h1>
 
-<h2>I am a human. Treat me as such.</h2>
+<h2>I am a human. Treat me as such. I will reciprocate.</h2>
 
 <div style='display: flex'>
   <p>
-    This is a block of text about me.<br>
-    Very fascinating.<br><br>
-    Exhilarating, almost.<br><br>
-    This site was created solely by human hands without the use of AI.<br><br>
-    Also, documents are being dynamically built using php, relying heavily on the resources of the server. 
-    That means that the number of simultanious visitors is restricted and both visiting and running the site is discouraged.<br>
+    This is a hunk of text about me and my website.<br>
+    Very fascinating indeed.<br><br>
+    I endorse free and open software.<br><br>
+    This site was created solely by human hands without the use of AI.<br>
+    You could call it 'organic', I guess.<br><br>
+    Also, documents are being dynamically built using php, relying on the resources of the server, so to say. 
+    That means that the number of simultaneous visitors will be restricted. That way both visiting and running the site is kind of discouraged.<br>
     So, in turn, this site represents my personality traits in the '''real''' world. 
-    (People of culture would call this 'edgy tsundere behaviour', but what do they know...)
+    (People of culture would call this 'edgy tsundere behavior', but what do they know...)<br><br>
+    Let's all love Lain! &#10084;<br>
+    - Dani aka TheShinyMelon
   </p>
-  <img src='./resources/img/about-me.gif' style='height: 8rem;' class='pixelart'>
+  <img src='./resources/img/about-me.gif' style='height: 10rem; margin: 5rem;' class='pixelart'>
 </div>
 
 <?php

public/index.php

@@ -25,38 +25,53 @@
   <div style='height: 4vh;'></div>
 </body>
 
-<?php
-  require_once('../app/config.php');
-  $el = isset($_GET['el']) ? $_GET['el'] : '';
-    
-  switch($el) {
-    case 'image': 
-      include('image.php');
-      break;
+<div class='big_content'>
+  <?php
+    require_once('../app/config.php');
+    $el = isset($_GET['el']) ? $_GET['el'] : 'index';
+      
+    switch($el) {
+      case 'index':
+        break;
 
-    case 'audio':
-      include('audio.php');
-      break;
+      case 'image': 
+        include('image.php');
+        break;
 
-    case 'video':
-      include('video.php');
-      break;
+      case 'audio':
+        include('audio.php');
+        break;
 
-    case 'text':
-      include('text.php');
-      break;
+      case 'video':
+        include('video.php');
+        break;
 
-    case 'about':
-      include('about.php');
-      break;
+      case 'text':
+        include('text.php');
+        break;
 
-    default: 
-      include('404.php');
-      break;  
-  }
-?>
+      case 'about':
+        include('about.php');
+        break;
+
+      default: 
+        include('404.php');
+        break;  
+    }
+  ?>
+</div>
+
+<hr style='margin-top: 3rem;'>
 
 <footer>
-  <hr>
-  <p>This is a footer. No not futa, you horny imbecile.</p>
+  <p class='footer_element'>
+    <a href='./index.php?el=legal'>legal information</a>
+    <a href='./index.php?el=privacy'>privacy policy</a>
+  </p>
+  <p class='footer_element'><a href='https://layer-8.moe/'>layer-8.moe</a> is a non-commercial homepage created by a private individual in 2024</p>
+  <p class='footer_element'> 
+    &nbsp;<a href='https://layer-8.moe/'><img src='./resources/img/site-ad.gif'></a>
+    &nbsp;<a href='https://quintern.xyz/'><img src='./resources/img/site-ad-quintern.gif'></a>
+    &nbsp;<a href='https://gabrielbecker.com/'><img src='./resources/img/site-ad-gabriel.gif'></a>
+  </p>
 </footer>

public/resources/stylesheet.css

@@ -30,6 +30,17 @@
   background-color: black;
 }
 
+footer {
+  padding: 0.5rem;
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+}
+
+.footer_element {
+  padding: 0.5rem;
+}
+
 .logo_font {
   color: #BFBFBF;
   font-family: 'hyper';
@@ -111,6 +122,7 @@
   font-family: 'mono';
   font-size: 2rem;
   padding-left: 2rem;
+  padding-bottom: 3rem;
   color: #BFBFBF;
 }
 
@@ -120,4 +132,9 @@
   image-rendering: crisp-edges;
   object-fit: contain;
   width: auto;
-}
+}
+
+.big_content {
+  padding: 1rem;
+  padding-left: 5rem;
+}