shoot-miniprograms/src/pages/first-try.vue

<script setup>
import AppBackground from "@/components/AppBackground.vue";
import Header from "@/components/Header.vue";
import Guide from "@/components/Guide.vue";
</script>

<template>
  <view>
    <AppBackground />
    <Header title="新手试炼场" />
    <Guide
      title="hi，Rocker，这是新人必刷小任务，0基础小白也能快速掌握弓箭技巧和游戏规则哦~：）"
    />
    <image src="../static/first-try-tip.png" class="try-tip" mode="widthFix" />
    <button class="start-btn">开始</button>
  </view>
</template>

<style scoped>
.try-tip {
  width: calc(100% - 20px);
  margin: 10px 10px;
}
.start-btn {
  margin: 0 10px;
  width: calc(100% - 20px);
  background-color: #fed847;
  font-size: 15px;
  padding: 3px;
  border-radius: 10px;
}
</style>