From 248ea9aa31d28d0b62c8b4b6091784e07c7d3647 Mon Sep 17 00:00:00 2001
From: ArneBo <arne@ecobasa.org>
Date: Tue, 11 Mar 2025 11:29:46 +0100
Subject: [PATCH] fix(ui): use button component in TOC

---
 front/src/components/ui/Toc.vue  | 6 ++++--
 front/src/components/ui/toc.scss | 4 ++--
 2 files changed, 6 insertions(+), 4 deletions(-)

diff --git a/front/src/components/ui/Toc.vue b/front/src/components/ui/Toc.vue
index d61781175..d86d06447 100644
--- a/front/src/components/ui/Toc.vue
+++ b/front/src/components/ui/Toc.vue
@@ -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>
diff --git a/front/src/components/ui/toc.scss b/front/src/components/ui/toc.scss
index 1ba8c2a08..d376c3e19 100644
--- a/front/src/components/ui/toc.scss
+++ b/front/src/components/ui/toc.scss
@@ -33,9 +33,9 @@
 
         padding-left: 8px;
 
-        @include docs {
+        /* @include docs {
           top: 72px;
-        }
+        } */
 
         > button {
           position: relative;