silver-volt4 · silver-volt4 · Jul 7, 2025 · Jul 7, 2025 · Jul 7, 2025
diff --git a/src/app.html b/src/app.html
@@ -6,6 +6,6 @@
     %sveltekit.head%
   </head>
   <body>
-    <div style="display: contents">%sveltekit.body%</div>
+    %sveltekit.body%
   </body>
 </html>
diff --git a/src/lib/components/Project.svelte b/src/lib/components/Project.svelte
@@ -71,7 +71,7 @@
 
   .bottom {
     background-color: var(--bg);
-    height: 80px;
+    min-height: 80px;
     border-radius: 0 0 4px 4px;
     padding: 0px 16px 16px 16px;
   }

diff --git a/src/lib/i18n/cs/common.json b/src/lib/i18n/cs/common.json
@@ -7,5 +7,6 @@
   "contact": "Kde mě najdeš",
   "contact-github": "GitHub",
   "contact-githubalt": "GitHub (další)",
-  "contact-discord": "Discord"
+  "contact-discord": "Discord",
+  "contact-mail": "E-mail"
 }
diff --git a/src/lib/i18n/cs/projects.json b/src/lib/i18n/cs/projects.json
@@ -1,4 +1,6 @@
 {
+  "unordered": "Tady je pár věcí, na které jsem hrdý, uvedené v žádném konkrétním pořadí...",
+  "blog": "Taky mám blog, na který čas od času něco napíšu!",
   "silverbot": "Jednoduchý Discord bot se spoustou Sonic příkazů. Tolik roztomilosti, a může být jen tvoje!",
   "puzzleprism": "Hlavolam pro virtuální realitu vytvořený v Godotu, který tvořil praktickou část mé maturitní práce. Jsem na ni fakt hrdý!",
   "hexalema": "Stolní hra pro dva hráče inspirovaná <i>Královskou hrou z Uru</i>. Navrhnuto s mými spolužáky!",

diff --git a/src/lib/i18n/en/common.json b/src/lib/i18n/en/common.json
@@ -7,5 +7,6 @@
   "contact": "Where to find me",
   "contact-github": "GitHub",
   "contact-githubalt": "GitHub (alt)",
-  "contact-discord": "Discord"
-}
+  "contact-discord": "Discord",
+  "contact-mail": "E-mail"
+}
diff --git a/src/lib/i18n/en/projects.json b/src/lib/i18n/en/projects.json
@@ -1,4 +1,6 @@
 {
+  "unordered": "Here's some of the stuff I'm proud of, listed in no particular order...",
+  "blog": "I also have a blog that I post on from time to time!",
   "silverbot": "A simple Discord bot related to the Sonic franchise. Lots of fluff, and it can all be yours!",
   "puzzleprism": "A VR puzzle game made in Godot that I made as my high school final. I'm really proud of it!",
   "hexalema": "A tabletop game for two players similar to the <i>Royal Game of Ur</i>. Designed with my classmates!",

diff --git a/src/lib/parts/Projects.svelte b/src/lib/parts/Projects.svelte
@@ -9,6 +9,7 @@
   import SwapdoodleRevival from "$lib/assets/images/projects/swapdoodlerevival.png";
 
   import t from "$lib/i18n";
+  import { buildCurrentLangUrl } from "$lib/i18n/util.svelte";
 
   const PROJECTS: { [key: string]: ProjectAttrs } = {
     swapdoodlerevival: {
@@ -57,6 +58,7 @@
 <h1 class="heading">
   {$t("homepage.projects")}
 </h1>
+<p>{$t("projects.unordered")}</p>
 <div class="section">
   <div class="gridlet" style:--gr-width="350px">
     {#each Object.entries(PROJECTS) as [key, project] (key)}
@@ -65,4 +67,9 @@
       </Project>
     {/each}
   </div>
+  <p>
+    <a href={buildCurrentLangUrl("/blog")}>
+      {$t("projects.blog")}
+    </a>
+  </p>
 </div>
diff --git a/src/lib/style/app.scss b/src/lib/style/app.scss
@@ -16,10 +16,18 @@ body,
 
 body {
   background-color: constants.$dark;
-  background-attachment: fixed;
   color: constants.$light;
+  display: flex;
+  flex-direction: column;
+  min-height: 100vh;
 }
 
+main {
+  flex-grow: 1;
+  margin-bottom: 0;
+}
+
+/* Padded Section */
 .ps {
   width: 100%;
   max-width: 1000px;
@@ -29,6 +37,7 @@ body {
   margin-bottom: 48px;
 }
 
+/* Padded Section Manager */
 .psm {
   width: 100%;
   box-sizing: border-box;

diff --git a/src/routes/[[lang]]/+layout.svelte b/src/routes/[[lang]]/+layout.svelte
@@ -11,98 +11,117 @@
   <link rel="icon" href="/profile-image.png" />
 </svelte:head>
 
-<main>
-  <header>
-    <div class="topmost ps">
-      <div class="lang">
-        <a href={changeLangUrl("cs")}>
-          Czech
-          <img src={langCS} alt="🇨🇿" />
-        </a>
-        <a href={changeLangUrl()}>
-          English
-          <img src={langEN} alt="🇬🇧" />
-        </a>
-      </div>
+<header>
+  <div class="languages">
+    <div class="lang">
+      <a href={changeLangUrl()}>
+        <img src={langEN} alt="🇬🇧" title="Englush" />
+      </a>
+      <a href={changeLangUrl("cs")}>
+        <img src={langCS} alt="🇨🇿" title="Czech" />
+      </a>
     </div>
-    <a href={buildCurrentLangUrl("/")} class="backlink psm">
-      <img class="pfp" src="/profile-image.png" alt="Avatar" />
-      <div class="vbox">
-        <h1>{$t("common.title")}</h1>
-        <em>{$t("common.subtitle")}</em>
-      </div>
-    </a>
-  </header>
-
-  <div class="content ps">
-    <slot />
   </div>
+  <a href={buildCurrentLangUrl("/")} class="backlink psm">
+    <img class="pfp" src="/profile-image.png" alt="Avatar" />
+    <div class="vbox">
+      <h1>{$t("common.title")}</h1>
+      <em>{$t("common.subtitle")}</em>
+    </div>
+  </a>
+</header>
 
-  <footer class="psm">
-    <div class="ps end">
-      <div class="signature">
-        <hr />
-        <b>silver_volt4</b>
-        <hr />
+<main class="content ps">
+  <slot />
+</main>
+
+<footer class="psm">
+  <div class="ps end">
+    <div class="signature">
+      <hr />
+      <b>silver_volt4</b>
+      <hr />
+    </div>
+    <div class="links gridlet" style:--gr-width="400px">
+      <div class="linklist">
+        <b>
+          {$t("common.links")}
+        </b>
+        <a href={buildCurrentLangUrl("/")}>
+          {$t("common.page-about")}
+        </a>
+        <a href={buildCurrentLangUrl("/blog")}>
+          {$t("common.page-blog")}
+        </a>
       </div>
-      <div class="links gridlet" style:--gr-width="400px">
-        <div class="linklist">
-          <b>
-            {$t("common.links")}
-          </b>
-          <a href={buildCurrentLangUrl("/")}>
-            {$t("common.page-about")}
-          </a>
-          <a href={buildCurrentLangUrl("/blog")}>
-            {$t("common.page-blog")}
-          </a>
-        </div>
-        <div class="linklist">
-          <b>{$t("common.contact")}</b>
-          <a href="https://github.com/silver-volt4" target="_blank">
-            <span>{$t("common.contact-github")}</span>
-          </a>
-          <a href="https://github.com/sykdan" target="_blank">
-            <span>{$t("common.contact-githubalt")}</span>
-          </a>
-          <a
-            href="https://discord.com/users/276742341031755776"
-            target="_blank"
-          >
-            <span>{$t("common.contact-discord")}</span>
-          </a>
-        </div>
+      <div class="linklist">
+        <b>{$t("common.contact")}</b>
+        <a href="https://github.com/silver-volt4" target="_blank">
+          <span>{$t("common.contact-github")}</span>
+        </a>
+        <a href="https://github.com/sykdan" target="_blank">
+          <span>{$t("common.contact-githubalt")}</span>
+        </a>
+        <a href="https://discord.com/users/276742341031755776" target="_blank">
+          <span>{$t("common.contact-discord")}</span>
+        </a>
+        <a
+          href="#"
+          onclick={(e) => {
+            e.preventDefault();
+            let a = document.createElement("a");
+            a.setAttribute(
+              "href",
+              // quirky protection against html scanning.
+              // doesnt protect against genai (i tried :c)
+              String.fromCharCode(
+                ...[-12, 8, 3, 8, -5, -53].reduce(
+                  (previous, current) => {
+                    previous.push(previous[previous.length - 1] + current);
+                    return previous;
+                  },
+                  [109],
+                ),
+              ) +
+                "gdpancake5" +
+                String.fromCharCode(
+                  ...[39, 6, -12, 8, 3, -62, 53, 12, -2].reduce(
+                    (previous, current) => {
+                      previous.push(previous[previous.length - 1] + current);
+                      return previous;
+                    },
+                    [64],
+                  ),
+                ),
+            );
+            a.click();
+          }}
+        >
+          <span>{$t("common.contact-mail")}</span>
+        </a>
       </div>
     </div>
-  </footer>
-</main>
+  </div>
+</footer>
 
 <style lang="scss">
   @use "$lib/style/constants.scss";
   @use "sass:color";
 
   $darkBack: color.adjust(constants.$dark, $lightness: 3%);
 
-  div.topmost {
+  div.languages {
+    z-index: 1;
     height: 32px;
-    margin-bottom: 0;
-    padding: 0;
+    position: absolute;
+    right: 8px;
+    top: 8px;
     display: flex;
     justify-content: end;
-    align-items: center;
-
-    .lang {
-      transform: translateY(4px);
-    }
-
-    a {
-      color: constants.$light;
-      text-decoration: none;
-      margin-right: 16px;
 
-      img {
-        vertical-align: middle;
-      }
+    a img {
+      vertical-align: middle;
+      height: 32px;
     }
   }
 
@@ -112,7 +131,6 @@
     margin: 0;
     max-width: 1000px;
     padding: 32px 24px;
-    padding-top: 0 !important;
     margin: 0 auto;
   }
 
@@ -123,20 +141,6 @@
     gap: 32px;
   }
 
-  main {
-    display: flex;
-    flex-direction: column;
-    min-height: 100vh;
-    // position: absolute;
-    // left: 0;
-    // right: 0;
-
-    .content {
-      flex-grow: 1;
-      margin-bottom: 0;
-    }
-  }
-
   header {
     justify-content: center;
     margin-bottom: 32px;

diff --git a/src/routes/[[lang]]/+page.svelte b/src/routes/[[lang]]/+page.svelte
@@ -26,5 +26,5 @@
   </p>
 </div>
 
-<Skills />
 <Projects />
+<Skills />
diff --git a/src/routes/[[lang]]/blog/[slug]/+page.svelte b/src/routes/[[lang]]/blog/[slug]/+page.svelte
@@ -18,20 +18,25 @@
   <PageInfo title={PAGE_TITLE} description={pageAttributes.description} />
 </svelte:head>
 
-<a class="back" href={buildCurrentLangUrl("/blog")}>
-  <SvgIcon type="mdi" path={Back} size={24} />
-  <span>
-    {$t("blog.back")}
-  </span>
-</a>
-<h1 class="h0" style="margin-top: 0.5em;">{pageAttributes.title}</h1>
-<p class="sub-h0">
-  {$t("blog.posted")}: {new Date(pageAttributes.date).toLocaleDateString()}
-</p>
-
+{#snippet backButton()}
+  <a class="back" href={buildCurrentLangUrl("/blog")}>
+    <SvgIcon type="mdi" path={Back} size={24} />
+    <span>
+      {$t("blog.back")}
+    </span>
+  </a>
+{/snippet}
+
+{@render backButton()}
 <article class="md">
+  <h1 class="h0" style="margin-top: 0.5em;">{pageAttributes.title}</h1>
+  <p class="sub-h0">
+    {$t("blog.posted")}: {new Date(pageAttributes.date).toLocaleDateString()}
+  </p>
+
   {@html data.page.html}
 </article>
+{@render backButton()}
 
 <style lang="scss">
   @use "$lib/style/constants.scss";