fix(ui): use button component in TOC

This commit is contained in:
ArneBo 2025-03-11 11:29:46 +01:00
parent 999bbcd559
commit 248ea9aa31
2 changed files with 6 additions and 4 deletions

View File

@ -3,6 +3,8 @@ import { computed, ref, watchEffect } from 'vue'
import { slugify } from 'transliteration'
import { useScroll } from '@vueuse/core'
import Button from '~/components/ui/Button.vue'
const { heading = 'h1' } = defineProps<{heading?:'h1' | 'h2' | 'h3' | 'h4' | 'h5' | 'h6'}>()
const toc = ref()
@ -39,14 +41,14 @@ watchEffect(() => {
<div class="toc-toc">
<div class="toc-links">
<button
<Button
v-for="h of headings"
:key="h.id"
:class="{ 'is-active': activeLink === h.id }"
@click.prevent="h.scrollIntoView({ behavior: 'smooth' })"
>
{{ h.textContent }}
</button>
</Button>
</div>
</div>
</div>

View File

@ -33,9 +33,9 @@
padding-left: 8px;
@include docs {
/* @include docs {
top: 72px;
}
} */
> button {
position: relative;