Skip to content

F
fc-minigame
Commit f8a0758e authored by 董政锦's avatar 董政锦
Browse files
Options

style: 旧皇冠样式；

parent 01d3642f
Show whitespace changes
Inline Side-by-side
Showing with 59 additions and 50 deletions
frontend-large/src/pages/game5/Game5.vue
View file @ f8a0758e
......@@ -182,7 +182,7 @@ onUnmounted(() => {
</script>
<template>
<Loading v-if="screen === 'loading'" :players="loadingPlayers" :player-count="playerCount"
<Loading v-if="screen === '!loading'" :players="loadingPlayers" :player-count="playerCount"
@start="startGameWithMusic" />
<Rank1 v-else-if="screen === 'rank1'" ref="rank1Ref" :rank-list="rankPlayers" @start="startGameWithMusic" />
<Rank2 v-else :rank-list="rankPlayers" @next="nextRoundWithMusic" />
......
frontend-large/src/pages/game5/views/Rank2View.vue
View file @ f8a0758e
......@@ -14,18 +14,18 @@ const emit = defineEmits<{
const FINAL_RANK_LIMIT = 10;
const imageUrls = {
bg: cssAssetUrl('game1/bg.png'),
bg: cssAssetUrl('game5/bg.svg'),
logo: cssAssetUrl('game1/logo.png'),
title: cssAssetUrl('game1/title3.png'),
title2: cssAssetUrl('game1/title4.png'),
podium: cssAssetUrl('game1/podium.png'),
podium: cssAssetUrl('game5/podium.webp'),
fireworks: cssAssetUrl('game1/fireworks.png'),
avatar: cssAssetUrl('avatar.png'),
guan1: cssAssetUrl('game1/guan1.png'),
pai1: cssAssetUrl('game1/pai1.png'),
guan2: cssAssetUrl('game1/guan2.png'),
guan2: cssAssetUrl('game1/guan3.png'),
pai2: cssAssetUrl('game1/pai2.png'),
guan3: cssAssetUrl('game1/guan3.png'),
guan3: cssAssetUrl('game1/guan2.png'),
pai3: cssAssetUrl('game1/pai3.png'),
rankIcon: cssAssetUrl('game1/no-icon.png'),
avatarAnimation: cssAssetUrl('avatar_animation.png'),
......@@ -68,7 +68,7 @@ const renderAvatar = (item: any | null) => {
<div class="bg">
<div class="img-logo"></div>
<div class="img-title"></div>
<div class="img-title2"></div>
<!-- <div class="img-title2"></div> -->
<div class="podium">
<div class="rank-no1">
......@@ -77,7 +77,7 @@ const renderAvatar = (item: any | null) => {
</div>
<div class="nickname">{{ list[0]?.nickname }}</div>
<div class="guan"></div>
<div class="pai"></div>
<!-- <div class="pai"></div> -->
</div>
<div class="rank-no2">
<div class="gu-burst"></div>
......@@ -85,7 +85,7 @@ const renderAvatar = (item: any | null) => {
</div>
<div class="nickname">{{ list[1]?.nickname }}</div>
<div class="guan"></div>
<div class="pai"></div>
<!-- <div class="pai"></div> -->
</div>
<div class="rank-no3">
<div class="gu-burst"></div>
......@@ -93,7 +93,7 @@ const renderAvatar = (item: any | null) => {
</div>
<div class="nickname">{{ list[2]?.nickname }}</div>
<div class="guan"></div>
<div class="pai"></div>
<!-- <div class="pai"></div> -->
</div>
</div>
......@@ -153,11 +153,11 @@ const renderAvatar = (item: any | null) => {
.podium {
background: v-bind('imageUrls.podium') no-repeat center;
width: 1347px;
height: 269px;
width: 1920px;
height: 800px;
position: absolute;
top: 427px;
left: 287px;
bottom: 0px;
/* left: 287px; */
.gu-burst {
width: 200px;
......@@ -177,8 +177,8 @@ const renderAvatar = (item: any | null) => {
position: relative;
.gu-burst {
left: 580px;
top: -200px;
left: 899px;
top: 3px;
}
.avatar {
......@@ -187,20 +187,23 @@ const renderAvatar = (item: any | null) => {
height: 120px;
border-radius: 60px;
position: absolute;
left: 610px;
top: -136px;
left: 906px;
top: 76px;
}
.nickname {
width: 167px;
height: 46px;
background: #FFCF44;
color: white;
width: 220px;
height: 52px;
background: linear-gradient(0deg, #FFBF5A 0%, #FFE47A 100%);
border-radius: 26px;
border: 1px solid #FFF9DC;
font-size: 30px;
color: #4B1A14;
text-align: center;
line-height: 46px;
position: absolute;
left: 590px;
top: -25px;
left: 856px;
top: 190px;
z-index: 1;
border-radius: 23px;
}
......@@ -210,8 +213,8 @@ const renderAvatar = (item: any | null) => {
width: 64px;
height: 64px;
position: absolute;
left: 580px;
top: -153px
left: 877px;
top: 61px;
}
.pai {
......@@ -228,8 +231,8 @@ const renderAvatar = (item: any | null) => {
position: relative;
.gu-burst {
left: 140px;
top: -170px;
left: 504px;
top: 23px;
}
.avatar {
......@@ -238,20 +241,23 @@ const renderAvatar = (item: any | null) => {
height: 120px;
border-radius: 60px;
position: absolute;
left: 180px;
top: -110px;
left: 512px;
top: 109px;
}
.nickname {
width: 167px;
height: 46px;
background: #CA9600;
color: white;
text-align: center;
line-height: 46px;
/* line-height: 46px; */
width: 220px;
height: 52px;
background: linear-gradient(0deg, #AEA6A7 0%, #EAE4DF 100%);
border-radius: 26px;
border: 1px solid #FFFFFF;
font-size: 30px;
color: #383636;
position: absolute;
left: 157px;
top: 2px;
left: 461px;
top: 221px;
z-index: 1;
border-radius: 23px;
}
......@@ -261,8 +267,8 @@ const renderAvatar = (item: any | null) => {
width: 96px;
height: 96px;
position: absolute;
left: 134px;
top: -144px;
left: 469px;
top: 70px;
}
.pai {
......@@ -279,8 +285,8 @@ const renderAvatar = (item: any | null) => {
position: relative;
.gu-burst {
left: 1020px;
top: -170px;
left: 1261px;
top: 15px;
}
.avatar {
......@@ -289,20 +295,23 @@ const renderAvatar = (item: any | null) => {
height: 120px;
border-radius: 60px;
position: absolute;
left: 1046px;
top: -110px;
left: 1286px;
top: 108px;
}
.nickname {
width: 167px;
height: 46px;
background: #E2E2E2;
color: #AFAFAF;
width: 220px;
height: 52px;
background: linear-gradient(0deg, #F3AE76 0%, #F9CDA3 100%);
border-radius: 26px;
border: 1px solid #FEFEFD;
font-size: 30px;
color: #6F3A0E;
text-align: center;
line-height: 46px;
position: absolute;
left: 1028px;
top: 2px;
left: 1240px;
top: 221px;
z-index: 1;
border-radius: 23px;
}
......@@ -312,8 +321,8 @@ const renderAvatar = (item: any | null) => {
width: 96px;
height: 96px;
position: absolute;
left: 1003px;
top: -146px;
left: 1241px;
top: 70px;
}
.pai {
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment