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

style: clean up and standardize component styles

Browse Source 
Replace all instances of the non-standard `font-800` font weight class with Tailwind's native `font-bold` across multiple components for consistent styling.
Convert numeric spacing shorthand values (e.g. `mt-4`, `p-16`, `gap-16`) to explicit pixel-based Tailwind classes like `mt-[4px]` for clearer, more consistent spacing.
Refactor the RecommendationListCard component to remove its external SCSS stylesheet, replacing all old class definitions with inline Tailwind utility classes and removing the unused style import statement.
This commit is contained in:
DEV_DSW
2026-05-29 16:20:47 +08:00
parent 87c42145ad
commit 255a7c0aa8
14 changed files with 30 additions and 88 deletions
Download Patch File Download Diff File Expand all files Collapse all files

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

@@ -13,7 +13,7 @@
{{ item.summary }}
</div>
<div class="long-text-guide-card__summary-footer flex items-center justify-between">
<text class="color-CBD5E1 text-[12px] font-800">{{ item.footer }}</text>
<text class="color-CBD5E1 text-[12px] font-bold">{{ item.footer }}</text>
<uni-icons type="right" size="16" color="#CBD5E1"></uni-icons>
</div>
</div>
@@ -39,7 +39,7 @@
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">
<span v-if="segment.highlight" class="long-text-guide-card__highlight font-bold">
{{ segment.text }}
</span>
<span v-else>{{ segment.text }}</span>
@@ -54,7 +54,7 @@
</div>
<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 text-[#047857] text-[14px] font-800">
class="long-text-guide-card__tip text-[#047857] text-[14px] font-bold">
{{ index + 1 }} {{ tip }}
</div>
</div>
@@ -63,7 +63,7 @@
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">
<span v-if="segment.highlight" class="long-text-guide-card__highlight font-bold">
{{ segment.text }}
</span>
<span v-else>{{ segment.text }}</span>
@@ -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 text-[#94A3B8] text-[11px] font-800">
<div class="long-text-guide-card__action-label text-[#94A3B8] text-[11px] font-bold">
{{ 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="text-[#94A3B8] text-[12px] font-800 mt-2">{{ activeItem.action.subtitle }}</div>
<div class="text-[#94A3B8] text-[12px] font-bold 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 text-[#94A3B8] text-[11px] font-800">
<div class="long-text-guide-card__action-label text-[#94A3B8] text-[11px] font-bold">
{{ activeItem.action.label }}
</div>
<div class="long-text-guide-card__photo-card relative" @click="handleAction(activeItem)">