| | |
| | | padding-bottom: 120rpx; |
| | | } |
| | | |
| | | /* 加载状态 */ |
| | | /* Loading */ |
| | | .loading-container { |
| | | display: flex; |
| | | flex-direction: column; |
| | |
| | | 100% { transform: rotate(360deg); } |
| | | } |
| | | |
| | | /* 评审内容 */ |
| | | .review-content { |
| | | padding: 30rpx; |
| | | } |
| | | |
| | | /* 通用样式 */ |
| | | .section-title { |
| | | font-size: 32rpx; |
| | | font-weight: 600; |
| | |
| | | display: block; |
| | | } |
| | | |
| | | /* 作品信息 */ |
| | | .submission-info { |
| | | .submission-info, |
| | | .media-section, |
| | | .criteria-section, |
| | | .comment-section, |
| | | .existing-review { |
| | | background-color: #fff; |
| | | border-radius: 16rpx; |
| | | padding: 30rpx; |
| | |
| | | color: #155724; |
| | | } |
| | | |
| | | .submission-detail { |
| | | display: flex; |
| | | flex-direction: column; |
| | | gap: 20rpx; |
| | | } |
| | | |
| | | .submission-title { |
| | | font-size: 30rpx; |
| | | font-weight: 600; |
| | |
| | | display: flex; |
| | | align-items: center; |
| | | gap: 8rpx; |
| | | padding: 8rpx 16rpx; |
| | | background-color: #007aff; |
| | | padding: 10rpx 24rpx; |
| | | background: linear-gradient(135deg, #34c759 0%, #2ea043 100%); |
| | | color: #fff; |
| | | border-radius: 16rpx; |
| | | font-size: 22rpx; |
| | | } |
| | | |
| | | .contact-icon { |
| | | font-size: 20rpx; |
| | | border-radius: 24rpx; |
| | | font-size: 24rpx; |
| | | box-shadow: 0 6rpx 16rpx rgba(46, 160, 67, 0.25); |
| | | } |
| | | |
| | | .participant-detail { |
| | |
| | | } |
| | | |
| | | .participant-avatar { |
| | | width: 80rpx; |
| | | height: 80rpx; |
| | | border-radius: 40rpx; |
| | | width: 96rpx; |
| | | height: 96rpx; |
| | | border-radius: 48rpx; |
| | | background-color: #f0f0f0; |
| | | } |
| | | |
| | | .participant-text { |
| | | flex: 1; |
| | | display: flex; |
| | | flex-direction: column; |
| | | gap: 8rpx; |
| | |
| | | |
| | | .participant-name { |
| | | font-size: 28rpx; |
| | | font-weight: 500; |
| | | font-weight: 600; |
| | | color: #333; |
| | | } |
| | | |
| | | .participant-school { |
| | | .participant-meta { |
| | | font-size: 24rpx; |
| | | color: #555; |
| | | line-height: 1.4; |
| | | } |
| | | |
| | | .participant-field { |
| | | font-size: 24rpx; |
| | | color: #666; |
| | | line-height: 1.4; |
| | | } |
| | | |
| | | .team-info { |
| | | margin-top: 20rpx; |
| | | padding-top: 20rpx; |
| | | border-top: 1rpx solid #f0f0f0; |
| | | background-color: #f8f9fa; |
| | | border-radius: 12rpx; |
| | | padding: 20rpx; |
| | | } |
| | | |
| | | .team-label { |
| | | font-size: 26rpx; |
| | | color: #666; |
| | | font-weight: 500; |
| | | margin-bottom: 16rpx; |
| | | display: block; |
| | | font-weight: 600; |
| | | color: #333; |
| | | } |
| | | |
| | | .team-members { |
| | | margin-top: 12rpx; |
| | | display: flex; |
| | | flex-wrap: wrap; |
| | | gap: 16rpx; |
| | | flex-direction: column; |
| | | gap: 8rpx; |
| | | } |
| | | |
| | | .team-member { |
| | | font-size: 24rpx; |
| | | color: #555; |
| | | } |
| | | |
| | | .media-list { |
| | | display: flex; |
| | | flex-direction: column; |
| | | align-items: center; |
| | | padding: 12rpx 20rpx; |
| | | background-color: #f8f9fa; |
| | | border-radius: 12rpx; |
| | | } |
| | | |
| | | .member-name { |
| | | font-size: 24rpx; |
| | | color: #333; |
| | | font-weight: 500; |
| | | } |
| | | |
| | | .member-role { |
| | | font-size: 20rpx; |
| | | color: #666; |
| | | margin-top: 4rpx; |
| | | } |
| | | |
| | | .submit-time { |
| | | font-size: 24rpx; |
| | | color: #999; |
| | | margin-top: 10rpx; |
| | | } |
| | | |
| | | /* 媒体展示 */ |
| | | .media-section { |
| | | background-color: #fff; |
| | | border-radius: 16rpx; |
| | | padding: 30rpx; |
| | | margin-bottom: 30rpx; |
| | | box-shadow: 0 2rpx 12rpx rgba(0, 0, 0, 0.1); |
| | | } |
| | | |
| | | .media-grid { |
| | | display: grid; |
| | | grid-template-columns: repeat(2, 1fr); |
| | | gap: 20rpx; |
| | | } |
| | | |
| | | .media-item { |
| | | position: relative; |
| | | border-radius: 12rpx; |
| | | overflow: hidden; |
| | | aspect-ratio: 1; |
| | | } |
| | | |
| | | .media-image, |
| | | .media-video { |
| | | width: 100%; |
| | | height: 100%; |
| | | object-fit: cover; |
| | | } |
| | | |
| | | .play-overlay { |
| | | position: absolute; |
| | | top: 50%; |
| | | left: 50%; |
| | | transform: translate(-50%, -50%); |
| | | width: 60rpx; |
| | | height: 60rpx; |
| | | background-color: rgba(0, 0, 0, 0.6); |
| | | border-radius: 50%; |
| | | display: flex; |
| | | align-items: center; |
| | | justify-content: center; |
| | | } |
| | | |
| | | .play-icon { |
| | | color: #fff; |
| | | font-size: 24rpx; |
| | | margin-left: 4rpx; |
| | | } |
| | | |
| | | /* 文件列表 */ |
| | | .files-section { |
| | | background-color: #fff; |
| | | border-radius: 16rpx; |
| | | padding: 30rpx; |
| | | margin-bottom: 30rpx; |
| | | box-shadow: 0 2rpx 12rpx rgba(0, 0, 0, 0.1); |
| | | } |
| | | |
| | | .file-list { |
| | | display: flex; |
| | | flex-direction: column; |
| | | gap: 20rpx; |
| | | } |
| | | |
| | | .file-item { |
| | | display: flex; |
| | | justify-content: space-between; |
| | | align-items: center; |
| | | gap: 24rpx; |
| | | padding: 20rpx; |
| | | background-color: #f8f9fa; |
| | | border-radius: 12rpx; |
| | | } |
| | | |
| | | .file-info { |
| | | .media-thumb-wrapper { |
| | | width: 120rpx; |
| | | height: 120rpx; |
| | | border-radius: 12rpx; |
| | | overflow: hidden; |
| | | position: relative; |
| | | background: #eaeaea; |
| | | } |
| | | |
| | | .media-thumb { |
| | | width: 100%; |
| | | height: 100%; |
| | | object-fit: cover; |
| | | } |
| | | |
| | | .media-icon { |
| | | width: 100%; |
| | | height: 100%; |
| | | display: flex; |
| | | align-items: center; |
| | | gap: 16rpx; |
| | | flex: 1; |
| | | min-width: 0; |
| | | } |
| | | |
| | | .file-icon { |
| | | justify-content: center; |
| | | font-size: 32rpx; |
| | | font-weight: 600; |
| | | color: #fff; |
| | | } |
| | | |
| | | .file-detail { |
| | | .media-icon.pdf { background: #e74c3c; } |
| | | .media-icon.doc { background: #1e88e5; } |
| | | .media-icon.file { background: #6c757d; } |
| | | |
| | | .media-play { |
| | | position: absolute; |
| | | bottom: 8rpx; |
| | | right: 8rpx; |
| | | width: 44rpx; |
| | | height: 44rpx; |
| | | background: rgba(0, 0, 0, 0.6); |
| | | border-radius: 50%; |
| | | color: #fff; |
| | | display: flex; |
| | | align-items: center; |
| | | justify-content: center; |
| | | font-size: 24rpx; |
| | | } |
| | | |
| | | .media-info { |
| | | flex: 1; |
| | | min-width: 0; |
| | | display: flex; |
| | | flex-direction: column; |
| | | gap: 4rpx; |
| | | gap: 6rpx; |
| | | } |
| | | |
| | | .file-name { |
| | | font-size: 26rpx; |
| | | .media-name { |
| | | font-size: 28rpx; |
| | | font-weight: 600; |
| | | color: #333; |
| | | font-weight: 500; |
| | | overflow: hidden; |
| | | text-overflow: ellipsis; |
| | | white-space: nowrap; |
| | | } |
| | | |
| | | .file-size { |
| | | .media-size { |
| | | font-size: 22rpx; |
| | | color: #666; |
| | | } |
| | | |
| | | .download-btn { |
| | | display: flex; |
| | | align-items: center; |
| | | gap: 8rpx; |
| | | padding: 12rpx 20rpx; |
| | | background-color: #007aff; |
| | | color: #fff; |
| | | border-radius: 20rpx; |
| | | font-size: 22rpx; |
| | | transition: all 0.3s ease; |
| | | } |
| | | |
| | | .download-btn.downloading { |
| | | background-color: #6c757d; |
| | | } |
| | | |
| | | .download-icon { |
| | | font-size: 20rpx; |
| | | } |
| | | |
| | | /* 评审标准 */ |
| | | .criteria-section { |
| | | background-color: #fff; |
| | | border-radius: 16rpx; |
| | | padding: 30rpx; |
| | | margin-bottom: 30rpx; |
| | | box-shadow: 0 2rpx 12rpx rgba(0, 0, 0, 0.1); |
| | | } |
| | | |
| | | .criteria-list { |
| | |
| | | display: block; |
| | | } |
| | | |
| | | .score-selector { |
| | | width: 100%; |
| | | } |
| | | |
| | | .score-picker { |
| | | .score-control { |
| | | display: flex; |
| | | justify-content: space-between; |
| | | align-items: center; |
| | | padding: 16rpx 20rpx; |
| | | background-color: #fff; |
| | | border: 2rpx solid #e0e0e0; |
| | | border-radius: 8rpx; |
| | | font-size: 26rpx; |
| | | gap: 20rpx; |
| | | margin-top: 16rpx; |
| | | } |
| | | |
| | | .score-picker.disabled { |
| | | background-color: #f5f5f5; |
| | | color: #999; |
| | | .score-btn { |
| | | width: 60rpx; |
| | | height: 60rpx; |
| | | border-radius: 12rpx; |
| | | background: #eef2ff; |
| | | color: #4c60ff; |
| | | display: flex; |
| | | align-items: center; |
| | | justify-content: center; |
| | | font-size: 36rpx; |
| | | font-weight: 600; |
| | | } |
| | | |
| | | .score-text { |
| | | color: #333; |
| | | } |
| | | |
| | | .picker-arrow { |
| | | color: #999; |
| | | font-size: 20rpx; |
| | | .score-input { |
| | | flex: 1; |
| | | height: 60rpx; |
| | | border: 2rpx solid #dcdfe6; |
| | | border-radius: 12rpx; |
| | | text-align: center; |
| | | font-size: 28rpx; |
| | | padding: 0 12rpx; |
| | | background: #fff; |
| | | } |
| | | |
| | | .total-score { |
| | |
| | | font-weight: 700; |
| | | } |
| | | |
| | | /* 评审意见 */ |
| | | .comment-section { |
| | | background-color: #fff; |
| | | border-radius: 16rpx; |
| | | padding: 30rpx; |
| | | margin-bottom: 30rpx; |
| | | box-shadow: 0 2rpx 12rpx rgba(0, 0, 0, 0.1); |
| | | } |
| | | |
| | | .comment-input { |
| | | width: 100%; |
| | | min-height: 200rpx; |
| | |
| | | box-sizing: border-box; |
| | | } |
| | | |
| | | .comment-input.disabled { |
| | | background-color: #f5f5f5; |
| | | color: #999; |
| | | } |
| | | |
| | | .comment-counter { |
| | | display: flex; |
| | | justify-content: flex-end; |
| | | text-align: right; |
| | | margin-top: 12rpx; |
| | | } |
| | | |
| | | .counter-text { |
| | | font-size: 22rpx; |
| | | color: #999; |
| | | } |
| | | |
| | | /* 已有评审记录 */ |
| | | .existing-review { |
| | | background-color: #fff; |
| | | border-radius: 16rpx; |
| | | padding: 30rpx; |
| | | margin-bottom: 30rpx; |
| | | box-shadow: 0 2rpx 12rpx rgba(0, 0, 0, 0.1); |
| | | background-color: #fff7e6; |
| | | border: 2rpx solid #ffb347; |
| | | } |
| | | |
| | | .review-info { |
| | |
| | | justify-content: space-between; |
| | | align-items: center; |
| | | margin-bottom: 20rpx; |
| | | padding: 20rpx; |
| | | background-color: #f8f9fa; |
| | | border-radius: 12rpx; |
| | | } |
| | | |
| | | .review-time, |
| | | .review-total { |
| | | font-size: 24rpx; |
| | | font-size: 26rpx; |
| | | color: #666; |
| | | } |
| | | |
| | | .other-reviews-btn { |
| | | display: flex; |
| | | align-items: center; |
| | | justify-content: center; |
| | | gap: 12rpx; |
| | | padding: 16rpx; |
| | | background-color: #007aff; |
| | | gap: 8rpx; |
| | | padding: 14rpx 24rpx; |
| | | border-radius: 24rpx; |
| | | background: linear-gradient(135deg, #4facfe 0%, #00f2fe 100%); |
| | | color: #fff; |
| | | border-radius: 12rpx; |
| | | font-size: 26rpx; |
| | | } |
| | | |
| | | .other-reviews-icon { |
| | | font-size: 24rpx; |
| | | } |
| | | |
| | | /* 底部操作栏 */ |
| | | .bottom-actions { |
| | | position: fixed; |
| | | bottom: 0; |
| | | left: 0; |
| | | right: 0; |
| | | display: flex; |
| | | gap: 20rpx; |
| | | bottom: 0; |
| | | padding: 20rpx 30rpx; |
| | | background-color: #fff; |
| | | border-top: 1rpx solid #e0e0e0; |
| | | box-shadow: 0 -2rpx 12rpx rgba(0, 0, 0, 0.1); |
| | | background-color: rgba(255, 255, 255, 0.95); |
| | | box-shadow: 0 -4rpx 16rpx rgba(0, 0, 0, 0.08); |
| | | display: flex; |
| | | justify-content: center; |
| | | align-items: stretch; |
| | | } |
| | | |
| | | .action-btn { |
| | | flex: 1; |
| | | display: flex; |
| | | align-items: center; |
| | | justify-content: center; |
| | |
| | | font-size: 28rpx; |
| | | font-weight: 500; |
| | | transition: all 0.3s ease; |
| | | } |
| | | |
| | | .draft-btn { |
| | | background-color: #6c757d; |
| | | color: #fff; |
| | | flex: 1; |
| | | width: 100%; |
| | | } |
| | | |
| | | .submit-btn { |
| | |
| | | font-size: 24rpx; |
| | | } |
| | | |
| | | /* 视频预览模态框 */ |
| | | .media-preview-modal { |
| | | position: fixed; |
| | | top: 0; |
| | | left: 0; |
| | | right: 0; |
| | | bottom: 0; |
| | | z-index: 1000; |
| | | } |
| | | |
| | | .modal-overlay { |
| | | position: absolute; |
| | | top: 0; |
| | | left: 0; |
| | | right: 0; |
| | | bottom: 0; |
| | | background-color: rgba(0, 0, 0, 0.8); |
| | | } |
| | | |
| | | .modal-content { |
| | | position: absolute; |
| | | top: 50%; |
| | | left: 50%; |
| | | transform: translate(-50%, -50%); |
| | | width: 90%; |
| | | max-width: 600rpx; |
| | | background-color: #fff; |
| | | border-radius: 16rpx; |
| | | overflow: hidden; |
| | | } |
| | | |
| | | .modal-header { |
| | | display: flex; |
| | | justify-content: space-between; |
| | | align-items: center; |
| | | padding: 20rpx 30rpx; |
| | | border-bottom: 1rpx solid #e0e0e0; |
| | | } |
| | | |
| | | .modal-title { |
| | | font-size: 30rpx; |
| | | font-weight: 600; |
| | | color: #333; |
| | | } |
| | | |
| | | .close-btn { |
| | | width: 60rpx; |
| | | height: 60rpx; |
| | | display: flex; |
| | | align-items: center; |
| | | justify-content: center; |
| | | border-radius: 50%; |
| | | background-color: #f8f9fa; |
| | | } |
| | | |
| | | .close-icon { |
| | | font-size: 24rpx; |
| | | color: #666; |
| | | } |
| | | |
| | | .modal-body { |
| | | padding: 30rpx; |
| | | } |
| | | |
| | | .preview-video { |
| | | width: 100%; |
| | | height: 400rpx; |
| | | border-radius: 12rpx; |
| | | } |
| | | |
| | | /* 响应式适配 */ |
| | | @media (max-width: 375px) { |
| | | .container { |
| | | padding-bottom: 100rpx; |
| | | } |
| | | |
| | | |
| | | .review-content { |
| | | padding: 20rpx; |
| | | } |
| | | |
| | | |
| | | .submission-info, |
| | | .media-section, |
| | | .files-section, |
| | | .criteria-section, |
| | | .comment-section, |
| | | .existing-review { |
| | | padding: 20rpx; |
| | | margin-bottom: 20rpx; |
| | | } |
| | | |
| | | .media-grid { |
| | | grid-template-columns: 1fr; |
| | | } |
| | | |
| | | |
| | | .bottom-actions { |
| | | padding: 15rpx 20rpx; |
| | | } |
| | | } |
| | | } |