69 lines
1.4 KiB
Vue
69 lines
1.4 KiB
Vue
<template>
|
|
<div class="bloom container flex flex-col align-center">
|
|
<div
|
|
class="title"
|
|
ref="titleRef"
|
|
>
|
|
Bloom Your Creativity
|
|
</div>
|
|
|
|
<div
|
|
class="season"
|
|
ref="subtitleRef"
|
|
>
|
|
Theme of 2026
|
|
</div>
|
|
<div
|
|
class="desc"
|
|
ref="textRef"
|
|
>
|
|
Where imagination meets innovation, creativity blooms. This theme celebrates
|
|
AI as a catalyst for fashion design, allowing your vision to flourish beyond
|
|
traditional boundaries. Let your ideas blossom into extraordinary designs that
|
|
merge human artistry with artificial intelligence.
|
|
</div>
|
|
</div>
|
|
</template>
|
|
|
|
<script setup lang="ts">
|
|
import { ref, onMounted } from 'vue'
|
|
import gsap from 'gsap'
|
|
|
|
const titleRef = ref<HTMLElement | null>(null)
|
|
const subtitleRef = ref<HTMLElement | null>(null)
|
|
const textRef = ref<HTMLElement | null>(null)
|
|
|
|
|
|
</script>
|
|
|
|
<style scoped lang="less">
|
|
.bloom {
|
|
padding-top: 12.8rem;
|
|
font-family: 'Poppins';
|
|
background: url('@/assets/images/award/bloom_bg.png') no-repeat;
|
|
background-size: 100% 100%;
|
|
.title {
|
|
font-size: 4rem;
|
|
color: #232323;
|
|
margin-bottom: 2.4rem;
|
|
}
|
|
.logo {
|
|
margin-bottom: 2.2rem;
|
|
}
|
|
.season {
|
|
font-size: 3rem;
|
|
color: #c7342c;
|
|
margin-bottom: 6.6rem;
|
|
}
|
|
.desc {
|
|
font-family: 'Arial';
|
|
font-size: 2.8rem;
|
|
color: #585858;
|
|
text-align: center;
|
|
padding: 0 21.5rem;
|
|
line-height: 4.5rem;
|
|
margin-bottom: 12.3rem;
|
|
}
|
|
}
|
|
</style>
|