style: standardize design token classes and spacing units
Standardize styling across all components: 1. Replace legacy color utilities and hardcoded hex values with official design token classes 2. Update margin/padding/rounded corner values to use wrapped [px] syntax for consistency 3. Fix inconsistent line-height class names to use leading-[value] format
This commit is contained in:
@@ -2,7 +2,7 @@
|
||||
<div class="w-full bg-white border-ff overflow-hidden rounded-20 flex flex-col">
|
||||
<!-- 占位撑开 -->
|
||||
<div class="w-vw"></div>
|
||||
<div class="flex flex-col px-16 pt-16 pb-12 ">
|
||||
<div class="flex flex-col px-16 pt-16 pb-[12px] ">
|
||||
<div v-if="tag" class="long-answer-tag">{{ tag }}</div>
|
||||
<div v-if="title" class="flex flex-row flex-items-start flex-justify-start mb-4">
|
||||
<uni-icons class="icon-active" type="fire-filled" size="18" color="opacity" />
|
||||
|
||||
@@ -8,7 +8,7 @@
|
||||
<!-- ✅ 滚动区域 -->
|
||||
<div class="flex-full overflow-hidden chat-scroll" scroll-y :scroll-into-div="scrollIntodivId" scroll-with-animation
|
||||
@scroll="onScroll" @touchstart="onTouchStart" @touchend="onTouchEnd" @touchcancel="onTouchEnd">
|
||||
<div class="flex flex-col pt-12 px-12 pb-24 gap-10">
|
||||
<div class="flex flex-col pt-[12px] px-12 pb-24 gap-10">
|
||||
<div v-if="headerSections.title || headerSections.tag" class="long-answer-header">
|
||||
<div v-if="headerSections.title" class="long-answer-title">
|
||||
{{ headerSections.title.contentValue }}
|
||||
|
||||
@@ -6,7 +6,7 @@ v
|
||||
<SpriteAnimator :src="spriteStyle.ipLargeImage" :frameWidth="spriteStyle.frameWidth"
|
||||
:frameHeight="spriteStyle.frameHeight" :totalFrames="spriteStyle.totalFrames" :columns="spriteStyle.columns"
|
||||
:displayWidth="spriteStyle.displayWidth" :fps="16" />
|
||||
<div class="welcome-text text-[14px] font-medium font-family-misans-vf color-171717 leading-[24px]">
|
||||
<div class="welcome-text text-[14px] font-medium font-family-misans-vf text-[#171717] leading-[24px]">
|
||||
{{ welcomeContent }}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@@ -2,7 +2,7 @@
|
||||
<div class="w-full bg-white border-ff overflow-hidden rounded-20 flex flex-col">
|
||||
<!-- 占位撑开 -->
|
||||
<div class="w-vw"></div>
|
||||
<div class="flex flex-col px-16 pt-16 pb-12 " @click="openDetail(item)">
|
||||
<div class="flex flex-col px-16 pt-16 pb-[12px] " @click="openDetail(item)">
|
||||
|
||||
<div class="long-text-guide-card__badge text-[12px] font-900" :class="`is-${item.badgeTone}`">
|
||||
{{ item.badge }}
|
||||
|
||||
@@ -1,8 +1,8 @@
|
||||
<template>
|
||||
<van-popup ref="popup" position="bottom" v-model:show="show">
|
||||
<div class="popup-content pt-12 pl-12 pr-12">
|
||||
<div class="header flex flex-items-center pb-12">
|
||||
<div class="title flex-full text-center text-[17px] color-000 font-medium ml-24">更多服务</div>
|
||||
<div class="popup-content pt-[12px] pl-12 pr-12">
|
||||
<div class="header flex flex-items-center pb-[12px]">
|
||||
<div class="title flex-full text-center text-[17px] text-black font-medium ml-24">更多服务</div>
|
||||
<van-icon name="cross" size="24" color="#CACFD8" @click="close" />
|
||||
</div>
|
||||
|
||||
@@ -11,14 +11,14 @@
|
||||
<div class="flex flex-items-center flex-justify-center">
|
||||
<img v-if="item.icon" class="left" :src="item.icon" />
|
||||
<div class="center flex-full">
|
||||
<div class="text-[16px] color-000 leading-[24px] font-medium">
|
||||
<div class="text-[16px] text-black leading-[24px] font-medium">
|
||||
{{ item.title }}
|
||||
</div>
|
||||
<div class="text-[12px] color-A3A3A3 line-height-16">
|
||||
<div class="text-[12px] color-A3A3A3 leading-[16px]">
|
||||
{{ item.content }}
|
||||
</div>
|
||||
</div>
|
||||
<div class="right text-[12px] text-white line-height-16" @click="handleClick(item)">
|
||||
<div class="right text-[12px] text-white leading-[16px]" @click="handleClick(item)">
|
||||
{{ item.btnText }}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@@ -11,11 +11,11 @@
|
||||
<img v-if="coverImage" class="w-full block" :src="coverImage" mode="aspectFill" />
|
||||
|
||||
<div class="pt-16 px-12 pb-24 ">
|
||||
<div class="color-171717 text-[16px] font-weight-600">{{ detailTitle }}</div>
|
||||
<div class="text-[#171717] text-[16px] font-weight-600">{{ detailTitle }}</div>
|
||||
|
||||
<div v-if="publishTime" class="notice-time-tag flex flex-row flex-items-center mt-[16px]">
|
||||
<uni-icons type="clock" size="18" color="#5A6780" />
|
||||
<span class="color-171717 text-[12px] font-weight-600 ml-8">发布时间:{{ publishTime }}</span>
|
||||
<span class="text-[#171717] text-[12px] font-weight-600 ml-8">发布时间:{{ publishTime }}</span>
|
||||
</div>
|
||||
|
||||
<div class="mt-[16px] mx-12 bg-gray w-full height-1"></div>
|
||||
|
||||
@@ -14,7 +14,7 @@
|
||||
</div>
|
||||
|
||||
<div class="p-[4px_8px_8px]">
|
||||
<div class="text-[11px] text-[#99A0AE] truncate">
|
||||
<div class="text-[11px] text-ink-400 truncate">
|
||||
{{ item.topic }}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@@ -16,7 +16,7 @@
|
||||
<span>{{ item.distance }}</span>
|
||||
</div>
|
||||
<div
|
||||
class="recommendation-list-card__button flex flex-items-center flex-justify-center mt-12 color-334155 text-[12px] font-900"
|
||||
class="recommendation-list-card__button flex flex-items-center flex-justify-center mt-[12px] color-334155 text-[12px] font-900"
|
||||
@click.stop="handleSelect(item)">
|
||||
{{ getActionText(item) }}
|
||||
</div>
|
||||
|
||||
Reference in New Issue
Block a user