style: standardize tailwind classes and cleanup legacy styles

Replace `flex-shrink-0` with `shrink-0` across components for consistency
Migrate legacy color utility classes to inline hex Tailwind classes
Replace background color utility classes with inline hex equivalents
Delete unused SCSS style files for ScenicImageCard and RoutePlanCard
Refactor RoutePlanCard to use inline Tailwind styles instead of external CSS
Update icon component usage in RoutePlanCard to match project standards
This commit is contained in:
DEV_DSW
2026-05-29 14:32:05 +08:00
parent f0a149d8a6
commit 79770b03d4
14 changed files with 74 additions and 341 deletions

View File

@@ -9,7 +9,7 @@
<div class="long-text-guide-card__summary-title text-[#1e293b] text-[18px] font-bold">
{{ item.title }}
</div>
<div class="long-text-guide-card__summary-text color-94A3B8 text-[14px] font-medium ellipsis-2">
<div class="long-text-guide-card__summary-text text-[#94A3B8] text-[14px] font-medium ellipsis-2">
{{ item.summary }}
</div>
<div class="long-text-guide-card__summary-footer flex items-center justify-between">
@@ -52,9 +52,9 @@
<div class="long-text-guide-card__section-title text-[#1e293b] text-[16px] font-bold">
{{ activeItem.sectionTitle }}
</div>
<div class="long-text-guide-card__tip-block bg-ECFDF5">
<div class="long-text-guide-card__tip-block bg-[#ecfdf5]">
<div v-for="(tip, index) in activeItem.tips || []" :key="tip"
class="long-text-guide-card__tip color-047857 text-[14px] font-800">
class="long-text-guide-card__tip text-[#047857] text-[14px] font-800">
{{ index + 1 }} {{ tip }}
</div>
</div>
@@ -72,7 +72,7 @@
</div>
<div v-if="activeItem.action?.type === 'map'" class="long-text-guide-card__action-zone">
<div class="long-text-guide-card__action-label color-94A3B8 text-[11px] font-800">
<div class="long-text-guide-card__action-label text-[#94A3B8] text-[11px] font-800">
{{ activeItem.action.label }}
</div>
<div class="long-text-guide-card__map-card rounded-[16px] overflow-hidden">
@@ -86,7 +86,7 @@
<div class="long-text-guide-card__map-bar flex items-center bg-white">
<div class="flex-1">
<div class="text-[#1e293b] text-[15px] font-bold">{{ activeItem.action.title }}</div>
<div class="color-94A3B8 text-[12px] font-800 mt-2">{{ activeItem.action.subtitle }}</div>
<div class="text-[#94A3B8] text-[12px] font-800 mt-2">{{ activeItem.action.subtitle }}</div>
</div>
<div class="long-text-guide-card__nav-btn text-white bg-0F172A text-[14px] font-bold"
@click="handleAction(activeItem)">
@@ -97,7 +97,7 @@
</div>
<div v-else-if="activeItem.action?.type === 'image'" class="long-text-guide-card__action-zone">
<div class="long-text-guide-card__action-label color-94A3B8 text-[11px] font-800">
<div class="long-text-guide-card__action-label text-[#94A3B8] text-[11px] font-800">
{{ activeItem.action.label }}
</div>
<div class="long-text-guide-card__photo-card relative" @click="handleAction(activeItem)">