refactor: convert legacy color classes to tailwind syntax

Replace all custom `bg-*` utility classes across Vue components with Tailwind's arbitrary hex color notation (e.g. `bg-[#f7f7f7]`). Remove redundant hardcoded background color definitions from src/static/scss/background.scss, clean up template formatting, and update gradient button styles to use direct hex values.
This commit is contained in:
duanshuwen
2026-07-24 15:56:35 +08:00
parent d3d15b1a19
commit aa0203819c
27 changed files with 225 additions and 527 deletions

View File

@@ -1,11 +1,7 @@
<template>
<view class="poi-detail-card bg-white rounded-24 border-box overflow-hidden">
<view class="poi-detail-card__hero relative">
<image
class="poi-detail-card__image w-full h-full block rounded-18"
:src="data.image"
mode="aspectFill"
/>
<image class="poi-detail-card__image w-full h-full block rounded-18" :src="data.image" mode="aspectFill" />
<view class="poi-detail-card__badge flex flex-items-center gap-4 font-size-10 font-900">
<text class="poi-detail-card__badge-icon"></text>
<text>{{ data.badge?.text }}</text>
@@ -25,10 +21,8 @@
</view>
<view
class="poi-detail-card__button flex flex-items-center flex-justify-center gap-8 color-white bg-0F172A font-size-16 font-900"
:class="{ 'is-disabled': disabled }"
@click="handleAction"
>
class="poi-detail-card__button flex flex-items-center flex-justify-center gap-8 color-white bg-[#0f172a] font-size-16 font-900"
:class="{ 'is-disabled': disabled }" @click="handleAction">
<text class="poi-detail-card__button-icon"></text>
<text>{{ data.action?.text }}</text>
</view>