2026-05-08 20:05:52 +08:00

292 lines
4.2 KiB
Plaintext

/* ===== 页面 ===== */
.points-page {
min-height: 100vh;
background: #f5f7fa;
display: flex;
flex-direction: column;
}
/* ===== 蓝色头部 ===== */
.header {
background: linear-gradient(180deg, #1a3a8a 0%, #194e99 100%);
position: relative;
border-radius: 0 0 100rpx 100rpx;
}
.stat-icon {
position: absolute;
top: 30rpx;
left: 0;
width: 100%;
height: 100%;
}
.stat-iconb {
position: absolute;
bottom: 16rpx;
right: 50%;
transform: translateX(50%);
width: 70rpx;
height: 12rpx;
}
.weui-navigation-bar__btn_goback{
background-color: #fff !important;
}
.empty-icon{
width: 400rpx;
height: 260rpx;
margin-bottom: 20rpx;
}
.nav-title {
font-size: 34rpx;
font-weight: 600;
color: #ffffff;
}
.nav-placeholder {
width: 60rpx;
}
/* ===== 积分总数 ===== */
.points-total {
position: relative;
display: flex;
flex-direction: column;
align-items: center;
padding: 20rpx 0 50rpx;
}
.points-num {
font-size: 80rpx;
font-weight: 800;
color: #ffffff;
line-height: 1.1;
}
.points-label {
font-size: 24rpx;
color: rgba(255, 255, 255, 0.7);
margin-top: 8rpx;
}
/* ===== Tab 栏 ===== */
.tab-bar {
display: flex;
background: #ffffff;
border-radius: 16rpx;
margin: 20rpx;
}
.tab-item {
flex: 1;
position: relative;
display: flex;
align-items: center;
justify-content: center;
padding: 26rpx 0;
}
.tab-text {
font-size: 30rpx;
color: #999;
}
.tab-item.active .tab-text {
color: #1a1a1a;
font-weight: 700;
font-size: 32rpx;
}
.tab-line {
position: absolute;
bottom: 0;
left: 50%;
transform: translateX(-50%);
width: 48rpx;
height: 6rpx;
background: #1a56db;
border-radius: 3rpx;
}
/* ===== 表头 ===== */
.table-header {
display: flex;
align-items: center;
padding: 24rpx 28rpx;
/* background: #ffffff; */
border-bottom: 1rpx solid #f0f0f0;
}
.th {
font-size: 26rpx;
color: #999;
font-weight: 500;
}
.th-event {
width: 240rpx;
flex-shrink: 0;
}
.th-project {
flex: 1;
text-align: center;
}
.th-rank {
width: 80rpx;
text-align: center;
flex-shrink: 0;
}
.th-points {
width: 80rpx;
text-align: right;
flex-shrink: 0;
}
/* ===== 记录列表 ===== */
.record-list {
background: #ffffff;
border-radius: 16rpx;
margin: 0 20rpx;
box-sizing: border-box;
width: 710rpx;
}
.record-row {
display: flex;
align-items: center;
padding: 24rpx 28rpx;
border-bottom: 1rpx solid #f5f5f5;
}
.td {
font-size: 26rpx;
color: #333;
}
.td-event {
width: 240rpx;
flex-shrink: 0;
display: flex;
flex-direction: column;
}
.event-name {
font-size: 26rpx;
color: #1a1a1a;
font-weight: 500;
display: -webkit-box;
-webkit-box-orient: vertical;
-webkit-line-clamp: 2;
overflow: hidden;
line-height: 1.4;
}
.event-time {
font-size: 22rpx;
color: #bbb;
margin-top: 6rpx;
}
.td-project {
flex: 1;
text-align: center;
font-size: 24rpx;
color: #666;
padding: 0 8rpx;
}
.td-rank {
width: 80rpx;
text-align: center;
flex-shrink: 0;
}
.td-points {
width: 80rpx;
text-align: right;
flex-shrink: 0;
font-weight: 700;
}
.td-points.positive {
color: #00B56D;
}
.td-points.negative {
color: #e74c3c;
}
/* ===== 空状态 ===== */
.empty {
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
padding-top: 240rpx;
padding-bottom: 240rpx;
}
.empty-icon {
display: flex;
flex-direction: column;
align-items: center;
/* margin-bottom: 32rpx; */
}
.empty-doc {
width: 160rpx;
height: 180rpx;
background: #f5f5f5;
border-radius: 12rpx;
display: flex;
flex-direction: column;
align-items: center;
padding-top: 30rpx;
gap: 14rpx;
position: relative;
}
.empty-doc-top {
width: 80rpx;
height: 20rpx;
background: #e8e8e8;
border-radius: 4rpx;
}
.empty-doc-line {
width: 100rpx;
height: 10rpx;
background: #e8e8e8;
border-radius: 2rpx;
}
.empty-doc-line.short {
width: 70rpx;
}
.empty-doc-shadow {
width: 140rpx;
height: 16rpx;
background: radial-gradient(ellipse, rgba(0,0,0,0.08) 0%, transparent 70%);
margin-top: 8rpx;
}
.empty-text {
font-size: 28rpx;
color: #c0c4cc;
}
/* ===== 加载提示 ===== */
.loading-tip {
text-align: center;
padding: 24rpx 0;
color: #ccc;
font-size: 24rpx;
}