style: align community tabs with points entry

This commit is contained in:
hajimi
2026-08-02 00:55:13 +08:00
parent 0b46d497ae
commit 41aeaa5163
+35 -23
View File
@@ -10,7 +10,14 @@
<AiAssistantEntry size="compact" variant="orb" />
</view>
<view class="community-header__tools">
<view class="community-toolbar">
<view class="community-nav">
<view v-for="item in feedTabs" :key="item.key" class="community-nav__item"
:class="{ 'community-nav__item--active': activeFeed === item.key }" @tap="switchFeed(item.key)">
<text>{{ item.label }}</text>
</view>
</view>
<view class="community-wallet" @tap="openPoints">
<view class="community-wallet__coin">
<u-icon name="coupon" size="28" color="#1468f5" />
@@ -21,13 +28,6 @@
</view>
</view>
<view class="community-nav">
<view v-for="item in feedTabs" :key="item.key" class="community-nav__item"
:class="{ 'community-nav__item--active': activeFeed === item.key }" @tap="switchFeed(item.key)">
<text>{{ item.label }}</text>
</view>
</view>
<view class="community-topics">
<scroll-view scroll-x class="community-topics__scroll" show-scrollbar="false">
<view class="community-topics__list">
@@ -403,24 +403,29 @@ onShow(() => {
}
}
&__tools {
display: flex;
justify-content: flex-end;
padding: 16rpx 0 14rpx;
}
}
.community-toolbar {
height: 88rpx;
display: flex;
align-items: flex-end;
gap: 18rpx;
}
.community-wallet {
height: 56rpx;
max-width: 210rpx;
height: 52rpx;
display: inline-flex;
align-items: center;
gap: 8rpx;
padding: 0 18rpx 0 10rpx;
margin-bottom: 14rpx;
padding: 0 14rpx 0 9rpx;
border: 1rpx solid #bdd5ff;
border-radius: 999rpx;
color: #1468f5;
background: #fafdff;
box-sizing: border-box;
flex-shrink: 0;
&__coin {
width: 38rpx;
@@ -433,31 +438,38 @@ onShow(() => {
}
text {
font-size: 25rpx;
min-width: 0;
overflow: hidden;
font-size: 23rpx;
font-weight: 600;
text-overflow: ellipsis;
white-space: nowrap;
}
}
.community-nav {
height: 90rpx;
flex: 1;
min-width: 0;
height: 88rpx;
display: flex;
align-items: flex-end;
gap: 62rpx;
padding: 0 42rpx;
flex-shrink: 0;
background: #fff;
gap: 0;
padding: 0;
background: transparent;
box-sizing: border-box;
&__item {
position: relative;
height: 90rpx;
flex: 1;
min-width: 0;
height: 88rpx;
display: flex;
align-items: center;
justify-content: center;
color: #667085;
text {
font-size: 31rpx;
font-size: 29rpx;
font-weight: 500;
}