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:
@@ -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>
|
||||
|
||||
Reference in New Issue
Block a user