src/lib/IO/Button.svelte

@@ -2,7 +2,6 @@
     import { ButtonType } from "$lib/IO/ButtonType.ts";
     import { onMount } from "svelte";
 
-    export let href : string = "#";
     export let type : ButtonType = ButtonType.Primary;
     let cssName : string;
 
@@ -17,17 +16,17 @@
     });
 </script>
 
-<a href={href} class="button" style="--button-color: var({cssName});">
+<button class="button" style="--button-color: var({cssName});">
     <div class="content">
         <slot name="content">
             Click Me!
         </slot>
     </div>
-</a>
+</button>
 
 <style>
     .button {
-        white-space: nowrap;
+        width: 100%;
         border-radius: 6px;
         border: none;
         background-color: var(--button-color);
@@ -40,7 +39,6 @@
         font-size: 1.5em;
 
         box-shadow: 5px 5px 10px 2px rgba(0, 0, 0, 0.3);
-        padding: 0.8em 4em;
     }
 
     .button:hover {
@@ -49,17 +47,14 @@
 
         cursor: pointer;
 
-        filter: brightness(130%);
+        box-shadow:
+            inset 0 0 0 100px rgba(255, 255, 255, 0.25);
     }
 
     .content {
         width: 100%;
-        height: 100%;
-
         color: var(--text1);
 
-        display: flex;
+        padding: 0.8em 4em;
-        justify-content: center;
-        align-content: center;
     }
 </style>

src/routes/+layout.svelte

@@ -1,88 +0,0 @@
-<!-- Nav bar -->
-
-<!-- Page content -->
-<slot />
-
-<!-- About footer -->
-<footer>
-    <div class="about-container">
-        <div class="credits">
-            <span>© 2023-2024 Developed by:</span>
-            <br>
-            <span>Benjamin Dreyer</span>
-            <br>
-            <span>Oliver Schwenger</span>
-            <br>
-            <span>Sylvester Junge</span>
-            <br>
-            <span>Zhentao Wei</span>
-            <br>
-            <br>
-            <span>Website <a href="https://gitea.deprived.dev/Sveskejuice/deprived-main-website" target="_blank">source code</a></span>
-        </div>
-        <div>
-            <h3>About Us</h3>
-            <a href="/about">About</a>
-        </div>
-        <div class="contact">
-            <h3>Contact</h3>
-            <a href="https://discord.gg/awatEEqc3M" target="_blank" class="social">
-                <img src="/images/icons/discord.svg" alt="Discord"/>
-                <span>Discord</span>
-            </a>
-        </div>
-    </div>
-</footer>
-
-
-<style>
-    footer {
-        margin-top: 50px;
-        padding: 25px 0 25px;
-        height: 100%;
-        background-color: var(--background1);
-
-        display: flex;
-        justify-content: center;
-    }
-
-    .about-container {
-        width: 80%;
-
-        color: var(--text2);
-
-        display: flex;
-        flex-wrap: wrap;
-        justify-content: space-evenly;
-    }
-
-    .credits {
-        line-height: 2;
-    }
-
-    .social {
-        display: flex;
-        align-content: center;
-        gap: 10px;
-    }
-
-    .social > img {
-        width: 24px;
-    }
-
-    h3 {
-        margin-top: 0px;
-        color: var(--text2);
-    }
-
-    a {
-        color: var(--text2);
-        text-decoration-line: underline;
-    }
-
-    a:hover {
-        filter: brightness(130%);
-    }
-
-
-</style>

src/routes/+page.svelte

@@ -39,8 +39,10 @@
     <footer id="news-footer">
         <div class="dummy"/>
         <div id="more-posts">
-            <Button href="/post" type={ButtonType.Primary}>
+            <Button type={ButtonType.Primary}>
-                <span slot="content">More News</span>
+                <a slot="content" href="/post">
+                    <span>More News</span>
+                </a>
             </Button>
         </div>
     </footer>
@@ -96,6 +98,10 @@
         min-width: 10em;
     }
 
+    a {
+        white-space: nowrap;
+    }
+
     .main-title {
         color: var(--text1);
         margin: 0 auto;

src/routes/post/+page.svelte

@@ -46,23 +46,21 @@
         display: flex;
         flex-wrap: wrap;
 
-        align-content: center;
+        align-items: center;
         justify-content: space-around;
 
-        padding: 0 0 20px 0;
+        padding-bottom: 25px;
         margin-bottom: 25px;
     }
 
     #search {
         height: 40px;
 
-        align-self: center;
         border: none;
         border-radius: 10px;
         font-size: 18px;
         line-height: 2;
         padding: 0.5rem 0.8rem;
-        margin-top: 0px;
 
         background-color: var(--background);
         color: var(--text1);

static/images/icons/discord.svg

@@ -1,18 +0,0 @@
-<?xml version="1.0" encoding="UTF-8" standalone="no"?>
-<svg
-   fill="#000000"
-   width="800.02313"
-   height="609.78137"
-   viewBox="0 0 24.000694 18.293441"
-   role="img"
-   version="1.1"
-   id="svg1"
-   xmlns="http://www.w3.org/2000/svg"
-   xmlns:svg="http://www.w3.org/2000/svg">
-  <defs
-     id="defs1" />
-  <path
-     d="m 20.317481,1.5163647 a 19.791,19.791 0 0 0 -4.885,-1.51500001 0.074,0.074 0 0 0 -0.079,0.037 c -0.21,0.375 -0.444,0.864 -0.608,1.25000001 a 18.27,18.27 0 0 0 -5.4870004,0 12.64,12.64 0 0 0 -0.617,-1.25000001 0.077,0.077 0 0 0 -0.079,-0.037 19.736,19.736 0 0 0 -4.885,1.51500001 0.07,0.07 0 0 0 -0.032,0.027 c -3.11199997,4.649 -3.96499997,9.1830003 -3.54599997,13.6600003 a 0.082,0.082 0 0 0 0.031,0.057 19.9,19.9 0 0 0 5.99299997,3.03 0.078,0.078 0 0 0 0.084,-0.028 14.09,14.09 0 0 0 1.226,-1.994 0.076,0.076 0 0 0 -0.041,-0.106 13.107,13.107 0 0 1 -1.872,-0.892 0.077,0.077 0 0 1 -0.008,-0.128 10.2,10.2 0 0 0 0.372,-0.292 0.074,0.074 0 0 1 0.077,-0.01 c 3.928,1.793 8.1800004,1.793 12.0620004,0 a 0.074,0.074 0 0 1 0.078,0.01 c 0.12,0.098 0.246,0.198 0.373,0.292 a 0.077,0.077 0 0 1 -0.006,0.127 12.299,12.299 0 0 1 -1.873,0.892 0.077,0.077 0 0 0 -0.041,0.107 c 0.36,0.698 0.772,1.362 1.225,1.993 a 0.076,0.076 0 0 0 0.084,0.028 19.839,19.839 0 0 0 6.002,-3.03 0.077,0.077 0 0 0 0.032,-0.054 c 0.5,-5.177 -0.838,-9.6740003 -3.549,-13.6600003 a 0.061,0.061 0 0 0 -0.031,-0.03 z M 8.0204806,12.476365 c -1.183,0 -2.157,-1.085 -2.157,-2.419 0,-1.3330003 0.956,-2.4190003 2.157,-2.4190003 1.21,0 2.1760004,1.096 2.1570004,2.4200003 0,1.333 -0.9560004,2.418 -2.1570004,2.418 z m 7.9750004,0 c -1.183,0 -2.157,-1.085 -2.157,-2.419 0,-1.3330003 0.955,-2.4190003 2.157,-2.4190003 1.21,0 2.176,1.096 2.157,2.4200003 0,1.333 -0.946,2.418 -2.157,2.418 z"
-     id="path1"
-     style="fill:#fdfdfd;fill-opacity:1" />
-</svg>

static/stylesheets/main-theme.css

@@ -6,7 +6,6 @@
     --text3: #b0afad; /* Third text color. */
     --text4: #868584; /* Fourth text color. */
     --background: #232222;
-    --background1: #1b1a1a;
     --primary: #227c9d;
     --secondary: #ffcb77;
     --accent: #17c3b2;