cucumber-dressing 0.1.0

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.
@@ -0,0 +1,621 @@
1
+ export default `
2
+ /* DRESSING - Modern CSS Styles */
3
+
4
+ * {
5
+ margin: 0;
6
+ padding: 0;
7
+ box-sizing: border-box;
8
+ }
9
+
10
+ :root {
11
+ --color-primary: #2563eb;
12
+ --color-success: #10b981;
13
+ --color-danger: #ef4444;
14
+ --color-warning: #f59e0b;
15
+ --color-info: #3b82f6;
16
+ --color-muted: #6b7280;
17
+ --color-bg: #ffffff;
18
+ --color-bg-secondary: #f9fafb;
19
+ --color-border: #e5e7eb;
20
+ --color-text: #111827;
21
+ --color-text-secondary: #6b7280;
22
+ --shadow-sm: 0 1px 2px 0 rgb(0 0 0 / 0.05);
23
+ --shadow-md: 0 4px 6px -1px rgb(0 0 0 / 0.1);
24
+ --shadow-lg: 0 10px 15px -3px rgb(0 0 0 / 0.1);
25
+ }
26
+
27
+ body.theme-dark {
28
+ --color-bg: #1f2937;
29
+ --color-bg-secondary: #111827;
30
+ --color-border: #374151;
31
+ --color-text: #f9fafb;
32
+ --color-text-secondary: #9ca3af;
33
+ }
34
+
35
+ body {
36
+ font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Roboto', 'Oxygen', 'Ubuntu', 'Cantarell', 'Fira Sans', 'Droid Sans', 'Helvetica Neue', sans-serif;
37
+ line-height: 1.6;
38
+ color: var(--color-text);
39
+ background-color: var(--color-bg);
40
+ }
41
+
42
+ .container {
43
+ max-width: 1400px;
44
+ margin: 0 auto;
45
+ padding: 2rem;
46
+ }
47
+
48
+ /* Header */
49
+ .report-header {
50
+ display: flex;
51
+ justify-content: space-between;
52
+ align-items: center;
53
+ padding: 2rem;
54
+ background: linear-gradient(135deg, var(--color-primary) 0%, #1e40af 100%);
55
+ color: white;
56
+ border-radius: 12px;
57
+ margin-bottom: 2rem;
58
+ box-shadow: var(--shadow-lg);
59
+ }
60
+
61
+ .brand h1 {
62
+ font-size: 2.5rem;
63
+ font-weight: 700;
64
+ margin-bottom: 0.5rem;
65
+ }
66
+
67
+ .brand .tagline {
68
+ font-size: 0.875rem;
69
+ opacity: 0.9;
70
+ }
71
+
72
+ .report-info {
73
+ text-align: right;
74
+ }
75
+
76
+ .report-info h2 {
77
+ font-size: 1.5rem;
78
+ margin-bottom: 0.5rem;
79
+ }
80
+
81
+ .generated-time {
82
+ opacity: 0.9;
83
+ font-size: 0.875rem;
84
+ }
85
+
86
+ /* Statistics */
87
+ .statistics-overview {
88
+ margin-bottom: 2rem;
89
+ }
90
+
91
+ .statistics-overview h3 {
92
+ font-size: 1.5rem;
93
+ margin-bottom: 1.5rem;
94
+ color: var(--color-text);
95
+ }
96
+
97
+ .stats-grid {
98
+ display: grid;
99
+ grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
100
+ gap: 1rem;
101
+ }
102
+
103
+ .stat-card {
104
+ background: var(--color-bg-secondary);
105
+ padding: 1.5rem;
106
+ border-radius: 8px;
107
+ border: 1px solid var(--color-border);
108
+ text-align: center;
109
+ transition: transform 0.2s, box-shadow 0.2s;
110
+ }
111
+
112
+ .stat-card:hover {
113
+ transform: translateY(-2px);
114
+ box-shadow: var(--shadow-md);
115
+ }
116
+
117
+ .stat-value {
118
+ font-size: 2rem;
119
+ font-weight: 700;
120
+ margin-bottom: 0.5rem;
121
+ }
122
+
123
+ .stat-label {
124
+ font-size: 0.875rem;
125
+ color: var(--color-text-secondary);
126
+ text-transform: uppercase;
127
+ letter-spacing: 0.05em;
128
+ }
129
+
130
+ .stat-card.status-passed .stat-value {
131
+ color: var(--color-success);
132
+ }
133
+
134
+ .stat-card.status-failed .stat-value {
135
+ color: var(--color-danger);
136
+ }
137
+
138
+ .stat-card.status-skipped .stat-value {
139
+ color: var(--color-warning);
140
+ }
141
+
142
+ /* Charts */
143
+ .charts-section {
144
+ margin-bottom: 2rem;
145
+ }
146
+
147
+ .charts-grid {
148
+ display: grid;
149
+ grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
150
+ gap: 2rem;
151
+ }
152
+
153
+ .chart-container {
154
+ background: var(--color-bg-secondary);
155
+ padding: 1.5rem;
156
+ border-radius: 8px;
157
+ border: 1px solid var(--color-border);
158
+ }
159
+
160
+ .chart-container h4 {
161
+ margin-bottom: 1rem;
162
+ text-align: center;
163
+ }
164
+
165
+ /* Metadata */
166
+ .metadata-section, .custom-data-section {
167
+ margin-bottom: 2rem;
168
+ padding: 1.5rem;
169
+ background: var(--color-bg-secondary);
170
+ border-radius: 8px;
171
+ border: 1px solid var(--color-border);
172
+ }
173
+
174
+ .metadata-section h3, .custom-data-section h3 {
175
+ font-size: 1.25rem;
176
+ margin-bottom: 1rem;
177
+ }
178
+
179
+ .metadata-grid, .custom-data-grid {
180
+ display: grid;
181
+ grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
182
+ gap: 1rem;
183
+ }
184
+
185
+ .metadata-item, .custom-data-item {
186
+ display: flex;
187
+ justify-content: space-between;
188
+ padding: 0.5rem;
189
+ }
190
+
191
+ .metadata-label, .custom-data-label {
192
+ font-weight: 600;
193
+ color: var(--color-text-secondary);
194
+ }
195
+
196
+ /* Features */
197
+ .features-section {
198
+ margin-bottom: 2rem;
199
+ }
200
+
201
+ .features-section h3 {
202
+ font-size: 1.5rem;
203
+ margin-bottom: 1.5rem;
204
+ }
205
+
206
+ .features-filter {
207
+ margin-bottom: 1.5rem;
208
+ }
209
+
210
+ #searchFilter {
211
+ width: 100%;
212
+ padding: 0.75rem 1rem;
213
+ border: 1px solid var(--color-border);
214
+ border-radius: 8px;
215
+ font-size: 1rem;
216
+ margin-bottom: 1rem;
217
+ background: var(--color-bg);
218
+ color: var(--color-text);
219
+ }
220
+
221
+ #searchFilter:focus {
222
+ outline: none;
223
+ border-color: var(--color-primary);
224
+ box-shadow: 0 0 0 3px rgba(37, 99, 235, 0.1);
225
+ }
226
+
227
+ .status-filters {
228
+ display: flex;
229
+ gap: 0.5rem;
230
+ flex-wrap: wrap;
231
+ }
232
+
233
+ .filter-btn {
234
+ padding: 0.5rem 1rem;
235
+ border: 1px solid var(--color-border);
236
+ background: var(--color-bg);
237
+ color: var(--color-text);
238
+ border-radius: 6px;
239
+ cursor: pointer;
240
+ transition: all 0.2s;
241
+ }
242
+
243
+ .filter-btn:hover {
244
+ background: var(--color-bg-secondary);
245
+ }
246
+
247
+ .filter-btn.active {
248
+ background: var(--color-primary);
249
+ color: white;
250
+ border-color: var(--color-primary);
251
+ }
252
+
253
+ /* Feature Cards */
254
+ .features-list {
255
+ display: flex;
256
+ flex-direction: column;
257
+ gap: 1rem;
258
+ }
259
+
260
+ .feature-card {
261
+ background: var(--color-bg-secondary);
262
+ border: 2px solid var(--color-border);
263
+ border-radius: 8px;
264
+ overflow: hidden;
265
+ transition: all 0.3s;
266
+ }
267
+
268
+ .feature-card.status-passed {
269
+ border-left: 4px solid var(--color-success);
270
+ }
271
+
272
+ .feature-card.status-failed {
273
+ border-left: 4px solid var(--color-danger);
274
+ }
275
+
276
+ .feature-card.status-skipped {
277
+ border-left: 4px solid var(--color-warning);
278
+ }
279
+
280
+ .feature-header {
281
+ padding: 1.5rem;
282
+ cursor: pointer;
283
+ display: flex;
284
+ justify-content: space-between;
285
+ align-items: center;
286
+ background: var(--color-bg);
287
+ transition: background 0.2s;
288
+ }
289
+
290
+ .feature-header:hover {
291
+ background: var(--color-bg-secondary);
292
+ }
293
+
294
+ .feature-title {
295
+ display: flex;
296
+ align-items: center;
297
+ gap: 1rem;
298
+ flex: 1;
299
+ }
300
+
301
+ .feature-title h4 {
302
+ font-size: 1.25rem;
303
+ color: var(--color-text);
304
+ }
305
+
306
+ .feature-stats {
307
+ display: flex;
308
+ gap: 1rem;
309
+ align-items: center;
310
+ }
311
+
312
+ .stat {
313
+ font-size: 0.875rem;
314
+ color: var(--color-text-secondary);
315
+ }
316
+
317
+ .toggle-icon {
318
+ transition: transform 0.3s;
319
+ }
320
+
321
+ .feature-card.expanded .toggle-icon {
322
+ transform: rotate(180deg);
323
+ }
324
+
325
+ /* Status Icons */
326
+ .status-icon {
327
+ display: inline-flex;
328
+ align-items: center;
329
+ justify-content: center;
330
+ width: 24px;
331
+ height: 24px;
332
+ border-radius: 50%;
333
+ font-weight: bold;
334
+ font-size: 0.875rem;
335
+ }
336
+
337
+ .feature-card.status-passed > .feature-header .status-icon,
338
+ .scenario-card.status-passed > .scenario-header .status-icon,
339
+ .step-item.status-passed .status-icon {
340
+ background: var(--color-success);
341
+ color: white;
342
+ }
343
+
344
+ .feature-card.status-failed > .feature-header .status-icon,
345
+ .scenario-card.status-failed > .scenario-header .status-icon,
346
+ .step-item.status-failed .status-icon {
347
+ background: var(--color-danger);
348
+ color: white;
349
+ }
350
+
351
+ .feature-card.status-skipped > .feature-header .status-icon,
352
+ .scenario-card.status-skipped > .scenario-header .status-icon,
353
+ .step-item.status-skipped .status-icon {
354
+ background: var(--color-warning);
355
+ color: white;
356
+ }
357
+
358
+ .feature-card.status-pending > .feature-header .status-icon,
359
+ .scenario-card.status-pending > .scenario-header .status-icon,
360
+ .step-item.status-pending .status-icon {
361
+ background: var(--color-info);
362
+ color: white;
363
+ }
364
+
365
+ .feature-card.status-undefined > .feature-header .status-icon,
366
+ .scenario-card.status-undefined > .scenario-header .status-icon,
367
+ .step-item.status-undefined .status-icon {
368
+ background: var(--color-muted);
369
+ color: white;
370
+ }
371
+
372
+ /* Tags */
373
+ .tags {
374
+ display: flex;
375
+ gap: 0.5rem;
376
+ flex-wrap: wrap;
377
+ }
378
+
379
+ .tag {
380
+ display: inline-block;
381
+ padding: 0.25rem 0.75rem;
382
+ background: var(--color-primary);
383
+ color: white;
384
+ border-radius: 12px;
385
+ font-size: 0.75rem;
386
+ font-weight: 500;
387
+ }
388
+
389
+ /* Scenarios */
390
+ .scenarios-list {
391
+ padding: 1rem;
392
+ display: flex;
393
+ flex-direction: column;
394
+ gap: 1rem;
395
+ }
396
+
397
+ .scenario-card {
398
+ background: var(--color-bg);
399
+ border: 1px solid var(--color-border);
400
+ border-radius: 6px;
401
+ overflow: hidden;
402
+ }
403
+
404
+ .scenario-header {
405
+ padding: 1rem;
406
+ cursor: pointer;
407
+ display: flex;
408
+ justify-content: space-between;
409
+ align-items: center;
410
+ transition: background 0.2s;
411
+ }
412
+
413
+ .scenario-header:hover {
414
+ background: var(--color-bg-secondary);
415
+ }
416
+
417
+ .scenario-title {
418
+ display: flex;
419
+ align-items: center;
420
+ gap: 0.75rem;
421
+ flex: 1;
422
+ }
423
+
424
+ .scenario-title h5 {
425
+ font-size: 1.1rem;
426
+ }
427
+
428
+ /* Steps */
429
+ .steps-list {
430
+ padding: 0.5rem;
431
+ display: flex;
432
+ flex-direction: column;
433
+ gap: 0.5rem;
434
+ }
435
+
436
+ .step-item {
437
+ padding: 0.75rem;
438
+ background: var(--color-bg-secondary);
439
+ border-radius: 4px;
440
+ border-left: 3px solid var(--color-border);
441
+ }
442
+
443
+ .step-item.status-passed {
444
+ border-left-color: var(--color-success);
445
+ }
446
+
447
+ .step-item.status-failed {
448
+ border-left-color: var(--color-danger);
449
+ }
450
+
451
+ .step-item.status-skipped {
452
+ border-left-color: var(--color-warning);
453
+ }
454
+
455
+ .step-header {
456
+ display: flex;
457
+ align-items: center;
458
+ gap: 0.5rem;
459
+ }
460
+
461
+ .step-keyword {
462
+ font-weight: 600;
463
+ color: var(--color-primary);
464
+ }
465
+
466
+ .step-name {
467
+ flex: 1;
468
+ color: var(--color-text);
469
+ }
470
+
471
+ .step-duration {
472
+ font-size: 0.875rem;
473
+ color: var(--color-text-secondary);
474
+ }
475
+
476
+ .step-error {
477
+ margin-top: 0.75rem;
478
+ padding: 1rem;
479
+ background: rgba(239, 68, 68, 0.1);
480
+ border-left: 3px solid var(--color-danger);
481
+ border-radius: 4px;
482
+ }
483
+
484
+ .step-error pre {
485
+ color: var(--color-danger);
486
+ font-family: 'Courier New', monospace;
487
+ font-size: 0.875rem;
488
+ white-space: pre-wrap;
489
+ word-wrap: break-word;
490
+ }
491
+
492
+ .step-doc-string, .step-data-table {
493
+ margin-top: 0.75rem;
494
+ }
495
+
496
+ .step-doc-string pre {
497
+ padding: 1rem;
498
+ background: var(--color-bg);
499
+ border: 1px solid var(--color-border);
500
+ border-radius: 4px;
501
+ font-family: 'Courier New', monospace;
502
+ font-size: 0.875rem;
503
+ overflow-x: auto;
504
+ }
505
+
506
+ .step-data-table table {
507
+ width: 100%;
508
+ border-collapse: collapse;
509
+ border: 1px solid var(--color-border);
510
+ border-radius: 4px;
511
+ overflow: hidden;
512
+ }
513
+
514
+ .step-data-table td {
515
+ padding: 0.5rem;
516
+ border: 1px solid var(--color-border);
517
+ }
518
+
519
+ .step-data-table tr:first-child {
520
+ background: var(--color-bg);
521
+ font-weight: 600;
522
+ }
523
+
524
+ .step-screenshot {
525
+ margin-top: 0.75rem;
526
+ }
527
+
528
+ .step-screenshot img {
529
+ max-width: 100%;
530
+ border-radius: 4px;
531
+ border: 1px solid var(--color-border);
532
+ }
533
+
534
+ /* Footer */
535
+ .report-footer {
536
+ margin-top: 3rem;
537
+ padding: 2rem;
538
+ text-align: center;
539
+ color: var(--color-text-secondary);
540
+ border-top: 1px solid var(--color-border);
541
+ }
542
+
543
+ .report-footer strong {
544
+ color: var(--color-primary);
545
+ }
546
+
547
+ .version {
548
+ margin-top: 0.5rem;
549
+ font-size: 0.875rem;
550
+ }
551
+
552
+ /* Descriptions */
553
+ .feature-description, .scenario-description {
554
+ padding: 1rem 1.5rem;
555
+ color: var(--color-text-secondary);
556
+ line-height: 1.8;
557
+ }
558
+
559
+ .feature-content, .scenario-content {
560
+ animation: slideDown 0.3s ease-out;
561
+ }
562
+
563
+ @keyframes slideDown {
564
+ from {
565
+ opacity: 0;
566
+ transform: translateY(-10px);
567
+ }
568
+ to {
569
+ opacity: 1;
570
+ transform: translateY(0);
571
+ }
572
+ }
573
+
574
+ /* Responsive */
575
+ @media (max-width: 768px) {
576
+ .container {
577
+ padding: 1rem;
578
+ }
579
+
580
+ .report-header {
581
+ flex-direction: column;
582
+ text-align: center;
583
+ }
584
+
585
+ .report-info {
586
+ text-align: center;
587
+ margin-top: 1rem;
588
+ }
589
+
590
+ .stats-grid {
591
+ grid-template-columns: repeat(2, 1fr);
592
+ }
593
+
594
+ .charts-grid {
595
+ grid-template-columns: 1fr;
596
+ }
597
+
598
+ .feature-header, .scenario-header {
599
+ flex-direction: column;
600
+ align-items: flex-start;
601
+ gap: 0.75rem;
602
+ }
603
+
604
+ .feature-stats, .scenario-stats {
605
+ width: 100%;
606
+ justify-content: space-between;
607
+ }
608
+ }
609
+
610
+ /* Print Styles */
611
+ @media print {
612
+ .features-filter, .filter-btn {
613
+ display: none;
614
+ }
615
+
616
+ .feature-content, .scenario-content {
617
+ display: block !important;
618
+ }
619
+ }
620
+ `;
621
+ //# sourceMappingURL=styles.css.template.js.map