Moved the scrolling text to Vue since it needs some JS and custom
All checks were successful
Docker Deploy / build-and-push (push) Successful in 3m16s
All checks were successful
Docker Deploy / build-and-push (push) Successful in 3m16s
styling not available in Tailwind
This commit is contained in:
33
src/components/RotatingText.vue
Normal file
33
src/components/RotatingText.vue
Normal file
@@ -0,0 +1,33 @@
|
||||
<template>
|
||||
<span class="block w-full my-2">
|
||||
<span class="text-rotate">
|
||||
<span class="justify-items-center">
|
||||
<span
|
||||
v-for="(item, index) in items"
|
||||
:key="index"
|
||||
:class="item.className"
|
||||
>
|
||||
{{ item.text }}
|
||||
</span>
|
||||
</span>
|
||||
</span>
|
||||
</span>
|
||||
</template>
|
||||
|
||||
<script setup lang="ts">
|
||||
interface RotatingTextItem {
|
||||
text: string;
|
||||
className: string;
|
||||
}
|
||||
|
||||
defineProps<{
|
||||
items: RotatingTextItem[];
|
||||
}>();
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
.text-rotate:hover,
|
||||
.text-rotate:hover * {
|
||||
animation-play-state: running !important;
|
||||
}
|
||||
</style>
|
||||
Reference in New Issue
Block a user