feat: 添加 InspiraUI 组件和模式背景功能,更新依赖项
This commit is contained in:
38
src/pages/index-new.page.vue
Normal file
38
src/pages/index-new.page.vue
Normal file
@ -0,0 +1,38 @@
|
||||
<script setup lang="ts">
|
||||
import {
|
||||
PATTERN_BACKGROUND_DIRECTION,
|
||||
PATTERN_BACKGROUND_SPEED,
|
||||
PATTERN_BACKGROUND_VARIANT,
|
||||
} from '@/components/InspiraUI/pattern-background';
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<div bg-red v-if="false">
|
||||
<div class="bg-blue h-full">A</div>
|
||||
</div>
|
||||
|
||||
<div class="h-screen w-screen p-4" v-else>
|
||||
<PatternBackground
|
||||
:animate="true"
|
||||
:direction="PATTERN_BACKGROUND_DIRECTION.TopRight"
|
||||
:variant="PATTERN_BACKGROUND_VARIANT.Dot"
|
||||
class="flex h-full w-full flex-col items-center gap-4 overflow-hidden rounded-lg border px-4 py-8"
|
||||
:speed="PATTERN_BACKGROUND_SPEED.Slow"
|
||||
>
|
||||
<h3
|
||||
class="relative z-20 bg-gradient-to-b from-neutral-200 to-neutral-500 bg-clip-text py-8 text-3xl font-bold text-transparent"
|
||||
>
|
||||
Spline
|
||||
</h3>
|
||||
<Spline scene="https://prod.spline.design/kZDDjO5HuC9GJUM2/scene.splinecode" />
|
||||
</PatternBackground>
|
||||
<FluidCursor />
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<style scoped></style>
|
||||
|
||||
<route lang="yaml">
|
||||
meta:
|
||||
layout: false
|
||||
</route>
|
Reference in New Issue
Block a user