style: fix style utility class inconsistencies and correct CSS syntax

Clean up style-related code across all components:
- Replace deprecated color-* classes with text-[color]/text-white equivalents
- Remove redundant border-box declarations and fix broken empty box-sizing rule
- Correct invalid rounded corner class syntax
- Standardize line-height to leading-[value] utilities
- Uniform margin and padding notation to [xxpx] format
This commit is contained in:
DEV_DSW
2026-05-29 09:28:37 +08:00
parent e52f916231
commit 051f7d1134
46 changed files with 167 additions and 170 deletions

View File

@@ -1,9 +1,8 @@
<template>
<div class="long-text-guide-card w-full">
<div v-if="mode === 'list'" class="long-text-guide-card__list w-full">
<div v-for="item in cards" :key="item.id"
class="long-text-guide-card__summary-card bg-white rounded-24 border-box" :class="{ 'is-disabled': disabled }"
@click="openDetail(item)">
<div v-for="item in cards" :key="item.id" class="long-text-guide-card__summary-card bg-white rounded-24 "
:class="{ 'is-disabled': disabled }" @click="openDetail(item)">
<div class="long-text-guide-card__badge text-[12px] font-900" :class="`is-${item.badgeTone}`">
{{ item.badge }}
</div>
@@ -20,7 +19,7 @@
</div>
</div>
<div v-else class="long-text-guide-card__detail-card bg-white rounded-24 border-box overflow-hidden">
<div v-else class="long-text-guide-card__detail-card bg-white rounded-24 overflow-hidden">
<div class="long-text-guide-card__detail-header flex flex-items-center border-bottom-F1F5F9">
<div class="long-text-guide-card__back flex flex-items-center flex-justify-center rounded-full font-700"
@click="closeDetail">
@@ -80,7 +79,7 @@
<div class="long-text-guide-card__map-image-wrap relative">
<img class="long-text-guide-card__map-image w-full block" :src="activeItem.action.image"
mode="aspectFill" />
<div class="long-text-guide-card__map-tag color-white font-size-10 font-900">
<div class="long-text-guide-card__map-tag text-white font-size-10 font-900">
{{ activeItem.action.tag }}
</div>
</div>
@@ -89,7 +88,7 @@
<div class="color-1E293B font-size-15 font-900">{{ activeItem.action.title }}</div>
<div class="color-94A3B8 text-[12px] font-800 mt-2">{{ activeItem.action.subtitle }}</div>
</div>
<div class="long-text-guide-card__nav-btn color-white bg-0F172A text-[14px] font-900"
<div class="long-text-guide-card__nav-btn text-white bg-0F172A text-[14px] font-900"
@click="handleAction(activeItem)">
{{ activeItem.action.buttonText }}
</div>
@@ -105,7 +104,7 @@
<img class="long-text-guide-card__photo-image w-full block" :src="activeItem.action.image"
mode="aspectFill" />
<div
class="long-text-guide-card__expand flex flex-items-center flex-justify-center rounded-full color-white font-size-18 font-900">
class="long-text-guide-card__expand flex flex-items-center flex-justify-center rounded-full text-white font-size-18 font-900">
</div>
</div>