2026-04-21 10:47:41 +08:00
|
|
|
<script setup lang="ts">
|
|
|
|
|
import { ref, onMounted, onUnmounted, reactive, toRefs } from "vue";
|
2026-04-21 15:57:37 +08:00
|
|
|
import inspiration_1 from "@/assets/images/collectionStory/inspiration_1.png";
|
|
|
|
|
import inspiration_2 from "@/assets/images/collectionStory/inspiration_1.png";
|
2026-04-21 10:47:41 +08:00
|
|
|
//const props = defineProps({
|
|
|
|
|
//})
|
|
|
|
|
//const emit = defineEmits([
|
|
|
|
|
//])
|
|
|
|
|
let data = reactive({
|
|
|
|
|
})
|
|
|
|
|
let slides = [
|
2026-04-21 15:57:37 +08:00
|
|
|
{ image: inspiration_1, text: 'Moodboard 1 for this Collection' },
|
|
|
|
|
{ image: inspiration_2, text: 'Moodboard 2 for this Collection' },
|
2026-04-21 10:47:41 +08:00
|
|
|
]
|
|
|
|
|
onMounted(()=>{
|
|
|
|
|
})
|
|
|
|
|
onUnmounted(()=>{
|
|
|
|
|
})
|
|
|
|
|
defineExpose({})
|
|
|
|
|
const {} = toRefs(data);
|
|
|
|
|
</script>
|
|
|
|
|
<template>
|
|
|
|
|
<div class="inspiration">
|
|
|
|
|
<div class="title">Inspiration</div>
|
|
|
|
|
<div class="info">
|
|
|
|
|
<div>
|
|
|
|
|
This project is inspired by the enduring traditions and unique material culture of high-altitude nomadic communities, particularly those found across Central Asia and the Himalayan plateau.
|
|
|
|
|
</div>
|
|
|
|
|
<div>
|
|
|
|
|
The moodboard now balances rugged, natural fibers and dramatic, layered silhouettes with vibrant color and refined pattern work. Key visual elements include the strength of traditional nomadic crafts like falconry and the warmth of textured knitwear. The palette expands from earthy browns to striking accents of lime green, teal, and gold, often expressed through intricate geometric ornamental motifs. The silhouettes emphasize functional draping (scarves and outerwear) and structured, high-collar layering, translating ancient heritage into a bold, contemporary aesthetic.
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
<div class="img-box">
|
|
|
|
|
<div class="img-item" v-for="item in slides" :key="item.text">
|
|
|
|
|
<img :src="item.image" alt="">
|
|
|
|
|
<div class="text">{{ item.text }}</div>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
</template>
|
|
|
|
|
<style lang="less" scoped>
|
|
|
|
|
.inspiration{
|
|
|
|
|
width: 100%;
|
|
|
|
|
height: auto;
|
|
|
|
|
position: relative;
|
|
|
|
|
padding: 6rem 0;
|
|
|
|
|
> .title{
|
|
|
|
|
padding: 0 2.4rem;
|
|
|
|
|
font-family: "KaiseiOpti-Bold";
|
|
|
|
|
font-weight: 700;
|
|
|
|
|
font-size: 3rem;
|
|
|
|
|
line-height: 100%;
|
|
|
|
|
margin-bottom: 6rem;
|
|
|
|
|
}
|
|
|
|
|
> .info{
|
|
|
|
|
width: 70.7rem;
|
|
|
|
|
margin: 0 auto;
|
|
|
|
|
margin-bottom: 4rem;
|
|
|
|
|
> div{
|
|
|
|
|
font-family: "KaiseiOpti-Regular";
|
|
|
|
|
font-weight: 400;
|
|
|
|
|
font-size: 1.6rem;
|
|
|
|
|
line-height: 2.3rem;
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
> .img-box{
|
|
|
|
|
width: 100%;
|
|
|
|
|
margin-top: 4rem;
|
|
|
|
|
display: flex;
|
|
|
|
|
gap: 2.3rem;
|
|
|
|
|
justify-content: center;
|
|
|
|
|
> .img-item{
|
|
|
|
|
width: min-content;
|
|
|
|
|
> img{
|
|
|
|
|
margin-bottom: .9rem;
|
|
|
|
|
height: 34.3rem;
|
|
|
|
|
}
|
|
|
|
|
> .text{
|
|
|
|
|
font-family: "KaiseiOpti-Regular";
|
|
|
|
|
font-weight: 400;
|
|
|
|
|
font-size: 1.4rem;
|
|
|
|
|
line-height: 2.3rem;
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
</style>
|
