style: 调整返回首页按钮样式

main
LyMysterious 1 year ago
parent ff74dd1e9b
commit de5bcc3ce6

@ -57,14 +57,7 @@
</div> </div>
<div class="back-button"> <div class="back-button">
<el-button <el-button @click="$router.push({ name: 'Home' })" size="small" type="">返回首页</el-button>
@click="$router.push({ name: 'Home' })"
size="small"
type="default"
icon="ArrowLeft"
>
返回首页
</el-button>
</div> </div>
</div> </div>
</div> </div>

@ -2,43 +2,23 @@
<div class="fishing-page"> <div class="fishing-page">
<div class="fishing-container"> <div class="fishing-container">
<div class="fishing-area"> <div class="fishing-area">
<div <div class="fishing-animation" :class="{
class="fishing-animation"
:class="{
'fishing-active': isFishing, 'fishing-active': isFishing,
reeling: isReeling, reeling: isReeling,
}" }">
>
<div class="fishing-scene" @click="handleFish"></div> <div class="fishing-scene" @click="handleFish"></div>
<div class="ripple"></div> <div class="ripple"></div>
</div> </div>
<div class="result" v-if="resultMessage || nextPullTime"> <div class="result" v-if="resultMessage || nextPullTime">
<el-alert <el-alert v-if="resultMessage" :title="resultMessage" :type="currentCatch.length > 0 ? 'success' : 'info'"
v-if="resultMessage" :closable="false" show-icon />
:title="resultMessage" <el-alert v-if="nextPullTime" :title="`下次可钓鱼时间:${nextPullTime}`" type="warning" :closable="false" show-icon />
:type="currentCatch.length > 0 ? 'success' : 'info'"
:closable="false"
show-icon
/>
<el-alert
v-if="nextPullTime"
:title="`下次可钓鱼时间:${nextPullTime}`"
type="warning"
:closable="false"
show-icon
/>
</div> </div>
</div> </div>
<div class="log-area"> <div class="log-area">
<FishingLog :logs="fishingLogs" /> <FishingLog :logs="fishingLogs" />
<div class="back-button"> <div class="back-button">
<el-button <el-button @click="goHome" size="small" type="">返回首页</el-button>
@click="goHome"
size="small"
type="default"
icon="ArrowLeft"
>返回</el-button
>
</div> </div>
</div> </div>
</div> </div>
@ -181,8 +161,7 @@ const handleFish = async () => {
// //
const messageList = items.map( const messageList = items.map(
(fish) => (fish) =>
`${fish.isRare ? "稀有的" : ""}${fish.fishName}」,重量 ${ `${fish.isRare ? "稀有的" : ""}${fish.fishName}」,重量 ${fish.weight
fish.weight
}` }`
); );
resultMessage.value = `你钓到了:\n${messageList.join("\n")}`; resultMessage.value = `你钓到了:\n${messageList.join("\n")}`;
@ -261,24 +240,6 @@ const goHome = () => {
text-align: center; text-align: center;
} }
.back-button .el-button {
padding: 12px 24px;
font-size: 16px;
border-radius: 24px;
transition: all 0.3s ease;
background: #409eff;
border: 1px solid #409eff;
color: white;
font-weight: bold;
}
.back-button .el-button:hover {
transform: translateY(-2px);
box-shadow: 0 4px 16px rgba(64, 158, 255, 0.3);
background: #66b1ff;
border-color: #66b1ff;
}
.fishing-area { .fishing-area {
text-align: center; text-align: center;
background: #fff; background: #fff;

Loading…
Cancel
Save