AI和Mine页面的样式改成新样式了。
This commit is contained in:
@@ -1,11 +1,12 @@
|
||||
// 自定义 tabBar:固定在底部,选中态只换颜色、不换图形。
|
||||
// 「首页 / 我的」走 TDesign 线性图标字体;「AI客服」用品牌 AI 图标
|
||||
// (气泡内 AI 字位图):灰色版 ai.png 为未选中态,暖橙版 ai-ink.png 为选中态,
|
||||
// 与文字颜色同步切换,保持选中可辨
|
||||
// 三个 tab 统一走 TDesign 线性图标字体:home / chat-bubble / user。
|
||||
// 「AI客服」曾用位图(气泡内嵌 AI 字:灰色 ai.png、暖橙 ai-ink.png)当图标,
|
||||
// 其轮廓笔画比图标字体细一档,与另外两个并排时粗细不搭,故弃用。
|
||||
// 位图文件仍留在 images/ 下未删(app.json 的 tabBar 项也在引用,见 DESIGN.md §5.2)
|
||||
Component({
|
||||
data: {
|
||||
selected: 0, // 当前选中项,由各 tab 页在 onShow 里同步
|
||||
activeColor: '#C2410C', // 选中:暖橙深一档,白底 4.69:1,过 WCAG AA 正文标准
|
||||
activeColor: '#B8520A', // 选中:暖橙(色相 25°、保住原亮度),白底 4.94:1,过 WCAG AA 正文标准
|
||||
inactiveColor: '#7A7068', // 未选中:暖灰,白底 4.83:1,过 WCAG AA 正文标准
|
||||
list: [{
|
||||
pagePath: '/pages/home/index',
|
||||
@@ -14,9 +15,8 @@ Component({
|
||||
}, {
|
||||
pagePath: '/pages/ai/aichat',
|
||||
text: 'AI客服',
|
||||
// 图片图标:配置了 imgPath 时优先于 icon 渲染
|
||||
imgPath: '/images/ai.png',
|
||||
imgActivePath: '/images/ai-ink.png'
|
||||
// 标准「聊天」图标:线性,与 home / user 同族
|
||||
icon: 'chat'
|
||||
}, {
|
||||
pagePath: '/pages/mine/mine',
|
||||
text: '我的',
|
||||
|
||||
@@ -7,16 +7,8 @@
|
||||
data-path="{{ item.pagePath }}"
|
||||
bindtap="onTap"
|
||||
>
|
||||
<!-- 配置了 imgPath 的 tab(AI客服)走位图:灰色未选中 / 暖橙选中两态切换;
|
||||
其余 tab 走 TDesign 线性图标,选中态只换颜色 -->
|
||||
<image
|
||||
wx:if="{{ item.imgPath }}"
|
||||
class="tab-icon-img"
|
||||
src="{{ selected === index ? item.imgActivePath : item.imgPath }}"
|
||||
mode="aspectFit"
|
||||
/>
|
||||
<!-- 三个 tab 统一走 TDesign 线性图标字体,笔画同族;选中态只换颜色、不换图形 -->
|
||||
<t-icon
|
||||
wx:else
|
||||
name="{{ item.icon }}"
|
||||
size="44rpx"
|
||||
color="{{ selected === index ? activeColor : inactiveColor }}"
|
||||
|
||||
@@ -20,12 +20,6 @@
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
/* 位图图标(AI客服):与 t-icon 的 44rpx 视觉尺寸对齐 */
|
||||
.tab-icon-img {
|
||||
width: 44rpx;
|
||||
height: 44rpx;
|
||||
}
|
||||
|
||||
.tab-text {
|
||||
margin-top: 6rpx;
|
||||
/* 与全局约束一致:中文正文不小于 24rpx(12px) */
|
||||
@@ -35,6 +29,7 @@
|
||||
}
|
||||
|
||||
.tab-item.is-active .tab-text {
|
||||
color: #C2410C;
|
||||
/* 选中文字:暖橙 --brand-strong 的硬编码(组件读不到 page 级变量),白底 4.94:1,过 AA */
|
||||
color: #B8520A;
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user