whistle.mock-plugins 1.1.2 → 1.1.3-beta.2

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -1,419 +0,0 @@
1
- /* 全局样式重置 */
2
- * {
3
- margin: 0;
4
- padding: 0;
5
- box-sizing: border-box;
6
- }
7
-
8
- body {
9
- font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif;
10
- color: #333;
11
- background-color: #f5f5f5;
12
- line-height: 1.6;
13
- }
14
-
15
- /* 通用布局样式 */
16
- .app-layout {
17
- display: flex;
18
- flex-direction: column;
19
- min-height: 100vh;
20
- }
21
-
22
- .app-header {
23
- display: flex;
24
- align-items: center;
25
- justify-content: space-between;
26
- padding: 0 20px;
27
- height: 60px;
28
- background-color: #fff;
29
- box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
30
- z-index: 10;
31
- }
32
-
33
- .app-logo {
34
- display: flex;
35
- align-items: center;
36
- font-size: 1.5rem;
37
- font-weight: bold;
38
- color: #2c3e50;
39
- }
40
-
41
- .app-logo img {
42
- height: 32px;
43
- margin-right: 10px;
44
- }
45
-
46
- .search-bar {
47
- flex: 1;
48
- max-width: 400px;
49
- margin: 0 20px;
50
- position: relative;
51
- }
52
-
53
- .search-bar input {
54
- width: 100%;
55
- padding: 8px 12px;
56
- padding-left: 35px;
57
- border: 1px solid #ddd;
58
- border-radius: 4px;
59
- font-size: 14px;
60
- }
61
-
62
- .search-bar::before {
63
- content: '🔍';
64
- position: absolute;
65
- left: 10px;
66
- top: 8px;
67
- color: #aaa;
68
- }
69
-
70
- .action-buttons {
71
- display: flex;
72
- gap: 10px;
73
- }
74
-
75
- .action-btn {
76
- padding: 8px 12px;
77
- background-color: #3498db;
78
- color: white;
79
- border: none;
80
- border-radius: 4px;
81
- cursor: pointer;
82
- transition: background-color 0.2s;
83
- }
84
-
85
- .action-btn:hover {
86
- background-color: #2980b9;
87
- }
88
-
89
- .app-main {
90
- display: flex;
91
- flex: 1;
92
- }
93
-
94
- .app-sidebar {
95
- width: 240px;
96
- background-color: #fff;
97
- box-shadow: 2px 0 4px rgba(0, 0, 0, 0.05);
98
- padding: 20px 0;
99
- }
100
-
101
- .sidebar-header {
102
- padding: 0 20px 15px;
103
- border-bottom: 1px solid #eee;
104
- font-weight: bold;
105
- font-size: 1.1rem;
106
- }
107
-
108
- .feature-list {
109
- list-style: none;
110
- margin-top: 15px;
111
- }
112
-
113
- .feature-item {
114
- padding: 10px 20px;
115
- display: flex;
116
- justify-content: space-between;
117
- align-items: center;
118
- cursor: pointer;
119
- transition: background-color 0.2s;
120
- }
121
-
122
- .feature-item:hover {
123
- background-color: #f0f7ff;
124
- }
125
-
126
- .feature-item.active {
127
- background-color: #e6f7ff;
128
- border-right: 3px solid #1890ff;
129
- }
130
-
131
- .feature-name {
132
- flex: 1;
133
- }
134
-
135
- .feature-count {
136
- font-size: 12px;
137
- padding: 2px 8px;
138
- background-color: #eee;
139
- border-radius: 10px;
140
- }
141
-
142
- .add-feature-btn {
143
- margin: 20px;
144
- padding: 8px 12px;
145
- background-color: #f0f7ff;
146
- color: #1890ff;
147
- border: 1px dashed #1890ff;
148
- border-radius: 4px;
149
- width: calc(100% - 40px);
150
- text-align: center;
151
- cursor: pointer;
152
- transition: all 0.2s;
153
- }
154
-
155
- .add-feature-btn:hover {
156
- background-color: #e6f7ff;
157
- }
158
-
159
- .sidebar-footer {
160
- margin-top: auto;
161
- padding: 15px 20px;
162
- font-size: 12px;
163
- color: #999;
164
- border-top: 1px solid #eee;
165
- }
166
-
167
- .app-content {
168
- flex: 1;
169
- padding: 20px;
170
- overflow-y: auto;
171
- }
172
-
173
- .content-header {
174
- margin-bottom: 20px;
175
- display: flex;
176
- justify-content: space-between;
177
- align-items: center;
178
- }
179
-
180
- .content-title {
181
- font-size: 1.5rem;
182
- font-weight: bold;
183
- color: #2c3e50;
184
- }
185
-
186
- .content-controls {
187
- display: flex;
188
- gap: 10px;
189
- }
190
-
191
- .view-toggle, .sort-select {
192
- padding: 6px 12px;
193
- border: 1px solid #ddd;
194
- border-radius: 4px;
195
- background-color: #fff;
196
- cursor: pointer;
197
- }
198
-
199
- .view-toggle:hover,
200
- .sort-select:hover {
201
- border-color: #bbb;
202
- }
203
-
204
- /* 卡片和列表通用样式 */
205
- .features-container {
206
- margin-top: 20px;
207
- }
208
-
209
- .card-view {
210
- display: grid;
211
- grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
212
- gap: 20px;
213
- }
214
-
215
- .list-view .feature-row {
216
- display: flex;
217
- justify-content: space-between;
218
- align-items: center;
219
- padding: 15px;
220
- margin-bottom: 10px;
221
- background-color: #fff;
222
- border-radius: 4px;
223
- box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
224
- }
225
-
226
- .list-view .feature-info {
227
- flex: 1;
228
- }
229
-
230
- .list-view .feature-actions {
231
- display: flex;
232
- gap: 10px;
233
- }
234
-
235
- /* 表单和表格通用样式 */
236
- .config-form-container {
237
- background-color: #fff;
238
- border-radius: 4px;
239
- padding: 20px;
240
- margin-bottom: 20px;
241
- box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
242
- }
243
-
244
- .config-form {
245
- display: flex;
246
- flex-direction: column;
247
- gap: 15px;
248
- }
249
-
250
- .form-group {
251
- display: flex;
252
- flex-direction: column;
253
- gap: 5px;
254
- }
255
-
256
- .form-group label {
257
- font-weight: 500;
258
- }
259
-
260
- .form-group input {
261
- padding: 8px 12px;
262
- border: 1px solid #ddd;
263
- border-radius: 4px;
264
- font-size: 14px;
265
- }
266
-
267
- .form-actions {
268
- display: flex;
269
- justify-content: flex-end;
270
- margin-top: 10px;
271
- }
272
-
273
- .submit-btn {
274
- padding: 8px 16px;
275
- background-color: #3498db;
276
- color: white;
277
- border: none;
278
- border-radius: 4px;
279
- cursor: pointer;
280
- transition: background-color 0.2s;
281
- }
282
-
283
- .submit-btn:hover {
284
- background-color: #2980b9;
285
- }
286
-
287
- .config-list-container {
288
- background-color: #fff;
289
- border-radius: 4px;
290
- padding: 20px;
291
- box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
292
- }
293
-
294
- .config-table {
295
- width: 100%;
296
- border-collapse: collapse;
297
- margin-top: 10px;
298
- }
299
-
300
- .config-table th,
301
- .config-table td {
302
- padding: 12px;
303
- text-align: left;
304
- border-bottom: 1px solid #eee;
305
- }
306
-
307
- .config-table th {
308
- font-weight: 500;
309
- color: #666;
310
- }
311
-
312
- .config-table tr.inactive {
313
- color: #999;
314
- background-color: #f9f9f9;
315
- }
316
-
317
- .empty-list {
318
- padding: 20px;
319
- text-align: center;
320
- color: #999;
321
- }
322
-
323
- /* 开关按钮样式 */
324
- .toggle-switch {
325
- position: relative;
326
- display: inline-block;
327
- width: 40px;
328
- height: 20px;
329
- }
330
-
331
- .toggle-switch input {
332
- opacity: 0;
333
- width: 0;
334
- height: 0;
335
- }
336
-
337
- .toggle-slider {
338
- position: absolute;
339
- cursor: pointer;
340
- top: 0;
341
- left: 0;
342
- right: 0;
343
- bottom: 0;
344
- background-color: #ccc;
345
- transition: .4s;
346
- border-radius: 34px;
347
- }
348
-
349
- .toggle-slider:before {
350
- position: absolute;
351
- content: "";
352
- height: 16px;
353
- width: 16px;
354
- left: 2px;
355
- bottom: 2px;
356
- background-color: white;
357
- transition: .4s;
358
- border-radius: 50%;
359
- }
360
-
361
- input:checked + .toggle-slider {
362
- background-color: #2196F3;
363
- }
364
-
365
- input:checked + .toggle-slider:before {
366
- transform: translateX(20px);
367
- }
368
-
369
- /* 操作按钮样式 */
370
- .edit-btn, .delete-btn {
371
- padding: 5px 10px;
372
- border: none;
373
- border-radius: 4px;
374
- cursor: pointer;
375
- font-size: 13px;
376
- }
377
-
378
- .edit-btn {
379
- background-color: #f0f7ff;
380
- color: #1890ff;
381
- margin-right: 5px;
382
- }
383
-
384
- .delete-btn {
385
- background-color: #fff0f0;
386
- color: #ff4d4f;
387
- }
388
-
389
- .edit-btn:hover {
390
- background-color: #e6f7ff;
391
- }
392
-
393
- .delete-btn:hover {
394
- background-color: #ffd4d4;
395
- }
396
-
397
- /* 响应式布局 */
398
- @media (max-width: 768px) {
399
- .app-main {
400
- flex-direction: column;
401
- }
402
-
403
- .app-sidebar {
404
- width: 100%;
405
- order: 2;
406
- }
407
-
408
- .app-content {
409
- order: 1;
410
- }
411
-
412
- .card-view {
413
- grid-template-columns: 1fr;
414
- }
415
-
416
- .search-bar {
417
- display: none;
418
- }
419
- }
@@ -1,159 +0,0 @@
1
- .app-layout {
2
- display: flex;
3
- flex-direction: column;
4
- min-height: 100vh;
5
- }
6
-
7
- .app-header {
8
- display: flex;
9
- align-items: center;
10
- justify-content: space-between;
11
- padding: 0 20px;
12
- height: 60px;
13
- background-color: #fff;
14
- box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
15
- z-index: 10;
16
- }
17
-
18
- .app-logo {
19
- display: flex;
20
- align-items: center;
21
- font-size: 1.5rem;
22
- font-weight: bold;
23
- color: #2c3e50;
24
- }
25
-
26
- .app-logo img {
27
- height: 32px;
28
- margin-right: 10px;
29
- }
30
-
31
- .search-bar {
32
- flex: 1;
33
- max-width: 400px;
34
- margin: 0 20px;
35
- position: relative;
36
- }
37
-
38
- .search-bar input {
39
- width: 100%;
40
- padding: 8px 12px;
41
- padding-left: 35px;
42
- border: 1px solid #ddd;
43
- border-radius: 4px;
44
- font-size: 14px;
45
- }
46
-
47
- .search-bar::before {
48
- content: '🔍';
49
- position: absolute;
50
- left: 10px;
51
- top: 8px;
52
- color: #aaa;
53
- }
54
-
55
- .action-buttons {
56
- display: flex;
57
- gap: 10px;
58
- }
59
-
60
- .action-btn {
61
- padding: 8px 12px;
62
- background-color: #3498db;
63
- color: white;
64
- border: none;
65
- border-radius: 4px;
66
- cursor: pointer;
67
- transition: background-color 0.2s;
68
- }
69
-
70
- .action-btn:hover {
71
- background-color: #2980b9;
72
- }
73
-
74
- .app-main {
75
- display: flex;
76
- flex: 1;
77
- }
78
-
79
- .app-sidebar {
80
- width: 240px;
81
- background-color: #fff;
82
- box-shadow: 2px 0 4px rgba(0, 0, 0, 0.05);
83
- padding: 20px 0;
84
- display: flex;
85
- flex-direction: column;
86
- min-height: calc(100vh - 60px);
87
- }
88
-
89
- .sidebar-header {
90
- padding: 0 20px 15px;
91
- border-bottom: 1px solid #eee;
92
- font-weight: bold;
93
- font-size: 1.1rem;
94
- }
95
-
96
- .feature-list {
97
- list-style: none;
98
- margin-top: 15px;
99
- }
100
-
101
- .feature-item {
102
- padding: 10px 20px;
103
- display: flex;
104
- justify-content: space-between;
105
- align-items: center;
106
- cursor: pointer;
107
- transition: background-color 0.2s;
108
- }
109
-
110
- .feature-item:hover {
111
- background-color: #f0f7ff;
112
- }
113
-
114
- .feature-item.active {
115
- background-color: #e6f7ff;
116
- border-right: 3px solid #1890ff;
117
- }
118
-
119
- .feature-name {
120
- flex: 1;
121
- }
122
-
123
- .feature-count {
124
- font-size: 12px;
125
- padding: 2px 8px;
126
- background-color: #eee;
127
- border-radius: 10px;
128
- }
129
-
130
- .add-feature-btn {
131
- margin: 20px;
132
- padding: 8px 12px;
133
- background-color: #f0f7ff;
134
- color: #1890ff;
135
- border: 1px dashed #1890ff;
136
- border-radius: 4px;
137
- width: calc(100% - 40px);
138
- text-align: center;
139
- cursor: pointer;
140
- transition: all 0.2s;
141
- }
142
-
143
- .add-feature-btn:hover {
144
- background-color: #e6f7ff;
145
- }
146
-
147
- .sidebar-footer {
148
- margin-top: auto;
149
- padding: 15px 20px;
150
- font-size: 12px;
151
- color: #999;
152
- border-top: 1px solid #eee;
153
- }
154
-
155
- .app-content {
156
- flex: 1;
157
- padding: 20px;
158
- overflow-y: auto;
159
- }