美化了样式2.0

This commit is contained in:
2025-08-15 11:14:42 +08:00
parent 1b4d3e310b
commit 23ab2798d8
23 changed files with 1555 additions and 1106 deletions

View File

@ -203,3 +203,108 @@
.ml-11 { margin-left: 20rpx; }
.mt-15 { margin-top: 28rpx; }
.ml-1 { margin-left: 2rpx; }
/* 入口小字 */
.notice-entry {
margin-right: 16rpx;
font-size: 24rpx;
color: #8a8a8a;
text-decoration: underline;
}
/* 弹窗遮罩 */
.modal-mask {
position: fixed;
z-index: 999; /* 确保在你的 .footer 与其他遮罩之上 */
inset: 0;
background: rgba(0,0,0,0.45);
display: flex;
justify-content: center;
align-items: center;
padding: 40rpx;
}
/* 弹窗容器 */
.modal {
width: 86%;
max-width: 640rpx;
max-height: 70vh;
background: #fff;
border-radius: 24rpx;
overflow: hidden;
box-shadow: 0 12rpx 40rpx rgba(0,0,0,0.18);
}
/* 标题 */
.modal-title {
padding: 28rpx 32rpx 12rpx;
font-size: 32rpx;
font-weight: 600;
color: #222;
}
/* 内容区滚动 */
.modal-body {
max-height: 48vh;
padding: 8rpx 32rpx 24rpx;
}
/* 富文本默认样式优化 */
.modal-body rich-text {
display: block;
font-size: 26rpx;
line-height: 1.75;
color: #444;
}
.modal-body h3 { font-size: 28rpx; margin: 18rpx 0 8rpx; color: #222; }
.modal-body p { margin: 10rpx 0; }
.modal-body ul, .modal-body ol { margin: 10rpx 0 10rpx 28rpx; }
.modal-body a { color: #1677ff; word-break: break-all; }
/* 底部按钮区 */
.modal-actions {
padding: 20rpx 24rpx 28rpx;
}
.btn-primary {
width: 100%;
height: 84rpx;
line-height: 84rpx;
text-align: center;
border-radius: 16rpx;
background: #ff8a00; /* 你的主色调(可换成项目变量) */
color: #fff;
font-size: 30rpx;
font-weight: 600;
}
.btn-primary:active {
opacity: 0.85;
}
.notice-icon {
position: absolute;
top: 20rpx;
right: 20rpx;
z-index: 10;
display: flex;
align-items: center;
background: rgba(255, 255, 255, 0.92);
border-radius: 30rpx;
box-shadow: 0 4rpx 12rpx rgba(0, 0, 0, 0.15);
padding: 6rpx 14rpx;
}
.notice-icon-img {
width: 34rpx;
height: 34rpx;
margin-right: 8rpx;
}
.notice-icon-text {
font-size: 24rpx;
color: #333;
}
.notice-icon:active {
opacity: 0.85;
}