From 2b4f34671e30799da442629fe76ddf3c8849c060 Mon Sep 17 00:00:00 2001
From: webfussel <fiona@webfussel.de>
Date: Fri, 31 May 2024 19:43:13 +0200
Subject: [PATCH] add: stuff to bottom, remove some techs

---
 assets/css/footer.css     |  1 +
 assets/css/technology.css |  4 ++++
 components/Footer.vue     |  1 +
 components/Skills.vue     |  4 ++--
 components/Technology.vue | 12 +++++++++---
 5 files changed, 17 insertions(+), 5 deletions(-)

diff --git a/assets/css/footer.css b/assets/css/footer.css
index e743b5a..d0a221f 100644
--- a/assets/css/footer.css
+++ b/assets/css/footer.css
@@ -8,6 +8,7 @@
 
     & p {
         color: var(--color-white-transparent);
+        white-space: nowrap;
     }
 
     & .sitemap {
diff --git a/assets/css/technology.css b/assets/css/technology.css
index 25efca5..865375a 100644
--- a/assets/css/technology.css
+++ b/assets/css/technology.css
@@ -2,6 +2,10 @@
     position: relative;
     align-items: center;
 
+    &.s img {
+        height: 15px;
+    }
+
     &.m img {
         height: 30px;
     }
diff --git a/components/Footer.vue b/components/Footer.vue
index 53b3446..9f540aa 100644
--- a/components/Footer.vue
+++ b/components/Footer.vue
@@ -6,6 +6,7 @@
         </li>
       </ul>
     <p>Natürlich ohne Cookies und Tracker.</p>
+    <p>Made with nuxt, typescript & postcss</p>
     <p>&copy; 2024 by <a href="https://webfussel.de">webfussel</a></p>
   </footer>
 </template>
diff --git a/components/Skills.vue b/components/Skills.vue
index 6000bec..af4c0b9 100644
--- a/components/Skills.vue
+++ b/components/Skills.vue
@@ -30,7 +30,7 @@
 
 import { gl, java, jetbrains, njs, nuxt, pcss, react, rust, ts, vitest, vue } from '~/Skills'
 
-const technologies = [ts, pcss, vue, react, nuxt, njs, java, rust, vitest, gl, jetbrains]
+const technologies = [nuxt, ts, pcss, vue, react, njs, vitest, gl, jetbrains]
 
 const skills = [
   {
@@ -52,7 +52,7 @@ const skills = [
     text: [
       'Wenn man ein Headless CMS anbinden will, dann verknüpft das Komponenten und APIs.',
       'Für eine saubere und dynamische Einbindung reicht die Library, die euch vom Hersteller zur Verfügung gestellt wird, oft nicht aus.',
-      'Übersichtliche Projektstruktur und saubere Auflösung der Daten - das gibt\'s bei mir.'
+      'Übersichtliche Projektstruktur und saubere Auflösung der Daten - mit Fusselgarantie.'
     ],
   }
 ]
diff --git a/components/Technology.vue b/components/Technology.vue
index a238f74..373e96e 100644
--- a/components/Technology.vue
+++ b/components/Technology.vue
@@ -1,7 +1,7 @@
 <template>
   <div class="Technology flex-col" :class="[size]">
     <a v-if="link" :href="link" target="_blank" rel="noopener noreferrer">
-      <img loading="lazy" :src="img" :alt="altText()" :height="getPixelForSize()" :width="getWidth()" :class="[size]"/>
+      <img loading="lazy" :src="img" :alt="altText()" :height="getPixelForSize()" :width="getWidth()" />
     </a>
     <img v-else loading="lazy" :height="getPixelForSize()" :width="getWidth()" :src="img" :alt="altText()"/>
     <span class="tip">{{name}}</span>
@@ -14,7 +14,7 @@ type Props = {
   name: string
   link?: string
   width?: number
-  size?: 'm' | 'l'
+  size?: 's' | 'm' | 'l'
 }
 
 const {name, size, width} = withDefaults(defineProps<Props>(), {
@@ -22,7 +22,13 @@ const {name, size, width} = withDefaults(defineProps<Props>(), {
   width: 50,
 })
 
+const sizes = {
+  s: 15,
+  m: 30,
+  l: 50,
+}
+
 const altText = () => `Icon für ${name}`
-const getPixelForSize = () => size === 'm' ? 30 : 50
+const getPixelForSize = () => sizes[size]
 const getWidth = () => width / 50 * getPixelForSize()
 </script>