2026-09-09 22:05:00 +08:00
|
|
|
.page {
|
|
|
|
|
min-height: 100vh;
|
2026-09-14 06:49:49 +08:00
|
|
|
background: #f4f5fa;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
.messages-hero {
|
|
|
|
|
padding: env(safe-area-inset-top) 24rpx 34rpx;
|
|
|
|
|
border-radius: 0 0 36rpx 36rpx;
|
|
|
|
|
background: linear-gradient(160deg, var(--mini-night-start), var(--mini-night-end));
|
|
|
|
|
box-shadow: var(--mini-shadow);
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
.messages-nav {
|
|
|
|
|
position: relative;
|
|
|
|
|
display: flex;
|
|
|
|
|
align-items: center;
|
|
|
|
|
justify-content: center;
|
|
|
|
|
height: 88rpx;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
.messages-title {
|
|
|
|
|
color: #fff;
|
|
|
|
|
font-size: 31rpx;
|
|
|
|
|
font-weight: 700;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
.messages-search {
|
|
|
|
|
position: absolute;
|
|
|
|
|
right: 14rpx;
|
|
|
|
|
width: 34rpx;
|
|
|
|
|
height: 34rpx;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
.message-shortcuts {
|
|
|
|
|
display: grid;
|
|
|
|
|
grid-template-columns: repeat(4, 1fr);
|
|
|
|
|
padding: 22rpx 8rpx 4rpx;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
.message-shortcut {
|
|
|
|
|
display: flex;
|
|
|
|
|
flex-direction: column;
|
|
|
|
|
align-items: center;
|
|
|
|
|
color: rgba(255, 255, 255, .88);
|
|
|
|
|
font-size: 20rpx;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
.shortcut-icon {
|
|
|
|
|
display: flex;
|
|
|
|
|
align-items: center;
|
|
|
|
|
justify-content: center;
|
|
|
|
|
width: 72rpx;
|
|
|
|
|
height: 72rpx;
|
|
|
|
|
margin-bottom: 12rpx;
|
|
|
|
|
border: 1rpx solid rgba(255, 255, 255, .2);
|
|
|
|
|
border-radius: 26rpx;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
.shortcut-icon image {
|
|
|
|
|
width: 45rpx;
|
|
|
|
|
height: 45rpx;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
.shortcut-icon--blue { background: rgba(79, 139, 255, .28); }
|
|
|
|
|
.shortcut-icon--pink { background: rgba(255, 92, 130, .28); }
|
|
|
|
|
.shortcut-icon--purple { background: rgba(154, 107, 255, .28); }
|
|
|
|
|
.shortcut-icon--coral { background: rgba(240, 106, 100, .28); }
|
|
|
|
|
|
|
|
|
|
.messages-content {
|
|
|
|
|
padding: 16rpx 24rpx 40rpx;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
.conversation-list {
|
|
|
|
|
overflow: hidden;
|
|
|
|
|
margin-top: 8rpx;
|
|
|
|
|
border-radius: 28rpx;
|
|
|
|
|
background: #fff;
|
|
|
|
|
box-shadow: 0 10rpx 32rpx rgba(34, 35, 91, .08);
|
2026-09-09 22:05:00 +08:00
|
|
|
}
|
