xeovalyte/portfolio
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

added a leftbar
All checks were successful
ci/woodpecker/push/woodpecker Pipeline was successful
Details

Browse Source
This commit is contained in:
Xeovalyte
2023-02-12 10:59:55 +01:00
parent 57a50a5810
commit e1ed3d53db
6 changed files with 48 additions and 6 deletions
Download Patch File Download Diff File Expand all files Collapse all files

17
components/layout/Leftbar.vue Normal file
View File

@@ -0,0 +1,17 @@
<template>
<div class="fixed hidden lg:block left-3 top-1/2 text-primary-500 space-y-1 z-50">
<div @click="scrollToElement('heading')" class="py-2 hover:cursor-pointer">
<div class="h-1 rounded-full bg-primary-500 transition-all duration-300 hover:cursor-pointer" :class="route.hash === '#heading' ? 'w-16' : 'w-8'" />
</div>
<div @click="scrollToElement('about')" class="py-2 hover:cursor-pointer">
<div class="h-1 rounded-full bg-primary-500 transition-all duration-300 hover:cursor-pointer" :class="route.hash === '#about' ? 'w-16' : 'w-8'" />
</div>
<div @click="scrollToElement('skills')" class="py-2 hover:cursor-pointer">
<div class="h-1 rounded-full bg-primary-500 transition-all duration-300 hover:cursor-pointer" :class="route.hash === '#skills' ? 'w-16' : 'w-8'" />
</div>
</div>
</template>
<script setup>
const route = useRoute()
</script>