27 lines
944 B
Vue
27 lines
944 B
Vue
<script setup lang="ts">
|
|
import VuesaxIcon from "~/components/ui/VuesaxIcon.vue";
|
|
|
|
const items = computed(() => useSiteStore().sections.tape.items);
|
|
</script>
|
|
|
|
<template>
|
|
<section aria-hidden="true" class="pointer-events-none relative z-20 overflow-hidden py-6 sm:py-10">
|
|
<div class="-rotate-[1.6deg] scale-[1.04]">
|
|
<div class="hazard h-2 sm:h-2.5" />
|
|
<div dir="ltr" class="overflow-hidden bg-hazard py-2.5 sm:py-3.5 text-bg">
|
|
<div class="animate-marquee flex w-max">
|
|
<span
|
|
v-for="(item, i) in [...items, ...items]"
|
|
:key="i"
|
|
class="flex items-center gap-5 sm:gap-7 px-5 sm:px-7 text-xs sm:text-sm font-extrabold whitespace-nowrap"
|
|
>
|
|
{{ item }}
|
|
<VuesaxIcon name="shield-tick" class="size-3.5 sm:size-4 shrink-0" />
|
|
</span>
|
|
</div>
|
|
</div>
|
|
<div class="hazard h-2 sm:h-2.5" />
|
|
</div>
|
|
</section>
|
|
</template>
|