marzban-dev
55 lines
1.6 KiB
Vue
55 lines
1.6 KiB
Vue
<script setup lang="ts">
|
|
// types
|
|
|
|
type Props = {
|
|
// brands: string[];
|
|
};
|
|
|
|
// props
|
|
|
|
const props = defineProps<Props>();
|
|
const {} = toRefs(props);
|
|
</script>
|
|
|
|
<template>
|
|
<div class="relative w-full flex flex-col justify-center min-h-[700px] h-[80svh]">
|
|
<div class="-rotate-z-2 z-20">
|
|
<div
|
|
class="bg-warning-500 flex pr-20 gap-12 sm:gap-20 py-2 w-max animate-marquee-reverse"
|
|
>
|
|
<span
|
|
v-for="i in 10"
|
|
class="text-[20px] sm:text-[30px] lg:text-[50px] text-white whitespace-nowrap font-semibold"
|
|
>
|
|
TEST {{ i }}
|
|
</span>
|
|
<span
|
|
v-for="i in 10"
|
|
class="text-[20px] sm:text-[30px] lg:text-[50px] text-white whitespace-nowrap font-semibold"
|
|
>
|
|
TEST {{ i }}
|
|
</span>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="rotate-z-2 z-10">
|
|
<div
|
|
class="bg-slate-50 flex pr-20 gap-12 sm:gap-20 py-2 w-max animate-marquee"
|
|
>
|
|
<span
|
|
v-for="i in 10"
|
|
class="text-[20px] sm:text-[30px] lg:text-[50px] text-slate-300 whitespace-nowrap font-semibold"
|
|
>
|
|
TEST {{ i }}
|
|
</span>
|
|
<span
|
|
v-for="i in 10"
|
|
class="text-[20px] sm:text-[30px] lg:text-[50px] text-slate-300 whitespace-nowrap font-semibold"
|
|
>
|
|
TEST {{ i }}
|
|
</span>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</template>
|