Files
MBTI_wang/miniprogram/custom-tab-bar/index.wxss
Ghost 6584417ed8 fix: 审核模式 runtime 同步、邀请码与小端 tabBar/个人中心及管理端用户页
- api: AppConfig runtime 返回 reviewMode;Invite/Settings/AppUser 等调整
- 微信小程序与抖音:app 与 tabBar、enterprise/camera/index/upload/profile 对齐审核与邀请逻辑
- 管理端:Dashboard、Settings、Users、UserDetailDialog 等更新

Made-with: Cursor
2026-03-28 17:46:36 +08:00

124 lines
2.3 KiB
Plaintext
Raw Blame History

This file contains ambiguous Unicode characters

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

/* 自定义 tabBar白底、顶部分割线、中间浮起圆钮 */
.tab-bar {
position: fixed;
left: 0;
right: 0;
bottom: 0;
background: #ffffff;
padding-bottom: env(safe-area-inset-bottom);
z-index: 9999;
}
.tab-bar-line {
height: 1rpx;
background: #e5e7eb;
width: 100%;
}
.tab-bar-inner {
display: flex;
align-items: center;
justify-content: space-between;
min-height: 120rpx;
padding: 12rpx 12rpx 10rpx;
position: relative;
box-sizing: border-box;
}
/* 审核模式仅「首页」「我的」两栏时,左右均匀留白 */
.tab-bar-inner--audit {
justify-content: space-between;
padding-left: 56rpx;
padding-right: 56rpx;
}
.tab-item {
flex: 1;
min-width: 0;
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
padding-bottom: 0;
z-index: 1;
}
.tab-icon {
width: 48rpx;
height: 48rpx;
margin-bottom: 4rpx;
}
.tab-text {
font-size: 20rpx;
color: #999999;
}
.tab-item.active .tab-text {
color: #7c3aed;
}
/* 中间列:独立层叠上下文,浮钮不盖住左右 tab */
.tab-slot-middle {
flex: 1;
min-width: 0;
position: relative;
z-index: 4;
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
padding-bottom: 0;
}
/* 浮钮:整体上移,更突出圆形快门、减少与底栏顶边重叠感 */
.middle-fab {
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
width: 100%;
transform: translateY(-26rpx);
margin-bottom: -10rpx;
}
.center-circle {
width: 84rpx;
height: 84rpx;
min-width: 84rpx;
min-height: 84rpx;
border-radius: 50%;
background: linear-gradient(135deg, #7c3aed 0%, #a78bfa 100%);
display: flex;
align-items: center;
justify-content: center;
margin-bottom: 6rpx;
box-shadow: 0 4rpx 20rpx rgba(124, 58, 237, 0.4);
border: 4rpx solid #ffffff;
flex-shrink: 0;
overflow: hidden;
}
.middle-fab.active .center-circle {
background: linear-gradient(135deg, #6d28d9 0%, #7c3aed 100%);
box-shadow: 0 4rpx 20rpx rgba(124, 58, 237, 0.6);
}
.center-icon {
width: 40rpx;
height: 40rpx;
}
.tab-text-fab {
font-size: 18rpx;
color: #999999;
line-height: 1.25;
text-align: center;
max-width: 168rpx;
}
.middle-fab.active .tab-text-fab {
color: #7c3aed;
font-weight: 600;
}