Prettier format

src/App.vue

@@ -1,6 +1,6 @@
 <template>
     <Header />
-    
+
     <div class="p-4">
         <Hero class="mt-8" />
 

src/components/Header.vue

@@ -1,13 +1,19 @@
 <template>
-    <nav class="fixed w-full p-4 flex justify-between items-center z-10 transition-all duration-500" ref="header">
+    <nav
+        class="fixed w-full p-4 flex justify-between items-center z-10 transition-all duration-500"
+        ref="header"
+    >
         <div class="flex items-center">
             <div class="bg-blue-600 px-3 py-1 mr-2 rounded-full font-black text-lg">S</div>
             <h2 class="text-lg font-bold">Sam Elfring</h2>
         </div>
 
         <ul class="hidden md:flex gap-4">
             <li v-for="link in navLinks">
-                <a :href="link.link" class="text-slate-400 hover:underline hover:text-white">
+                <a
+                    :href="link.link"
+                    class="text-slate-400 hover:underline hover:text-white"
+                >
                     {{ link.name }}
                 </a>
             </li>
@@ -16,7 +22,7 @@
 </template>
 
 <script setup>
-import { ref, onMounted } from 'vue';
+import { ref, onMounted } from "vue";
 
 const navLinks = [
     { name: "Over mij", link: "#about-me" },
@@ -33,10 +39,8 @@ onMounted(() => {
     window.addEventListener("scroll", () => {
         const headerClasses = ["bg-slate-800", "py-2"];
 
-        if (window.scrollY > 0)
-            header.value.classList.add(...headerClasses);
-        else
-            header.value.classList.remove(...headerClasses);
+        if (window.scrollY > 0) header.value.classList.add(...headerClasses);
+        else header.value.classList.remove(...headerClasses);
     });
 });
 </script>