perf: 返回按钮文字版式优化

src/components/BtnBack.vue

@@ -8,7 +8,12 @@
         draggable="false"
       >
     </button>
-    <span class="text">返回</span>
+    <span
+      class="text"
+      :class="{
+        needShadow: props.textShadow,
+      }"
+    >返回</span>
   </div>
 </template>
 
@@ -32,10 +37,23 @@ const {
 const props = defineProps({
   color: {
     type: String,
-    default: 'white',
+    default: 'white', // 'white', 'green'
+  },
+  textShadow: {
+    type: Boolean,
+    default: false,
   }
 })
 
+const textColor = computed(() => {
+  if (props.color === "white") {
+    return "#fff"
+  } else if (props.color === "green") {
+    return "#7B916B"
+  } else {
+    return props.color
+  }
+})
 </script>
 
 <style lang="less" scoped>
@@ -51,6 +69,7 @@ const props = defineProps({
     flex: 0 0 auto;
     width: 100%;
     height: 100%;
+    margin-right: 9px;
     >img{
       width: 100%;
       height: 100%;
@@ -61,8 +80,11 @@ const props = defineProps({
     font-family: KaiTi, KaiTi;
     font-weight: 400;
     font-size: 24px;
-    color: #FFFFFF;
+    color: v-bind("textColor");
     line-height: 28px;
   }
+  >.text.needShadow{
+    text-shadow: 1px 1px 2px rgba(0, 0, 0, 0.3);
+  }
 }
 </style>

src/views/ShuangGou.vue

@@ -7,7 +7,10 @@
       draggable="false"
     >
 
-    <BtnBack @click="router.go(-1)" />
+    <BtnBack
+      :text-shadow="true"
+      @click="router.go(-1)"
+    />
     <HotspotComp
       class="hotspot-1"
       :style="{