blob: 656114ace53c806c0d05bd89c755efa3c231dd89 [file] [log] [blame]
Krishyaf1d0ea82025-05-03 17:01:58 +08001/* 资源海报 */
2.resource-poster {
3 width: 80px;
4 height: 100px;
5 object-fit: cover;
6 border-radius: 4px;
7}
8
9/* 文本信息 */
10.resource-info div,
11.slide div {
12 margin-bottom: 6px;
13}
14
15/* 激励徽章 */
16.incentive-badge {
17 background-color: #17a2b8;
18 color: #d13c3c;
19 padding: 2px 8px;
20 margin-right: 6px;
21 font-size: 12px;
22 border-radius: 12px;
23}
24
25/* 空状态 */
26.empty-state {
27 color: #fff;
28 font-size: 16px;
29 text-align: center;
30}
Krishya6bf199c2025-06-06 21:14:23 +080031
32.dialog-overlay {
33 position: fixed;
34 top: 0;
35 left: 0;
36 right: 0;
37 bottom: 0;
38 background: rgba(0,0,0,0.4);
39 display: flex;
40 justify-content: center;
41 align-items: center;
42 z-index: 999;
43}
44.dialog {
45 background: #fff;
46 padding: 20px;
47 border-radius: 6px;
Krishyadbfadaa2025-06-09 20:33:15 +080048 width: 80%;
Krishya6bf199c2025-06-06 21:14:23 +080049 max-width: 90%;
50 box-shadow: 0 0 10px rgba(0,0,0,0.25);
51}
52.form-item {
53 margin-bottom: 12px;
54 display: flex;
55 flex-direction: column;
56}
57.form-item label {
58 font-weight: bold;
59 margin-bottom: 4px;
60}
61.form-item input, .form-item textarea {
62 padding: 6px 8px;
63 font-size: 14px;
64 border: 1px solid #ccc;
65 border-radius: 4px;
66}
67.dialog-buttons {
68 display: flex;
69 justify-content: flex-end;
70 gap: 10px;
71}
72.dialog-buttons button {
73 padding: 6px 16px;
74 cursor: pointer;
75}
76
Krishyadbfadaa2025-06-09 20:33:15 +080077
78/* 冷门资源模态框样式 */
79.cold-dialog-overlay {
80 position: fixed;
81 top: 0;
82 left: 0;
83 width: 100%;
84 height: 100%;
85 background-color: rgba(255, 228, 230, 0.3); /* 清透粉半透明背景 */
86 display: flex;
87 justify-content: center;
88 align-items: center;
89 z-index: 1000;
90}
91
92.cold-dialog {
93 background-color: #F8F8F0; /* 米白色背景 */
94 padding: 20px;
95 border-radius: 10px;
96 box-shadow: 0 4px 12px rgba(255, 192, 203, 0.3); /* 粉调阴影 */
97 max-width: 800px;
98 width: 100%;
99}
100
101.cold-dialog-title {
102 color: #FF6B81; /* 亮粉标题 */
103 text-align: center;
104 margin-bottom: 15px;
105}
106
107.close-btn {
108 position: absolute;
109 top: 10px;
110 right: 15px;
111 font-size: 20px;
112 background: none;
113 border: none;
114 cursor: pointer;
115 color: #FF4E50; /* 深粉关闭按钮 */
116}
117
118.cold-table-container {
119 overflow-x: auto; /* 长表格横向滚动 */
120}
121
122.cold-torrent-table {
123 width: 100%;
124 border-collapse: collapse;
125 margin-top: 15px;
126 background-color: white; /* 表格白色背景 */
127}
128
129.cold-torrent-table th,
130.cold-torrent-table td {
131 padding: 12px 15px;
132 text-align: left;
133 border-bottom: 1px solid #FFE4E6; /* 清透粉分隔线 */
134}
135
136.cold-torrent-table th {
137 background-color: #FFF0F5; /* 淡粉表头背景 */
138 color: #FF69B4; /* 粉紫表头文字 */
139 font-weight: 500;
140}
141
142.cold-torrent-table tr:hover {
143 background-color: #FFF5EB; /* 米白悬停效果 */
144}
145
146.empty-state {
147 text-align: center;
148 padding: 20px;
149 color: #666;
150}
151
152/* 适配小屏幕 */
153@media (max-width: 600px) {
154 .cold-dialog {
155 margin: 20px;
156 max-width: calc(100% - 40px);
157 }
158}
159
160.cold-btn.small {
161 font-size: 0.9em;
162 padding: 5px 10px;
163 margin-top: 5px;
164}
165
166.torrent-table-container {
167 margin-top: 10px;
168 max-height: 300px;
169 overflow-y: auto;
170}
171
172.torrent-selection-table {
173 width: 100%;
174 border-collapse: collapse;
175}
176
177.torrent-selection-table th,
178.torrent-selection-table td {
179 padding: 8px 12px;
180 border: 1px solid #ddd;
181 text-align: left;
182}
183
184.torrent-selection-table th {
185 background-color: #f5f5f5;
186}
187
188.detail-dialog-overlay {
189 position: fixed;
190 top: 0;
191 left: 0;
192 width: 100%;
193 height: 100%;
194 background-color: rgba(0, 0, 0, 0.5);
195 display: flex;
196 justify-content: center;
197 align-items: center;
198 z-index: 100;
199}
200
201.detail-dialog {
202 background-color: white;
203 padding: 20px;
204 border-radius: 8px;
205 width: 90%;
206 max-width: 600px;
207 max-height: 80vh;
208 overflow-y: auto;
209}
210
211.detail-content {
212 margin-top: 20px;
213}
214
215.detail-item {
216 margin-bottom: 15px;
217 display: flex;
218}
219
220.detail-label {
221 font-weight: bold;
222 min-width: 120px;
223}
224
225.detail-value {
226 flex: 1;
227}
228
229.torrent-list {
230 display: flex;
231 flex-wrap: wrap;
232 gap: 8px;
233}
234
235.torrent-link {
236 background: none;
237 border: none;
238 color: #0066cc;
239 text-decoration: underline;
240 cursor: pointer;
241 padding: 0;
242 font-size: inherit;
243}
244
245.torrent-link:hover,
246.torrent-link:focus {
247 text-decoration: none;
248 outline: none;
249 color: #004499;
250}
251
252.torrent-detail-overlay {
253 position: fixed;
254 top: 0;
255 left: 0;
256 width: 100%;
257 height: 100%;
258 background-color: rgba(0, 0, 0, 0.5);
259 display: flex;
260 justify-content: center;
261 align-items: center;
262 z-index: 200; /* 确保在促销详情对话框之上 */
263}
264
265.torrent-detail-dialog {
266 background-color: white;
267 padding: 20px;
268 border-radius: 8px;
269 width: 90%;
270 max-width: 700px;
271 max-height: 85vh;
272 overflow-y: auto;
273}
274
275.torrent-detail-content {
276 margin-top: 20px;
277}
278
279.torrent-detail-item {
280 margin-bottom: 15px;
281 display: flex;
282}
283
284.torrent-detail-label {
285 font-weight: bold;
286 min-width: 120px;
287}
288
289.torrent-detail-value {
290 flex: 1;
291}
292
293.description {
294 white-space: pre-wrap;
295}
296
297.torrent-cover-container {
298 display: flex;
299 justify-content: center;
300 margin-bottom: 20px;
301}
302
303.torrent-cover {
304 max-width: 100%;
305 max-height: 300px;
306 object-fit: contain;
307 border-radius: 4px;
308 box-shadow: 0 2px 8px rgba(0,0,0,0.15);
309}
310
311.status-badge {
312 padding: 2px 8px;
313 border-radius: 4px;
314 font-size: 0.9em;
315 color: white;
316}
317
318.status-badge.hot {
319 background-color: #e53935;
320}
321
322.status-badge.cold {
323 background-color: #1e88e5;
324}
325
326.status-badge.normal {
327 background-color: #757575;
328}
329
330.download-link {
331 color: #0066cc;
332 text-decoration: none;
333 display: inline-flex;
334 align-items: center;
335}
336
337.download-link:hover {
338 text-decoration: underline;
339}