style: replace legacy typography classes with modern utilities

Convert all legacy font-size-*, font-weight-*, and line-height-* CSS utility classes to modern inline utility formats (text-[Xpx], font-{weight}, leading-[Xpx]). Also remove unused GoodsInfo component SCSS file, its associated image asset, and clean up the stale style import in GoodsInfo.vue.
This commit is contained in:
DEV_DSW
2026-05-29 09:48:59 +08:00
parent 7f68ee06b7
commit a131531a81
42 changed files with 100 additions and 104 deletions

View File

@@ -6,10 +6,10 @@
<div class="long-text-guide-card__badge text-[12px] font-900" :class="`is-${item.badgeTone}`">
{{ item.badge }}
</div>
<div class="long-text-guide-card__summary-title color-1E293B font-size-18 font-900">
<div class="long-text-guide-card__summary-title color-1E293B text-[18px] font-900">
{{ item.title }}
</div>
<div class="long-text-guide-card__summary-text color-94A3B8 text-[14px] font-500 ellipsis-2">
<div class="long-text-guide-card__summary-text color-94A3B8 text-[14px] font-medium ellipsis-2">
{{ item.summary }}
</div>
<div class="long-text-guide-card__summary-footer flex flex-items-center flex-justify-between">
@@ -25,7 +25,7 @@
@click="closeDetail">
<uni-icons type="left" size="16" color="#CBD5E1"></uni-icons>
</div>
<div class="long-text-guide-card__detail-title color-1E293B font-size-18 font-900 ellipsis-1">
<div class="long-text-guide-card__detail-title color-1E293B text-[18px] font-900 ellipsis-1">
{{ activeItem.title }}
</div>
<div class="long-text-guide-card__badge long-text-guide-card__detail-badge text-[12px] font-900"
@@ -36,7 +36,7 @@
<div class="long-text-guide-card__rich-body">
<div v-for="(paragraph, paragraphIndex) in paragraphsBeforeImage" :key="`before-${paragraphIndex}`"
class="long-text-guide-card__paragraph color-475569 font-size-15 font-500">
class="long-text-guide-card__paragraph color-475569 text-[15px] font-medium">
<template v-for="(segment, segmentIndex) in getSegments(paragraph)"
:key="`${paragraphIndex}-${segmentIndex}`">
<span v-if="segment.highlight" class="long-text-guide-card__highlight font-800">
@@ -49,7 +49,7 @@
<image v-if="activeItem.image" class="long-text-guide-card__main-image w-full rounded-14 block"
:src="activeItem.image" mode="aspectFill" />
<div class="long-text-guide-card__section-title color-1E293B font-size-16 font-900">
<div class="long-text-guide-card__section-title color-1E293B text-[16px] font-900">
{{ activeItem.sectionTitle }}
</div>
<div class="long-text-guide-card__tip-block bg-ECFDF5">
@@ -60,7 +60,7 @@
</div>
<div v-for="(paragraph, paragraphIndex) in paragraphsAfterTips" :key="`after-${paragraphIndex}`"
class="long-text-guide-card__paragraph color-475569 font-size-15 font-500">
class="long-text-guide-card__paragraph color-475569 text-[15px] font-medium">
<template v-for="(segment, segmentIndex) in getSegments(paragraph)"
:key="`${paragraphIndex}-${segmentIndex}`">
<span v-if="segment.highlight" class="long-text-guide-card__highlight font-800">
@@ -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 font-size-11 font-800">
<div class="long-text-guide-card__action-label color-94A3B8 text-[11px] font-800">
{{ activeItem.action.label }}
</div>
<div class="long-text-guide-card__map-card rounded-16 overflow-hidden">
@@ -85,7 +85,7 @@
</div>
<div class="long-text-guide-card__map-bar flex flex-items-center bg-white">
<div class="flex-full">
<div class="color-1E293B font-size-15 font-900">{{ activeItem.action.title }}</div>
<div class="color-1E293B text-[15px] 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 text-white bg-0F172A text-[14px] font-900"
@@ -97,14 +97,14 @@
</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 font-size-11 font-800">
<div class="long-text-guide-card__action-label color-94A3B8 text-[11px] font-800">
{{ activeItem.action.label }}
</div>
<div class="long-text-guide-card__photo-card relative" @click="handleAction(activeItem)">
<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 text-white font-size-18 font-900">
class="long-text-guide-card__expand flex flex-items-center flex-justify-center rounded-full text-white text-[18px] font-900">
</div>
</div>