<script setup>
defineProps({
  href: {
    type: String,
    default: '#'
  },
  align: {
    type: String,
    default: 'left'
  }
})
</script>

<template>
  <p class="prose-button my-8" :class="{ 'text-center': align === 'center' }">
    <NuxtLink
      class="prose-button__link inline-flex items-center justify-center rounded-full bg-[var(--site-text)] px-5 py-2.5 text-sm font-semibold text-[var(--site-bg)] transition-opacity hover:opacity-80"
      :to="href"
    >
      <slot />
    </NuxtLink>
  </p>
</template>
