FIX: fixes for typos and Link Component in button

Fixes some grammar issues and bad layouting, as well as wrong link usage

app/components/Button.vue

@@ -1,5 +1,5 @@
 <template>
-  <component :is="type" v-bind="actualProps()" class="Button" :class="[design]">
+  <component :is="actualComponent" v-bind="actualProps()" class="Button" :class="[design]">
     <slot />
   </component>
 </template>
@@ -7,22 +7,30 @@
 <script setup lang="ts">
 
 type Props = {
-  type ?: 'a' | 'button'
+  type ?: 'NuxtLink' | 'button'
   href ?: string
   design ?: 'default' | 'dark' | 'white'
 }
 
 const {
-  type = 'a',
+  type = 'NuxtLink',
   href = '#',
   design = 'default',
 } = defineProps<Props>()
 
+const isExternal = href.startsWith('http')
+
+const actualComponent = computed(() => {
+  if (type === 'NuxtLink') return resolveComponent('NuxtLink')
+  return type
+})
+
 const actualProps = () => {
-  if (type === 'a') {
+  if (type === 'NuxtLink') {
     return {
-      href: href,
-      target: href!.startsWith('https://') ? '_blank' : undefined,
+      to: href,
+      target: isExternal ? '_blank' : undefined,
+      external: isExternal,
     }
   }
 }