assets/styles/main.css

@@ -15655,12 +15655,12 @@ body {
   min-height: 100%;
 }
 
-.link, .link-hi-force-dark, .link-hi {
+.link, .link-hi {
   color: inherit;
   text-decoration: none;
   transition: 0.3s ease;
 }
-.link:hover, .link-hi-force-dark:hover, .link-hi:hover {
+.link:hover, .link-hi:hover {
   color: cornflowerblue;
 }
 .link-hi {
@@ -15669,12 +15669,6 @@ body {
 .link-hi:hover {
   color: royalblue;
 }
-.link-hi-force-dark {
-  color: cornflowerblue;
-}
-.link-hi-force-dark:hover {
-  color: royalblue;
-}
 
 .radial-gradient {
   background: radial-gradient(circle at left, rgba(255, 255, 255, 0.8), rgba(255, 255, 255, 0.75), rgba(255, 255, 255, 0));
@@ -15707,7 +15701,7 @@ body {
   background-color: var(--scrollbar);
 }
 
-@media (prefers-color-scheme: light) {
+@media (prefers-color-scheme: dark) {
   body {
     color: black;
   }
@@ -15724,7 +15718,7 @@ body {
   .background {
     background-color: rgba(255, 255, 255, 0.8);
   }
-  .link:hover, .link-hi:hover, .link-hi-force-dark:hover {
+  .link:hover, .link-hi:hover {
     color: royalblue;
   }
   .link-hi {
@@ -15759,11 +15753,17 @@ body {
     display: block;
   }
   .animate__animated-sm {
+    -webkit-animation-duration: 1s;
+    animation-duration: 1s;
+    -webkit-animation-duration: var(--animate-duration);
     animation-duration: var(--animate-duration);
     -webkit-animation-fill-mode: both;
     animation-fill-mode: both;
   }
   .animate__delay-1-5s {
+    -webkit-animation-delay: 1s;
+    animation-delay: 1s;
+    -webkit-animation-delay: calc(var(--animate-delay) * 1.5);
     animation-delay: calc(var(--animate-delay) * 1.5);
   }
 }

assets/styles/main.scss

@@ -109,16 +109,6 @@ body {
     &:hover {
       color: royalblue;
     }
-
-    &-force-dark {
-      @extend .link;
-
-      color: cornflowerblue;
-
-      &:hover {
-        color: royalblue;
-      }
-    }
   }
 }
 
@@ -165,7 +155,7 @@ body {
   }
 }
 
-@media (prefers-color-scheme: light) {
+@media (prefers-color-scheme: dark) {
   body {
     color: black;
   }
@@ -241,12 +231,18 @@ body {
   }
 
   .animate__animated-sm {
+    -webkit-animation-duration: 1s;
+    animation-duration: 1s;
+    -webkit-animation-duration: var(--animate-duration);
     animation-duration: var(--animate-duration);
     -webkit-animation-fill-mode: both;
     animation-fill-mode: both;
   }
 
   .animate__delay-1-5s {
+    -webkit-animation-delay: 1s;
+    animation-delay: 1s;
+    -webkit-animation-delay: calc(var(--animate-delay) * 1.5);
     animation-delay: calc(var(--animate-delay) * 1.5);
   }
 }

components/EMail.vue

@@ -24,7 +24,7 @@ const props = defineProps({
 
 const href =
   `mailto:${props.address}` +
-  (props.body ? `?body=${props.body}` : '') +
+  (props.body ? `&body=${props.body}` : '') +
   (props.subject ? `${props.body ? '&' : '?'}subject=${props.subject}` : '') +
   (props.cc ? `${props.body || props.subject ? '&' : '?'}cc=${props.cc}` : '') +
   (props.bcc
@@ -33,7 +33,7 @@ const href =
 </script>
 
 <template>
-  <a target="_blank" rel="noopener" :href="href">
+  <a class="link-hi" target="_blank" rel="noopener" :href="href">
     <slot>
       {{ props.address }}
     </slot>

components/Footer.vue

@@ -1,14 +1,5 @@
 <script setup lang="ts">
-import { useRuntimeConfig } from '#imports'
-
-const config = useRuntimeConfig()
 const currentYear = new Date().getFullYear()
-
-const mailTemplate = `I've just found a bug on https://enderman.ch and would like to report it.%0D%0A%0D%0AWebsite version: ${
-  config.public.version
-}%0D%0ABuild date: ${
-  config.public.buildDate
-}%0D%0ATimestamp: ${new Date().toISOString()}%0D%0A%0D%0A%0D%0ASteps to reproduce:%0D%0A{ Explain in detail what happened here, or attach a video/screenshot }%0D%0A%0D%0AAdditional information:%0D%0A{ Helpful information, such as developer console output / Leave empty if none }%0D%0A%0D%0A%0D%0A// Keep in mind that it's just a template, you can change it as you wish! :)`
 </script>
 
 <template>
@@ -16,23 +7,8 @@ const mailTemplate = `I've just found a bug on https://enderman.ch and would lik
     class="float user-select-none mb-2 animate__animated animate__delay-1s animate__fadeInUpBig animate__slow text-align-center line-height-1-5"
   >
     <span class="transpaque font-small text-shadow">
-      © 2018-{{ currentYear }},
+      © 2018-{{ currentYear }}, <a href="https://enderman.ch">Enderman</a>. All
-      <a class="link-hi-force-dark" href="https://enderman.ch">Enderman</a>. All
+      rights reserved. • v1.1
-      rights reserved. •
-      <EMail
-        class="link-hi-force-dark"
-        address="contact@enderman.ch"
-        cc="admin@enderman.ch"
-        subject="Bug report: enderman.ch"
-        :body="mailTemplate"
-      >
-        <strong>Report a bug</strong>
-      </EMail>
-      <sub>
-        β{{ config.public.version ? config.public.version : '0.0.0' }} ({{
-          config.public.buildDate ? config.public.buildDate : '1970-01-01'
-        }})
-      </sub>
     </span>
   </footer>
 </template>

nuxt.config.ts

@@ -58,10 +58,9 @@ export default defineNuxtConfig({
   typescript: {
     typeCheck: true,
   },
-  runtimeConfig: {
+  vite: {
-    public: {
+    define: {
-      version: JSON.stringify(packageJSON.version).slice(1, -1),
+      'import.meta.env.PACKAGE_VERSION': JSON.stringify(packageJSON.version),
-      buildDate: new Date().toISOString().split('T')[0],
     },
   },
 })

package-lock.json

@@ -46,8 +46,7 @@
         "vue": "^3.3.8",
         "vue-router": "^4.2.5",
         "vue-tsc": "^1.8.22"
-      },
+      }
-      "version": "0.1.0"
     },
     "node_modules/@aashutoshrathi/word-wrap": {
       "version": "1.2.6",
@@ -19531,6 +19530,5 @@
         "url": "https://github.com/sponsors/wooorm"
       }
     }
-  },
+  }
-  "version": "0.1.0"
 }

package.json

@@ -53,6 +53,5 @@
     "humps": "^2.0.1",
     "pinia": "^2.1.7",
     "quasar": "^2.14.0"
-  },
+  }
-  "version": "0.1.0"
 }

pages/social.vue

@@ -100,13 +100,9 @@ useHead({
     <h3 class="alex">Contact me</h3>
     <p>
       Fanmail:
-      <EMail
+      <EMail address="contact@enderman.ch" subject="Hey Enderman!" /><br />
-        class="link-hi"
+      Manager: <EMail address="manager@enderman.ch" /><br />
-        address="contact@enderman.ch"
+      Abuse: <EMail address="abuse@enderman.ch" />
-        subject="Hey Enderman!"
-      /><br />
-      Manager: <EMail class="link-hi" address="manager@enderman.ch" /><br />
-      Abuse: <EMail class="link-hi" address="abuse@enderman.ch" />
     </p>
   </div>
 </template>