pg_reports 0.5.0 → 0.5.1
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.
- checksums.yaml +4 -4
- data/CHANGELOG.md +26 -0
- data/README.md +41 -0
- data/app/controllers/pg_reports/dashboard_controller.rb +168 -30
- data/app/views/layouts/pg_reports/application.html.erb +133 -124
- data/app/views/pg_reports/dashboard/_show_modals.html.erb +1 -1
- data/app/views/pg_reports/dashboard/_show_scripts.html.erb +70 -6
- data/app/views/pg_reports/dashboard/index.html.erb +91 -30
- data/lib/pg_reports/configuration.rb +8 -0
- data/lib/pg_reports/modules/system.rb +7 -1
- data/lib/pg_reports/query_monitor.rb +23 -10
- data/lib/pg_reports/version.rb +1 -1
- metadata +2 -2
|
@@ -48,7 +48,7 @@
|
|
|
48
48
|
.container {
|
|
49
49
|
max-width: 1400px;
|
|
50
50
|
margin: 0 auto;
|
|
51
|
-
padding:
|
|
51
|
+
padding: 1.5rem;
|
|
52
52
|
}
|
|
53
53
|
|
|
54
54
|
/* Header */
|
|
@@ -56,30 +56,30 @@
|
|
|
56
56
|
display: flex;
|
|
57
57
|
align-items: center;
|
|
58
58
|
justify-content: space-between;
|
|
59
|
-
margin-bottom:
|
|
60
|
-
padding-bottom:
|
|
59
|
+
margin-bottom: 1.5rem;
|
|
60
|
+
padding-bottom: 1rem;
|
|
61
61
|
border-bottom: 1px solid var(--border-color);
|
|
62
62
|
}
|
|
63
63
|
|
|
64
64
|
.logo {
|
|
65
65
|
display: flex;
|
|
66
66
|
align-items: center;
|
|
67
|
-
gap:
|
|
67
|
+
gap: 0.75rem;
|
|
68
68
|
}
|
|
69
69
|
|
|
70
70
|
.logo-icon {
|
|
71
|
-
width:
|
|
72
|
-
height:
|
|
71
|
+
width: 44px;
|
|
72
|
+
height: 44px;
|
|
73
73
|
background: linear-gradient(135deg, var(--gradient-start), var(--gradient-end));
|
|
74
|
-
border-radius:
|
|
74
|
+
border-radius: 6px;
|
|
75
75
|
display: flex;
|
|
76
76
|
align-items: center;
|
|
77
77
|
justify-content: center;
|
|
78
|
-
font-size: 1.
|
|
78
|
+
font-size: 1.4rem;
|
|
79
79
|
}
|
|
80
80
|
|
|
81
81
|
.logo-text h1 {
|
|
82
|
-
font-size: 1.
|
|
82
|
+
font-size: 1.25rem;
|
|
83
83
|
font-weight: 700;
|
|
84
84
|
background: linear-gradient(135deg, var(--text-primary), var(--text-secondary));
|
|
85
85
|
-webkit-background-clip: text;
|
|
@@ -87,19 +87,19 @@
|
|
|
87
87
|
}
|
|
88
88
|
|
|
89
89
|
.logo-text span {
|
|
90
|
-
font-size: 0.
|
|
90
|
+
font-size: 0.75rem;
|
|
91
91
|
color: var(--text-muted);
|
|
92
92
|
}
|
|
93
93
|
|
|
94
94
|
.header-badge {
|
|
95
95
|
display: flex;
|
|
96
96
|
align-items: center;
|
|
97
|
-
gap: 0.
|
|
98
|
-
padding: 0.
|
|
97
|
+
gap: 0.4rem;
|
|
98
|
+
padding: 0.4rem 0.75rem;
|
|
99
99
|
background: var(--bg-tertiary);
|
|
100
100
|
border: 1px solid var(--border-color);
|
|
101
|
-
border-radius:
|
|
102
|
-
font-size: 0.
|
|
101
|
+
border-radius: 4px;
|
|
102
|
+
font-size: 0.75rem;
|
|
103
103
|
}
|
|
104
104
|
|
|
105
105
|
.badge-dot {
|
|
@@ -122,72 +122,72 @@
|
|
|
122
122
|
/* Categories Grid */
|
|
123
123
|
.categories-grid {
|
|
124
124
|
display: grid;
|
|
125
|
-
grid-template-columns: repeat(auto-fit, minmax(
|
|
126
|
-
gap:
|
|
127
|
-
margin-bottom:
|
|
125
|
+
grid-template-columns: repeat(auto-fit, minmax(320px, 1fr));
|
|
126
|
+
gap: 1rem;
|
|
127
|
+
margin-bottom: 1.5rem;
|
|
128
128
|
}
|
|
129
129
|
|
|
130
130
|
.category-card {
|
|
131
131
|
background: var(--bg-card);
|
|
132
132
|
border: 1px solid var(--border-color);
|
|
133
|
-
border-radius:
|
|
134
|
-
padding:
|
|
133
|
+
border-radius: 8px;
|
|
134
|
+
padding: 1rem;
|
|
135
135
|
transition: all 0.2s ease;
|
|
136
136
|
}
|
|
137
137
|
|
|
138
138
|
.category-card:hover {
|
|
139
139
|
border-color: var(--accent-purple);
|
|
140
|
-
transform: translateY(-
|
|
140
|
+
transform: translateY(-1px);
|
|
141
141
|
}
|
|
142
142
|
|
|
143
143
|
.category-header {
|
|
144
144
|
display: flex;
|
|
145
145
|
align-items: center;
|
|
146
|
-
gap:
|
|
147
|
-
margin-bottom:
|
|
146
|
+
gap: 0.75rem;
|
|
147
|
+
margin-bottom: 0.875rem;
|
|
148
148
|
}
|
|
149
149
|
|
|
150
150
|
.category-icon {
|
|
151
|
-
width:
|
|
152
|
-
height:
|
|
153
|
-
border-radius:
|
|
151
|
+
width: 36px;
|
|
152
|
+
height: 36px;
|
|
153
|
+
border-radius: 6px;
|
|
154
154
|
display: flex;
|
|
155
155
|
align-items: center;
|
|
156
156
|
justify-content: center;
|
|
157
|
-
font-size: 1.
|
|
157
|
+
font-size: 1.125rem;
|
|
158
158
|
}
|
|
159
159
|
|
|
160
160
|
.category-title {
|
|
161
|
-
font-size:
|
|
161
|
+
font-size: 1rem;
|
|
162
162
|
font-weight: 600;
|
|
163
163
|
}
|
|
164
164
|
|
|
165
165
|
.category-count {
|
|
166
166
|
margin-left: auto;
|
|
167
|
-
padding: 0.
|
|
167
|
+
padding: 0.2rem 0.6rem;
|
|
168
168
|
background: var(--bg-tertiary);
|
|
169
|
-
border-radius:
|
|
170
|
-
font-size: 0.
|
|
169
|
+
border-radius: 4px;
|
|
170
|
+
font-size: 0.7rem;
|
|
171
171
|
color: var(--text-muted);
|
|
172
172
|
}
|
|
173
173
|
|
|
174
174
|
.reports-list {
|
|
175
175
|
display: flex;
|
|
176
176
|
flex-direction: column;
|
|
177
|
-
gap: 0.
|
|
177
|
+
gap: 0.4rem;
|
|
178
178
|
}
|
|
179
179
|
|
|
180
180
|
.report-link {
|
|
181
181
|
display: flex;
|
|
182
182
|
align-items: center;
|
|
183
183
|
justify-content: space-between;
|
|
184
|
-
padding: 0.
|
|
184
|
+
padding: 0.6rem 0.875rem;
|
|
185
185
|
background: var(--bg-tertiary);
|
|
186
186
|
border: 1px solid transparent;
|
|
187
|
-
border-radius:
|
|
187
|
+
border-radius: 6px;
|
|
188
188
|
color: var(--text-secondary);
|
|
189
189
|
text-decoration: none;
|
|
190
|
-
font-size: 0.
|
|
190
|
+
font-size: 0.85rem;
|
|
191
191
|
transition: all 0.15s ease;
|
|
192
192
|
}
|
|
193
193
|
|
|
@@ -212,14 +212,14 @@
|
|
|
212
212
|
.report-page {
|
|
213
213
|
display: flex;
|
|
214
214
|
flex-direction: column;
|
|
215
|
-
gap:
|
|
215
|
+
gap: 1rem;
|
|
216
216
|
}
|
|
217
217
|
|
|
218
218
|
.breadcrumb {
|
|
219
219
|
display: flex;
|
|
220
220
|
align-items: center;
|
|
221
|
-
gap: 0.
|
|
222
|
-
font-size: 0.
|
|
221
|
+
gap: 0.4rem;
|
|
222
|
+
font-size: 0.75rem;
|
|
223
223
|
color: var(--text-muted);
|
|
224
224
|
}
|
|
225
225
|
|
|
@@ -237,35 +237,36 @@
|
|
|
237
237
|
display: flex;
|
|
238
238
|
align-items: flex-start;
|
|
239
239
|
justify-content: space-between;
|
|
240
|
-
gap:
|
|
240
|
+
gap: 1.5rem;
|
|
241
241
|
}
|
|
242
242
|
|
|
243
243
|
.report-info h2 {
|
|
244
|
-
font-size: 1.
|
|
244
|
+
font-size: 1.4rem;
|
|
245
245
|
font-weight: 700;
|
|
246
|
-
margin-bottom: 0.
|
|
246
|
+
margin-bottom: 0.4rem;
|
|
247
247
|
}
|
|
248
248
|
|
|
249
249
|
.report-info p {
|
|
250
250
|
color: var(--text-muted);
|
|
251
|
+
font-size: 0.875rem;
|
|
251
252
|
}
|
|
252
253
|
|
|
253
254
|
.report-actions {
|
|
254
255
|
display: flex;
|
|
255
|
-
gap: 0.
|
|
256
|
+
gap: 0.5rem;
|
|
256
257
|
}
|
|
257
258
|
|
|
258
259
|
.btn {
|
|
259
260
|
display: inline-flex;
|
|
260
261
|
align-items: center;
|
|
261
262
|
justify-content: center;
|
|
262
|
-
gap: 0.
|
|
263
|
-
height:
|
|
264
|
-
padding: 0
|
|
263
|
+
gap: 0.4rem;
|
|
264
|
+
height: 36px;
|
|
265
|
+
padding: 0 1rem;
|
|
265
266
|
border: 1px solid transparent;
|
|
266
|
-
border-radius:
|
|
267
|
+
border-radius: 6px;
|
|
267
268
|
font-family: inherit;
|
|
268
|
-
font-size: 0.
|
|
269
|
+
font-size: 0.8rem;
|
|
269
270
|
font-weight: 500;
|
|
270
271
|
cursor: pointer;
|
|
271
272
|
transition: all 0.15s ease;
|
|
@@ -315,7 +316,7 @@
|
|
|
315
316
|
.results-container {
|
|
316
317
|
background: var(--bg-card);
|
|
317
318
|
border: 1px solid var(--border-color);
|
|
318
|
-
border-radius:
|
|
319
|
+
border-radius: 8px;
|
|
319
320
|
overflow: hidden;
|
|
320
321
|
}
|
|
321
322
|
|
|
@@ -323,20 +324,21 @@
|
|
|
323
324
|
display: flex;
|
|
324
325
|
align-items: center;
|
|
325
326
|
justify-content: space-between;
|
|
326
|
-
padding:
|
|
327
|
+
padding: 0.875rem 1rem;
|
|
327
328
|
border-bottom: 1px solid var(--border-color);
|
|
328
329
|
}
|
|
329
330
|
|
|
330
331
|
.results-title {
|
|
331
332
|
font-weight: 600;
|
|
333
|
+
font-size: 0.9rem;
|
|
332
334
|
}
|
|
333
335
|
|
|
334
336
|
.results-meta {
|
|
335
337
|
display: flex;
|
|
336
338
|
align-items: center;
|
|
337
|
-
gap:
|
|
339
|
+
gap: 1rem;
|
|
338
340
|
color: var(--text-muted);
|
|
339
|
-
font-size: 0.
|
|
341
|
+
font-size: 0.75rem;
|
|
340
342
|
}
|
|
341
343
|
|
|
342
344
|
.results-table-wrapper {
|
|
@@ -347,24 +349,24 @@
|
|
|
347
349
|
width: 100%;
|
|
348
350
|
border-collapse: collapse;
|
|
349
351
|
font-family: <%= PgReports.config.load_external_fonts ? "'JetBrains Mono', " : "" %>SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
|
|
350
|
-
font-size: 0.
|
|
352
|
+
font-size: 0.75rem;
|
|
351
353
|
}
|
|
352
354
|
|
|
353
355
|
.results-table th {
|
|
354
|
-
padding:
|
|
356
|
+
padding: 0.7rem 0.875rem;
|
|
355
357
|
text-align: left;
|
|
356
358
|
background: var(--bg-tertiary);
|
|
357
359
|
color: var(--text-muted);
|
|
358
360
|
font-weight: 500;
|
|
359
361
|
text-transform: uppercase;
|
|
360
|
-
font-size: 0.
|
|
362
|
+
font-size: 0.65rem;
|
|
361
363
|
letter-spacing: 0.05em;
|
|
362
364
|
white-space: nowrap;
|
|
363
365
|
border-bottom: 1px solid var(--border-color);
|
|
364
366
|
}
|
|
365
367
|
|
|
366
368
|
.results-table td {
|
|
367
|
-
padding: 0.
|
|
369
|
+
padding: 0.65rem 0.875rem;
|
|
368
370
|
border-bottom: 1px solid var(--border-color);
|
|
369
371
|
color: var(--text-secondary);
|
|
370
372
|
max-width: 400px;
|
|
@@ -384,26 +386,27 @@
|
|
|
384
386
|
}
|
|
385
387
|
|
|
386
388
|
.empty-state {
|
|
387
|
-
padding:
|
|
389
|
+
padding: 3rem 1.5rem;
|
|
388
390
|
text-align: center;
|
|
389
391
|
color: var(--text-muted);
|
|
392
|
+
font-size: 0.85rem;
|
|
390
393
|
}
|
|
391
394
|
|
|
392
395
|
.empty-state-icon {
|
|
393
|
-
font-size:
|
|
394
|
-
margin-bottom:
|
|
396
|
+
font-size: 2.5rem;
|
|
397
|
+
margin-bottom: 0.75rem;
|
|
395
398
|
}
|
|
396
399
|
|
|
397
400
|
.loading {
|
|
398
401
|
display: flex;
|
|
399
402
|
align-items: center;
|
|
400
403
|
justify-content: center;
|
|
401
|
-
padding:
|
|
404
|
+
padding: 3rem 1.5rem;
|
|
402
405
|
}
|
|
403
406
|
|
|
404
407
|
.spinner {
|
|
405
|
-
width:
|
|
406
|
-
height:
|
|
408
|
+
width: 36px;
|
|
409
|
+
height: 36px;
|
|
407
410
|
border: 3px solid var(--border-color);
|
|
408
411
|
border-top-color: var(--accent-purple);
|
|
409
412
|
border-radius: 50%;
|
|
@@ -416,24 +419,26 @@
|
|
|
416
419
|
|
|
417
420
|
/* Error state */
|
|
418
421
|
.error-message {
|
|
419
|
-
padding:
|
|
422
|
+
padding: 0.875rem;
|
|
420
423
|
background: rgba(244, 63, 94, 0.1);
|
|
421
424
|
border: 1px solid rgba(244, 63, 94, 0.3);
|
|
422
|
-
border-radius:
|
|
425
|
+
border-radius: 6px;
|
|
423
426
|
color: var(--accent-rose);
|
|
427
|
+
font-size: 0.85rem;
|
|
424
428
|
}
|
|
425
429
|
|
|
426
430
|
/* Toast notification */
|
|
427
431
|
.toast {
|
|
428
432
|
position: fixed;
|
|
429
|
-
bottom:
|
|
430
|
-
right:
|
|
431
|
-
padding: 1rem
|
|
433
|
+
bottom: 1.5rem;
|
|
434
|
+
right: 1.5rem;
|
|
435
|
+
padding: 0.75rem 1rem;
|
|
432
436
|
background: var(--bg-card);
|
|
433
437
|
border: 1px solid var(--border-color);
|
|
434
|
-
border-radius:
|
|
438
|
+
border-radius: 6px;
|
|
435
439
|
color: var(--text-primary);
|
|
436
|
-
|
|
440
|
+
font-size: 0.85rem;
|
|
441
|
+
box-shadow: 0 8px 32px rgba(0, 0, 0, 0.3);
|
|
437
442
|
transform: translateY(100px);
|
|
438
443
|
opacity: 0;
|
|
439
444
|
transition: all 0.3s ease;
|
|
@@ -468,10 +473,10 @@
|
|
|
468
473
|
.modal-content {
|
|
469
474
|
background: var(--bg-card);
|
|
470
475
|
border: 1px solid var(--border-color);
|
|
471
|
-
border-radius:
|
|
472
|
-
max-width:
|
|
476
|
+
border-radius: 8px;
|
|
477
|
+
max-width: 900px;
|
|
473
478
|
width: 90%;
|
|
474
|
-
max-height:
|
|
479
|
+
max-height: 90vh;
|
|
475
480
|
overflow: auto;
|
|
476
481
|
}
|
|
477
482
|
|
|
@@ -484,23 +489,23 @@
|
|
|
484
489
|
display: flex;
|
|
485
490
|
align-items: center;
|
|
486
491
|
justify-content: space-between;
|
|
487
|
-
padding:
|
|
492
|
+
padding: 0.875rem 1rem;
|
|
488
493
|
border-bottom: 1px solid var(--border-color);
|
|
489
494
|
}
|
|
490
495
|
|
|
491
496
|
.modal-header h3 {
|
|
492
|
-
font-size:
|
|
497
|
+
font-size: 1rem;
|
|
493
498
|
font-weight: 600;
|
|
494
499
|
}
|
|
495
500
|
|
|
496
501
|
.modal-close {
|
|
497
|
-
width:
|
|
498
|
-
height:
|
|
502
|
+
width: 28px;
|
|
503
|
+
height: 28px;
|
|
499
504
|
background: var(--bg-tertiary);
|
|
500
505
|
border: 1px solid var(--border-color);
|
|
501
|
-
border-radius:
|
|
506
|
+
border-radius: 4px;
|
|
502
507
|
color: var(--text-muted);
|
|
503
|
-
font-size: 1.
|
|
508
|
+
font-size: 1.125rem;
|
|
504
509
|
cursor: pointer;
|
|
505
510
|
transition: all 0.15s;
|
|
506
511
|
}
|
|
@@ -512,18 +517,18 @@
|
|
|
512
517
|
}
|
|
513
518
|
|
|
514
519
|
.modal-body {
|
|
515
|
-
padding:
|
|
520
|
+
padding: 1rem;
|
|
516
521
|
}
|
|
517
522
|
|
|
518
523
|
/* Responsive */
|
|
519
524
|
@media (max-width: 768px) {
|
|
520
525
|
.container {
|
|
521
|
-
padding:
|
|
526
|
+
padding: 0.875rem;
|
|
522
527
|
}
|
|
523
528
|
|
|
524
529
|
.header {
|
|
525
530
|
flex-direction: column;
|
|
526
|
-
gap:
|
|
531
|
+
gap: 0.75rem;
|
|
527
532
|
align-items: flex-start;
|
|
528
533
|
}
|
|
529
534
|
|
|
@@ -545,33 +550,33 @@
|
|
|
545
550
|
Query Monitoring Panel
|
|
546
551
|
============================================ */
|
|
547
552
|
.query-monitoring-panel {
|
|
548
|
-
margin-bottom:
|
|
553
|
+
margin-bottom: 1.5rem;
|
|
549
554
|
background: var(--bg-card);
|
|
550
555
|
border: 1px solid var(--border-color);
|
|
551
|
-
border-radius:
|
|
552
|
-
padding:
|
|
556
|
+
border-radius: 8px;
|
|
557
|
+
padding: 0.875rem 1rem;
|
|
553
558
|
}
|
|
554
559
|
|
|
555
560
|
.query-monitoring-header {
|
|
556
561
|
display: flex;
|
|
557
562
|
align-items: center;
|
|
558
563
|
justify-content: space-between;
|
|
559
|
-
margin-bottom:
|
|
560
|
-
padding-bottom:
|
|
564
|
+
margin-bottom: 0.875rem;
|
|
565
|
+
padding-bottom: 0.75rem;
|
|
561
566
|
border-bottom: 1px solid var(--border-color);
|
|
562
567
|
}
|
|
563
568
|
|
|
564
569
|
.query-monitoring-title {
|
|
565
570
|
display: flex;
|
|
566
571
|
align-items: center;
|
|
567
|
-
gap: 0.
|
|
572
|
+
gap: 0.6rem;
|
|
568
573
|
font-weight: 600;
|
|
569
|
-
font-size:
|
|
574
|
+
font-size: 0.9rem;
|
|
570
575
|
}
|
|
571
576
|
|
|
572
577
|
.monitoring-indicator {
|
|
573
|
-
width:
|
|
574
|
-
height:
|
|
578
|
+
width: 7px;
|
|
579
|
+
height: 7px;
|
|
575
580
|
border-radius: 50%;
|
|
576
581
|
background: var(--text-muted);
|
|
577
582
|
}
|
|
@@ -591,12 +596,12 @@
|
|
|
591
596
|
}
|
|
592
597
|
|
|
593
598
|
.session-badge {
|
|
594
|
-
margin-left: 0.
|
|
595
|
-
padding: 0.
|
|
599
|
+
margin-left: 0.4rem;
|
|
600
|
+
padding: 0.3rem 0.6rem;
|
|
596
601
|
background: var(--bg-tertiary);
|
|
597
602
|
border: 1px solid var(--border-color);
|
|
598
|
-
border-radius:
|
|
599
|
-
font-size: 0.
|
|
603
|
+
border-radius: 4px;
|
|
604
|
+
font-size: 0.65rem;
|
|
600
605
|
font-weight: 500;
|
|
601
606
|
color: var(--text-secondary);
|
|
602
607
|
}
|
|
@@ -609,11 +614,11 @@
|
|
|
609
614
|
.query-monitoring-controls {
|
|
610
615
|
display: flex;
|
|
611
616
|
align-items: center;
|
|
612
|
-
gap:
|
|
617
|
+
gap: 0.75rem;
|
|
613
618
|
}
|
|
614
619
|
|
|
615
620
|
.query-monitoring-count {
|
|
616
|
-
font-size: 0.
|
|
621
|
+
font-size: 0.75rem;
|
|
617
622
|
color: var(--text-secondary);
|
|
618
623
|
}
|
|
619
624
|
|
|
@@ -624,26 +629,26 @@
|
|
|
624
629
|
|
|
625
630
|
/* Query Feed */
|
|
626
631
|
.query-feed {
|
|
627
|
-
max-height:
|
|
632
|
+
max-height: 500px;
|
|
628
633
|
overflow-y: auto;
|
|
629
634
|
background: var(--bg-tertiary);
|
|
630
635
|
border: 1px solid var(--border-color);
|
|
631
|
-
border-radius:
|
|
632
|
-
padding:
|
|
636
|
+
border-radius: 6px;
|
|
637
|
+
padding: 0.75rem;
|
|
633
638
|
}
|
|
634
639
|
|
|
635
640
|
.query-feed::-webkit-scrollbar {
|
|
636
|
-
width:
|
|
641
|
+
width: 6px;
|
|
637
642
|
}
|
|
638
643
|
|
|
639
644
|
.query-feed::-webkit-scrollbar-track {
|
|
640
645
|
background: var(--bg-secondary);
|
|
641
|
-
border-radius:
|
|
646
|
+
border-radius: 3px;
|
|
642
647
|
}
|
|
643
648
|
|
|
644
649
|
.query-feed::-webkit-scrollbar-thumb {
|
|
645
650
|
background: var(--border-color);
|
|
646
|
-
border-radius:
|
|
651
|
+
border-radius: 3px;
|
|
647
652
|
}
|
|
648
653
|
|
|
649
654
|
.query-feed::-webkit-scrollbar-thumb:hover {
|
|
@@ -652,18 +657,18 @@
|
|
|
652
657
|
|
|
653
658
|
.query-feed-empty {
|
|
654
659
|
text-align: center;
|
|
655
|
-
padding:
|
|
660
|
+
padding: 2rem;
|
|
656
661
|
color: var(--text-muted);
|
|
657
|
-
font-size: 0.
|
|
662
|
+
font-size: 0.8rem;
|
|
658
663
|
}
|
|
659
664
|
|
|
660
665
|
.query-item {
|
|
661
666
|
background: var(--bg-card);
|
|
662
667
|
border: 1px solid var(--border-color);
|
|
663
|
-
border-radius:
|
|
664
|
-
padding: 0.
|
|
665
|
-
margin-bottom: 0.
|
|
666
|
-
font-size: 0.
|
|
668
|
+
border-radius: 6px;
|
|
669
|
+
padding: 0.5rem;
|
|
670
|
+
margin-bottom: 0.5rem;
|
|
671
|
+
font-size: 0.8rem;
|
|
667
672
|
transition: all 0.15s;
|
|
668
673
|
}
|
|
669
674
|
|
|
@@ -679,23 +684,25 @@
|
|
|
679
684
|
display: flex;
|
|
680
685
|
justify-content: space-between;
|
|
681
686
|
align-items: center;
|
|
682
|
-
margin-bottom: 0.
|
|
687
|
+
margin-bottom: 0.3rem;
|
|
683
688
|
}
|
|
684
689
|
|
|
685
690
|
.query-meta {
|
|
686
691
|
display: flex;
|
|
687
|
-
gap:
|
|
688
|
-
font-size: 0.
|
|
692
|
+
gap: 0.6rem;
|
|
693
|
+
font-size: 0.7rem;
|
|
689
694
|
color: var(--text-muted);
|
|
690
695
|
}
|
|
691
696
|
|
|
692
697
|
.query-timestamp {
|
|
693
698
|
color: var(--text-secondary);
|
|
699
|
+
font-size: 0.7rem;
|
|
694
700
|
}
|
|
695
701
|
|
|
696
702
|
.query-duration {
|
|
697
703
|
color: var(--accent-amber);
|
|
698
704
|
font-weight: 600;
|
|
705
|
+
font-size: 0.7rem;
|
|
699
706
|
}
|
|
700
707
|
|
|
701
708
|
.query-duration.fast {
|
|
@@ -709,6 +716,7 @@
|
|
|
709
716
|
.query-name {
|
|
710
717
|
color: var(--text-secondary);
|
|
711
718
|
font-style: italic;
|
|
719
|
+
font-size: 0.7rem;
|
|
712
720
|
}
|
|
713
721
|
|
|
714
722
|
.query-expand-btn {
|
|
@@ -716,10 +724,10 @@
|
|
|
716
724
|
border: none;
|
|
717
725
|
color: var(--text-muted);
|
|
718
726
|
cursor: pointer;
|
|
719
|
-
padding: 0.
|
|
727
|
+
padding: 0.15rem 0.35rem;
|
|
720
728
|
font-size: 0.7rem;
|
|
721
729
|
transition: all 0.15s;
|
|
722
|
-
border-radius:
|
|
730
|
+
border-radius: 3px;
|
|
723
731
|
}
|
|
724
732
|
|
|
725
733
|
.query-expand-btn:hover {
|
|
@@ -728,16 +736,16 @@
|
|
|
728
736
|
}
|
|
729
737
|
|
|
730
738
|
.query-sql-wrapper {
|
|
731
|
-
margin-bottom: 0.
|
|
739
|
+
margin-bottom: 0.3rem;
|
|
732
740
|
}
|
|
733
741
|
|
|
734
742
|
.query-sql {
|
|
735
|
-
padding: 0.
|
|
743
|
+
padding: 0.5rem;
|
|
736
744
|
background: var(--bg-primary);
|
|
737
745
|
border: 1px solid var(--border-color);
|
|
738
|
-
border-radius:
|
|
746
|
+
border-radius: 4px;
|
|
739
747
|
font-family: <%= PgReports.config.load_external_fonts ? "'JetBrains Mono', " : "" %>monospace;
|
|
740
|
-
font-size: 0.
|
|
748
|
+
font-size: 0.7rem;
|
|
741
749
|
color: var(--accent-blue);
|
|
742
750
|
word-wrap: break-word;
|
|
743
751
|
overflow-x: auto;
|
|
@@ -776,23 +784,23 @@
|
|
|
776
784
|
|
|
777
785
|
.download-menu {
|
|
778
786
|
position: absolute;
|
|
779
|
-
top: calc(100% + 0.
|
|
787
|
+
top: calc(100% + 0.4rem);
|
|
780
788
|
right: 0;
|
|
781
|
-
min-width:
|
|
789
|
+
min-width: 160px;
|
|
782
790
|
background: var(--bg-card);
|
|
783
791
|
border: 1px solid var(--border-color);
|
|
784
|
-
border-radius:
|
|
785
|
-
box-shadow: 0
|
|
792
|
+
border-radius: 6px;
|
|
793
|
+
box-shadow: 0 8px 32px rgba(0, 0, 0, 0.3);
|
|
786
794
|
z-index: 100;
|
|
787
795
|
overflow: hidden;
|
|
788
796
|
}
|
|
789
797
|
|
|
790
798
|
.download-menu a {
|
|
791
799
|
display: block;
|
|
792
|
-
padding: 0.
|
|
800
|
+
padding: 0.6rem 0.875rem;
|
|
793
801
|
color: var(--text-secondary);
|
|
794
802
|
text-decoration: none;
|
|
795
|
-
font-size: 0.
|
|
803
|
+
font-size: 0.75rem;
|
|
796
804
|
transition: all 0.15s ease;
|
|
797
805
|
border-bottom: 1px solid var(--border-color);
|
|
798
806
|
}
|
|
@@ -807,9 +815,10 @@
|
|
|
807
815
|
}
|
|
808
816
|
|
|
809
817
|
.btn-small {
|
|
810
|
-
height:
|
|
811
|
-
padding: 0
|
|
812
|
-
font-size: 0.
|
|
818
|
+
height: 30px;
|
|
819
|
+
padding: 0 0.875rem;
|
|
820
|
+
font-size: 0.75rem;
|
|
821
|
+
line-height: 1;
|
|
813
822
|
}
|
|
814
823
|
|
|
815
824
|
.btn-danger {
|
|
@@ -71,7 +71,7 @@
|
|
|
71
71
|
<div id="explain-params-inputs"></div>
|
|
72
72
|
</div>
|
|
73
73
|
<div class="explain-actions">
|
|
74
|
-
<button class="btn btn-
|
|
74
|
+
<button class="btn btn-secondary" onclick="executeExplainAnalyze()" id="btn-explain">
|
|
75
75
|
📊 EXPLAIN ANALYZE
|
|
76
76
|
</button>
|
|
77
77
|
<button class="btn btn-secondary" onclick="executeQuery()" id="btn-execute">
|