duanshuwen/nianxx-h5
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

style: update flex alignment classes and clean up UI styles

Browse Source 
Replace all deprecated `flex-items-center` utility classes with standard `items-center` across components. Additionally, update font weight classes from `font-900` to `font-bold`, standardize hex color class syntax to use bracket notation, and remove unused SCSS styles from the SharedVisual component.
This commit is contained in:
DEV_DSW
2026-05-29 10:21:21 +08:00
parent 6e227ff441
commit 653cdd5139
40 changed files with 163 additions and 186 deletions
Download Patch File Download Diff File Expand all files Collapse all files

26
src/pages/home/components/LongTextGuideCard/index.vue
View File

@@ -3,16 +3,16 @@
<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 "
:class="{ 'is-disabled': disabled }" @click="openDetail(item)">
<div class="long-text-guide-card__badge text-[12px] font-900" :class="`is-${item.badgeTone}`">
<div class="long-text-guide-card__badge text-[12px] font-bold" :class="`is-${item.badgeTone}`">
{{ item.badge }}
</div>
<div class="long-text-guide-card__summary-title color-1E293B text-[18px] font-900">
<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">
{{ item.summary }}
</div>
<div class="long-text-guide-card__summary-footer flex flex-items-center flex-justify-between">
<div class="long-text-guide-card__summary-footer flex items-center flex-justify-between">
<text class="color-CBD5E1 text-[12px] font-800">{{ item.footer }}</text>
<uni-icons type="right" size="16" color="#CBD5E1"></uni-icons>
</div>
@@ -20,15 +20,15 @@
</div>
<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"
<div class="long-text-guide-card__detail-header flex items-center border-bottom-F1F5F9">
<div class="long-text-guide-card__back flex items-center flex-justify-center rounded-full font-700"
@click="closeDetail">
<uni-icons type="left" size="16" color="#CBD5E1"></uni-icons>
</div>
<div class="long-text-guide-card__detail-title color-1E293B text-[18px] font-900 truncate">
<div class="long-text-guide-card__detail-title text-[#1e293b] text-[18px] font-bold truncate">
{{ activeItem.title }}
</div>
<div class="long-text-guide-card__badge long-text-guide-card__detail-badge text-[12px] font-900"
<div class="long-text-guide-card__badge long-text-guide-card__detail-badge text-[12px] font-bold"
:class="`is-${activeItem.badgeTone}`">
{{ activeItem.badge }}
</div>
@@ -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 text-[16px] font-900">
<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">
@@ -79,16 +79,16 @@
<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 text-white font-size-10 font-900">
<div class="long-text-guide-card__map-tag text-white font-size-10 font-bold">
{{ activeItem.action.tag }}
</div>
</div>
<div class="long-text-guide-card__map-bar flex flex-items-center bg-white">
<div class="long-text-guide-card__map-bar flex items-center bg-white">
<div class="flex-1">
<div class="color-1E293B text-[15px] font-900">{{ activeItem.action.title }}</div>
<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>
<div class="long-text-guide-card__nav-btn text-white bg-0F172A text-[14px] font-900"
<div class="long-text-guide-card__nav-btn text-white bg-0F172A text-[14px] font-bold"
@click="handleAction(activeItem)">
{{ activeItem.action.buttonText }}
</div>
@@ -104,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 text-white text-[18px] font-900">
class="long-text-guide-card__expand flex items-center flex-justify-center rounded-full text-white text-[18px] font-bold">
↗
</div>
</div>