aidlab/aida_front
7
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Merge branch 'dev_vite' of http://18.167.251.121:10003/aidlab/aida_front into dev_vite

Browse Source
This commit is contained in:
李志鹏
2026-01-20 13:18:30 +08:00
parent 27e43f3c97 516ad19db7
commit 747a3b0ebc
4 changed files with 95 additions and 107 deletions
Download Patch File Download Diff File Expand all files Collapse all files

BIN
src/assets/images/award/apply_bg.png
View File

Binary file not shown.
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 930 KiB

After

Width:  |  Height:  |  Size: 80 KiB

BIN
src/assets/images/award/timeline_bg.png
View File

Binary file not shown.
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 80 KiB

After

Width:  |  Height:  |  Size: 2.2 MiB

BIN
src/assets/images/award/timeline_line.png
View File

Binary file not shown.
Side by Side

Before

Width:  |  Height:  |  Size: 179 KiB

202
src/views/AwardPage/index.vue
View File

@@ -24,16 +24,6 @@
<div class="label">{{ item.label }}</div> <div class="label">{{ item.label }}</div>
<div class="line"></div> <div class="line"></div>
</div> </div>
<div class="block-item flex flex-col flex-center">
<div class="number">
<img
src="@/assets/images/award/∞.png"
alt=""
class="infinity"
/>
</div>
<div class="label">Possibilites</div>
</div>
</div> </div>
<div class="bloom container flex flex-col align-center"> <div class="bloom container flex flex-col align-center">
<div class="title">Bloom Your Creativity</div> <div class="title">Bloom Your Creativity</div>
@@ -50,7 +40,7 @@
intelligence. intelligence.
</div> </div>
</div> </div>
<div class="design-container container"> <!-- <div class="design-container container">
<div class="design-title limit">Design Without Borders</div> <div class="design-title limit">Design Without Borders</div>
<div class="limit"> <div class="limit">
<img <img
@@ -64,20 +54,16 @@
York to Shanghai, we're seeking the next generation of fashion innovators York to Shanghai, we're seeking the next generation of fashion innovators
who dare to reimagine the future of design. who dare to reimagine the future of design.
</div> </div>
</div> </div> -->
<div class="timeline-container container flex flex-col align-center"> <div class="timeline-container container flex flex-col align-center">
<div class="timeline-title">Competition Timeline</div> <div class="timeline-title">Competition Timeline</div>
<img <!-- <img
src="@/assets/images/award/bloom_logo.png" src="@/assets/images/award/bloom_logo.png"
alt="" alt=""
class="logo" class="logo"
/> /> -->
<div class="desc">Shaping the Future</div> <div class="desc">Shaping the Future</div>
<div class="timeline-point"> <div class="timeline-point">
<img
src="@/assets/images/award/timeline_line.png"
class="line-bg"
/>
<div class="labels-row flex align-center"> <div class="labels-row flex align-center">
<div <div
class="item-label flex flex-col" class="item-label flex flex-col"
@@ -128,13 +114,35 @@
</div> </div>
</div> </div>
</div> </div>
<div class="judges-container flex flex-col align-center">
<div class="title">Panel of Judges</div>
<img
src="@/assets/images/award/bloom_logo.png"
class="logo"
/>
<div class="sub-title">Expertise</div>
<div class="judgement-list">
<div
class="judgement-item flex flex-col align-center"
v-for="item in judgements"
:key="item.name"
>
<img
:src="item.picture"
class="picture"
/>
<div class="name">{{ item.name }}</div>
<div class="desc">{{ item.desc }}</div>
</div>
</div>
</div>
<div class="prizes-container container flex align-center"> <div class="prizes-container container flex align-center">
<div class="left flex flex-col flex-center"> <div class="left flex flex-col flex-center">
<div class="title">Award & Prizes</div> <div class="title">Award & Prizes</div>
<img <!-- <img
src="@/assets/images/award/bloom_logo.png" src="@/assets/images/award/bloom_logo.png"
class="logo" class="logo"
/> /> -->
<div class="desc">Recongnition</div> <div class="desc">Recongnition</div>
</div> </div>
<div class="right"> <div class="right">
@@ -225,28 +233,6 @@
</div> </div>
</div> </div>
</div> </div>
<div class="judges-container flex flex-col align-center">
<div class="title">Panel of Judges</div>
<img
src="@/assets/images/award/bloom_logo.png"
class="logo"
/>
<div class="sub-title">Expertise</div>
<div class="judgement-list">
<div
class="judgement-item flex flex-col align-center"
v-for="item in judgements"
:key="item.name"
>
<img
:src="item.picture"
class="picture"
/>
<div class="name">{{ item.name }}</div>
<div class="desc">{{ item.desc }}</div>
</div>
</div>
</div>
</div> </div>
</template> </template>
@@ -273,16 +259,20 @@
const blocksList = ref([ const blocksList = ref([
{ {
number: '100', number: 'NETWORKING\n OPPORTUNITIES',
label: 'Semi-finalists' label: 'with international\nmedia and designers'
}, },
{ {
number: '20', number: 'INTERNATIONAL\nMEDIA EXPOSE',
label: 'Finalists' label: 'through\nleading outlets'
}, },
{ {
number: '3', number: 'UP TO\nUS$9000',
label: 'Winners' label: 'in total prize\npool awards'
},
{
number: 'TRAVEL\NALLOWANCE',
label: 'for finalists to attend\naward ceremony'
} }
]) ])
@@ -313,20 +303,20 @@
const prizes = ref([ const prizes = ref([
{ {
money: '$3000', money: 'US$5000',
name: 'Grand Prize',
desc: ['Cash Award', 'Award Ceritificate', 'Global Media Exposure']
},
{
money: 'US$3000',
name: 'First Runner-Up', name: 'First Runner-Up',
desc: ['Cash Award', 'Award Ceritificate', 'Global Media Exposure'] desc: ['Cash Award', 'Award Ceritificate', 'Global Media Exposure']
}, },
{ {
money: '$2000', money: 'US$2000',
name: 'Second Runner-Up', name: 'Second Runner-Up',
desc: ['Cash Award', 'Award Ceritificate', 'Global Media Exposure'] desc: ['Cash Award', 'Award Ceritificate', 'Global Media Exposure']
}, },
{
money: '$5000',
name: 'Grand Prize',
desc: ['Cash Award', 'Award Ceritificate', 'Global Media Exposure']
},
{ {
money: 'Certification', money: 'Certification',
name: 'Finalists', name: 'Finalists',
@@ -477,13 +467,18 @@
height: 100%; height: 100%;
color: #fff; color: #fff;
position: relative; position: relative;
text-align: center;
white-space: pre-line;
row-gap: 3rem;
.number { .number {
font-size: 6rem; font-size: 3.6rem;
font-family: 'Poppins'; font-family: 'PoppinsBold';
font-weight: 600;
} }
.label { .label {
font-size: 2.8rem; font-size: 2.4rem;
font-family: 'Arial'; font-family: 'Arial';
font-weight: 400;
letter-spacing: 0.05em; letter-spacing: 0.05em;
} }
.line { .line {
@@ -525,56 +520,49 @@
margin-bottom: 12.3rem; margin-bottom: 12.3rem;
} }
} }
.design-container { // .design-container {
background: url('@/assets/images/award/design_bg.png') no-repeat; // background: url('@/assets/images/award/design_bg.png') no-repeat;
background-size: 100% 100%; // background-size: 100% 100%;
padding-left: 21.5rem; // padding-left: 21.5rem;
padding-top: 16rem; // padding-top: 16rem;
.limit { // .limit {
width: 48.4rem; // width: 48.4rem;
text-align: center; // text-align: center;
} // }
.design-title { // .design-title {
color: #fff; // color: #fff;
font-size: 4rem; // font-size: 4rem;
font-weight: 600; // font-weight: 600;
font-family: 'Poppins'; // font-family: 'Poppins';
font-style: SemiBold; // font-style: SemiBold;
vertical-align: middle; // vertical-align: middle;
text-transform: capitalize; // text-transform: capitalize;
} // }
.logo { // .logo {
margin-top: 2.4rem; // margin-top: 2.4rem;
margin-bottom: 2.1rem; // margin-bottom: 2.1rem;
} // }
.global { // .global {
font-family: 'Poppins'; // font-family: 'Poppins';
font-size: 3rem; // font-size: 3rem;
color: #f95750; // color: #f95750;
margin-bottom: 19.8rem; // margin-bottom: 19.8rem;
} // }
.desc { // .desc {
font-family: 'Arial'; // font-family: 'Arial';
font-weight: 400; // font-weight: 400;
font-size: 2.8rem; // font-size: 2.8rem;
color: #e0e0e0; // color: #e0e0e0;
width: 54rem; // width: 54rem;
} // }
} // }
.timeline-container { .timeline-container {
background: url('@/assets/images/award/timeline_bg.png') no-repeat; background: url('@/assets/images/award/timeline_bg.png') no-repeat;
background-size: 100% 100%; background-size: 100% 100%;
position: relative; position: relative;
padding-top: 12.8rem; padding-top: 12.8rem;
width: 100%; width: 100%;
.line-bg { color: #fff;
position: absolute;
width: 148.7rem;
height: 27.58rem;
left: 24rem;
bottom: 22.8rem;
z-index: 0;
}
.timeline-title { .timeline-title {
font-family: 'PoppinsBold'; font-family: 'PoppinsBold';
font-weight: 600; font-weight: 600;
@@ -589,7 +577,7 @@
font-family: 'Arial'; font-family: 'Arial';
font-size: 3rem; font-size: 3rem;
font-weight: 400; font-weight: 400;
color: #b10000; color: #f95750;
} }
.timeline-point { .timeline-point {
flex: 1; flex: 1;
@@ -605,7 +593,7 @@
margin-bottom: 8rem; margin-bottom: 8rem;
.item-label { .item-label {
flex: 1; flex: 1;
color: #232323; color: #fff;
font-family: 'PoppinsBold'; font-family: 'PoppinsBold';
font-weight: 600; font-weight: 600;
font-size: 2.8rem; font-size: 2.8rem;
@@ -652,7 +640,7 @@
position: relative; position: relative;
.item-time { .item-time {
flex: 1; flex: 1;
color: #b10000; color: #f95750;
font-family: 'Arial'; font-family: 'Arial';
font-weight: 400; font-weight: 400;
font-size: 2.8rem; font-size: 2.8rem;
@@ -669,7 +657,7 @@
font-weight: 400; font-weight: 400;
font-size: 2rem; font-size: 2rem;
text-align: center; text-align: center;
color: #585858; color: #e0e0e0;
width: 31.2rem; width: 31.2rem;
height: 10.2rem; height: 10.2rem;
} }
@@ -750,7 +738,7 @@
} }
.apply-container { .apply-container {
flex: 1; flex: 1;
background: url('@/assets/images/award/timeline_bg.png') no-repeat; background: url('@/assets/images/award/apply_bg.png') no-repeat;
background-size: 100% 100%; background-size: 100% 100%;
padding: 12.7rem 0 16.9rem; padding: 12.7rem 0 16.9rem;
.title { .title {