dbviewer 0.3.16 → 0.4.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/README.md +2 -0
- data/app/views/layouts/dbviewer/application.html.erb +742 -83
- data/lib/dbviewer/version.rb +1 -1
- metadata +2 -2
checksums.yaml
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
---
|
|
2
2
|
SHA256:
|
|
3
|
-
metadata.gz:
|
|
4
|
-
data.tar.gz:
|
|
3
|
+
metadata.gz: 6bf35f21728dd04ca42715af60f89f48b1bfdb4e7111b00f75e801a33bc17c47
|
|
4
|
+
data.tar.gz: 2d54d185da3255486a7f5b92ad44430916ae8af7ac2e0674c09424d14ef08a6f
|
|
5
5
|
SHA512:
|
|
6
|
-
metadata.gz:
|
|
7
|
-
data.tar.gz:
|
|
6
|
+
metadata.gz: 22e06d88b9cfcb981f5760a2a1d9fdf790f10e83012e4637a42468be02c68a22cb0fd2aeb43f05119ad34d251aec67fc9fc84223adb1eeff79a2ba922982a49f
|
|
7
|
+
data.tar.gz: 893e168a8c704c21a8fed6ccb2291952e1b028f0182a63d71dd3be7ec7d659599921640c7174d6ed888cdcab134171b015ab1af194f90ddeafd09c3f3ac3d6e6
|
data/README.md
CHANGED
|
@@ -23,15 +23,31 @@
|
|
|
23
23
|
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/css/bootstrap.min.css" rel="stylesheet">
|
|
24
24
|
<!-- Bootstrap Icons -->
|
|
25
25
|
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap-icons@1.11.0/font/bootstrap-icons.css">
|
|
26
|
+
<!-- Google Fonts -->
|
|
27
|
+
<link rel="stylesheet" href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&display=swap">
|
|
26
28
|
<!-- Chart.js for Data Visualization -->
|
|
27
29
|
<script src="https://cdn.jsdelivr.net/npm/chart.js@3.9.1/dist/chart.min.js"></script>
|
|
28
30
|
|
|
29
31
|
<style>
|
|
32
|
+
/* Base styles and typography */
|
|
33
|
+
body {
|
|
34
|
+
font-family: 'Inter', -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
|
|
35
|
+
font-size: 0.95rem;
|
|
36
|
+
line-height: 1.5;
|
|
37
|
+
letter-spacing: -0.01em;
|
|
38
|
+
}
|
|
39
|
+
|
|
40
|
+
h1, h2, h3, h4, h5, h6, .h1, .h2, .h3, .h4, .h5, .h6 {
|
|
41
|
+
font-weight: 600;
|
|
42
|
+
letter-spacing: -0.02em;
|
|
43
|
+
line-height: 1.25;
|
|
44
|
+
}
|
|
45
|
+
|
|
30
46
|
/* Core layout styles */
|
|
31
47
|
.dbviewer-wrapper { display: flex; flex-direction: column; min-height: 100vh; }
|
|
32
|
-
.dbviewer-navbar { height:
|
|
33
|
-
.dbviewer-navbar-spacer { height:
|
|
34
|
-
.dbviewer-content { display: flex; flex: 1; min-height: calc(100vh -
|
|
48
|
+
.dbviewer-navbar { height: 60px; }
|
|
49
|
+
.dbviewer-navbar-spacer { height: 60px; } /* Creates space for the fixed navbar */
|
|
50
|
+
.dbviewer-content { display: flex; flex: 1; min-height: calc(100vh - 60px); padding-top: 0; }
|
|
35
51
|
|
|
36
52
|
/* Smooth theme transitions */
|
|
37
53
|
html {
|
|
@@ -51,47 +67,49 @@
|
|
|
51
67
|
transition: color 0.2s ease, background-color 0.2s ease;
|
|
52
68
|
}
|
|
53
69
|
|
|
54
|
-
/* Sidebar styles */
|
|
70
|
+
/* Sidebar styles - enhanced for elegance */
|
|
55
71
|
.dbviewer-sidebar {
|
|
56
72
|
width: 260px;
|
|
57
|
-
height: calc(100vh -
|
|
73
|
+
height: calc(100vh - 60px);
|
|
58
74
|
position: fixed;
|
|
59
|
-
top:
|
|
75
|
+
top: 60px; /* Positioned right below the fixed navbar */
|
|
60
76
|
left: 0;
|
|
61
77
|
z-index: 1000;
|
|
62
78
|
display: flex;
|
|
63
79
|
flex-direction: column;
|
|
64
|
-
transition: transform 0.3s ease, background-color 0.2s ease, border-color 0.2s ease;
|
|
80
|
+
transition: transform 0.3s ease-in-out, background-color 0.2s ease, border-color 0.2s ease;
|
|
65
81
|
overflow: hidden; /* Changed from overflow-y: auto */
|
|
82
|
+
box-shadow: 3px 0 20px rgba(0, 0, 0, 0.05);
|
|
66
83
|
}
|
|
67
84
|
|
|
68
85
|
/* Dark mode overrides */
|
|
69
86
|
[data-bs-theme="light"] .dbviewer-sidebar {
|
|
70
|
-
background: #
|
|
71
|
-
border-right: 1px solid
|
|
87
|
+
background: #ffffff;
|
|
88
|
+
border-right: 1px solid rgba(222, 226, 230, 0.6);
|
|
72
89
|
}
|
|
73
90
|
|
|
74
91
|
[data-bs-theme="dark"] .dbviewer-sidebar {
|
|
75
|
-
background: #
|
|
76
|
-
border-right: 1px solid
|
|
92
|
+
background: #1a1d20;
|
|
93
|
+
border-right: 1px solid rgba(73, 80, 87, 0.3);
|
|
77
94
|
}
|
|
78
95
|
|
|
79
96
|
.dbviewer-sidebar-header {
|
|
80
|
-
padding:
|
|
81
|
-
font-weight:
|
|
97
|
+
padding: 1.2rem 1.25rem;
|
|
98
|
+
font-weight: 600;
|
|
82
99
|
align-items: center;
|
|
83
100
|
justify-content: space-between;
|
|
84
101
|
flex-shrink: 0;
|
|
102
|
+
display: flex;
|
|
85
103
|
}
|
|
86
104
|
|
|
87
105
|
[data-bs-theme="light"] .dbviewer-sidebar-header {
|
|
88
|
-
border-bottom: 1px solid
|
|
89
|
-
background: #f1f3f5;
|
|
106
|
+
border-bottom: 1px solid rgba(222, 226, 230, 0.6);
|
|
107
|
+
background: linear-gradient(to right, #f8f9fa, #f1f3f5);
|
|
90
108
|
}
|
|
91
109
|
|
|
92
110
|
[data-bs-theme="dark"] .dbviewer-sidebar-header {
|
|
93
|
-
border-bottom: 1px solid
|
|
94
|
-
background: #343a40;
|
|
111
|
+
border-bottom: 1px solid rgba(73, 80, 87, 0.3);
|
|
112
|
+
background: linear-gradient(to right, #343a40, #2c3034);
|
|
95
113
|
}
|
|
96
114
|
|
|
97
115
|
.dbviewer-sidebar-header h5 {
|
|
@@ -132,15 +150,35 @@
|
|
|
132
150
|
}
|
|
133
151
|
|
|
134
152
|
[data-bs-theme="dark"] .dbviewer-sidebar-top {
|
|
135
|
-
background: #
|
|
136
|
-
border-bottom: 1px solid
|
|
153
|
+
background: #1a1d20;
|
|
154
|
+
border-bottom: 1px solid rgba(73, 80, 87, 0.3);
|
|
137
155
|
}
|
|
138
156
|
|
|
139
157
|
.dbviewer-sidebar-content {
|
|
140
158
|
flex: 1;
|
|
141
159
|
overflow-y: auto;
|
|
142
|
-
padding: 0;
|
|
160
|
+
padding: 0.5rem 0;
|
|
143
161
|
height: 100%;
|
|
162
|
+
/* Improved scrollbar */
|
|
163
|
+
scrollbar-width: thin;
|
|
164
|
+
scrollbar-color: rgba(0, 0, 0, 0.2) transparent;
|
|
165
|
+
}
|
|
166
|
+
|
|
167
|
+
.dbviewer-sidebar-content::-webkit-scrollbar {
|
|
168
|
+
width: 4px;
|
|
169
|
+
}
|
|
170
|
+
|
|
171
|
+
.dbviewer-sidebar-content::-webkit-scrollbar-track {
|
|
172
|
+
background: transparent;
|
|
173
|
+
}
|
|
174
|
+
|
|
175
|
+
.dbviewer-sidebar-content::-webkit-scrollbar-thumb {
|
|
176
|
+
background-color: rgba(0, 0, 0, 0.2);
|
|
177
|
+
border-radius: 6px;
|
|
178
|
+
}
|
|
179
|
+
|
|
180
|
+
[data-bs-theme="dark"] .dbviewer-sidebar-content::-webkit-scrollbar-thumb {
|
|
181
|
+
background-color: rgba(255, 255, 255, 0.2);
|
|
144
182
|
}
|
|
145
183
|
|
|
146
184
|
.dbviewer-main {
|
|
@@ -149,34 +187,55 @@
|
|
|
149
187
|
padding: 2rem 2.5rem;
|
|
150
188
|
padding-top: 1.5rem; /* Adjusted for fixed header */
|
|
151
189
|
min-width: 0;
|
|
190
|
+
animation: fadeIn 0.5s ease-in-out;
|
|
191
|
+
transition: all 0.3s ease;
|
|
192
|
+
background: var(--bs-body-bg);
|
|
152
193
|
}
|
|
153
194
|
|
|
154
|
-
|
|
195
|
+
@keyframes fadeIn {
|
|
196
|
+
from { opacity: 0.6; }
|
|
197
|
+
to { opacity: 1; }
|
|
198
|
+
}
|
|
199
|
+
|
|
200
|
+
/* Enhanced mobile responsiveness with smooth animations */
|
|
155
201
|
@media (max-width: 991.98px) {
|
|
156
|
-
.dbviewer-sidebar {
|
|
157
|
-
|
|
158
|
-
|
|
202
|
+
.dbviewer-sidebar {
|
|
203
|
+
transform: translateX(-100%);
|
|
204
|
+
box-shadow: none;
|
|
205
|
+
transition: transform 0.3s cubic-bezier(0.165, 0.84, 0.44, 1);
|
|
206
|
+
}
|
|
207
|
+
|
|
208
|
+
.dbviewer-sidebar.active {
|
|
209
|
+
transform: translateX(0);
|
|
210
|
+
box-shadow: 5px 0 20px rgba(0, 0, 0, 0.15);
|
|
211
|
+
}
|
|
159
212
|
|
|
160
|
-
|
|
213
|
+
.dbviewer-main {
|
|
214
|
+
margin-left: 0;
|
|
215
|
+
padding: 1.25rem;
|
|
216
|
+
transition: padding 0.3s ease;
|
|
217
|
+
}
|
|
218
|
+
|
|
219
|
+
/* Improved overlay for mobile sidebar */
|
|
161
220
|
.dbviewer-sidebar-overlay {
|
|
162
221
|
position: fixed;
|
|
163
|
-
top:
|
|
222
|
+
top: 60px; /* Start below the fixed navbar */
|
|
164
223
|
left: 0;
|
|
165
224
|
right: 0;
|
|
166
225
|
bottom: 0;
|
|
167
|
-
|
|
226
|
+
backdrop-filter: blur(2px);
|
|
168
227
|
z-index: 999;
|
|
169
228
|
opacity: 0;
|
|
170
229
|
visibility: hidden;
|
|
171
|
-
transition:
|
|
230
|
+
transition: all 0.3s cubic-bezier(0.165, 0.84, 0.44, 1);
|
|
172
231
|
}
|
|
173
232
|
|
|
174
233
|
[data-bs-theme="light"] .dbviewer-sidebar-overlay {
|
|
175
|
-
background: rgba(0,0,0,0.
|
|
234
|
+
background: rgba(0,0,0,0.3);
|
|
176
235
|
}
|
|
177
236
|
|
|
178
237
|
[data-bs-theme="dark"] .dbviewer-sidebar-overlay {
|
|
179
|
-
background: rgba(0,0,0,0.
|
|
238
|
+
background: rgba(0,0,0,0.5);
|
|
180
239
|
}
|
|
181
240
|
|
|
182
241
|
.dbviewer-sidebar-overlay.active {
|
|
@@ -184,54 +243,242 @@
|
|
|
184
243
|
visibility: visible;
|
|
185
244
|
}
|
|
186
245
|
|
|
246
|
+
/* Toggle button styling */
|
|
247
|
+
.dbviewer-sidebar-toggle {
|
|
248
|
+
border-radius: 8px;
|
|
249
|
+
padding: 0.4rem 0.8rem;
|
|
250
|
+
box-shadow: 0 2px 5px rgba(0,0,0,0.1);
|
|
251
|
+
border: none;
|
|
252
|
+
background: var(--bs-primary);
|
|
253
|
+
color: white;
|
|
254
|
+
font-weight: 500;
|
|
255
|
+
transition: all 0.2s ease;
|
|
256
|
+
}
|
|
257
|
+
|
|
258
|
+
.dbviewer-sidebar-toggle:hover {
|
|
259
|
+
transform: translateY(-1px);
|
|
260
|
+
box-shadow: 0 4px 8px rgba(0,0,0,0.15);
|
|
261
|
+
}
|
|
262
|
+
|
|
187
263
|
body.dbviewer-sidebar-open {
|
|
188
264
|
overflow: hidden;
|
|
189
265
|
}
|
|
190
266
|
}
|
|
191
267
|
|
|
192
268
|
@media (max-width: 767.98px) {
|
|
193
|
-
.dbviewer-sidebar { width:
|
|
194
|
-
.dbviewer-main { padding:
|
|
269
|
+
.dbviewer-sidebar { width: 230px; }
|
|
270
|
+
.dbviewer-main { padding: 1rem; }
|
|
195
271
|
.dbviewer-sidebar-header h5 { max-width: 70%; font-size: 1rem; }
|
|
272
|
+
|
|
273
|
+
/* Make tables more responsive */
|
|
274
|
+
.table-responsive {
|
|
275
|
+
overflow-x: auto;
|
|
276
|
+
-webkit-overflow-scrolling: touch;
|
|
277
|
+
}
|
|
278
|
+
|
|
279
|
+
.stat-card-bg {
|
|
280
|
+
margin-bottom: 1rem;
|
|
281
|
+
}
|
|
282
|
+
}
|
|
283
|
+
|
|
284
|
+
/* Extra small screens */
|
|
285
|
+
@media (max-width: 575.98px) {
|
|
286
|
+
.dbviewer-main { padding: 0.75rem; }
|
|
287
|
+
h1, .h1 { font-size: 1.6rem; }
|
|
288
|
+
h2, .h2 { font-size: 1.4rem; }
|
|
289
|
+
h3, .h3 { font-size: 1.2rem; }
|
|
290
|
+
|
|
291
|
+
.btn-sm {
|
|
292
|
+
font-size: 0.8rem;
|
|
293
|
+
}
|
|
294
|
+
|
|
295
|
+
.card-body {
|
|
296
|
+
padding: 1rem;
|
|
297
|
+
}
|
|
298
|
+
}
|
|
299
|
+
|
|
300
|
+
/* Table filter input - enhanced */
|
|
301
|
+
.dbviewer-table-filter-container {
|
|
302
|
+
position: relative;
|
|
303
|
+
padding: 0.75rem 1rem;
|
|
304
|
+
margin-bottom: 0.5rem;
|
|
305
|
+
transition: background-color 0.2s ease;
|
|
306
|
+
}
|
|
307
|
+
|
|
308
|
+
.dbviewer-table-filter-icon {
|
|
309
|
+
position: absolute;
|
|
310
|
+
left: 1.5rem;
|
|
311
|
+
top: 50%;
|
|
312
|
+
transform: translateY(-50%);
|
|
313
|
+
color: #6c757d;
|
|
314
|
+
font-size: 0.85rem;
|
|
315
|
+
padding: 0.25rem;
|
|
316
|
+
width: 1.5rem;
|
|
317
|
+
text-align: center;
|
|
318
|
+
z-index: 2;
|
|
319
|
+
transition: color 0.2s ease;
|
|
320
|
+
}
|
|
321
|
+
|
|
322
|
+
.dbviewer-table-filter {
|
|
323
|
+
border-radius: 8px;
|
|
324
|
+
padding: 0.65rem 0.85rem 0.65rem 2.5rem;
|
|
325
|
+
margin-bottom: 1rem;
|
|
326
|
+
transition: all 0.2s ease;
|
|
327
|
+
border: 1px solid rgba(0, 0, 0, 0.1);
|
|
328
|
+
box-shadow: 0 2px 5px rgba(0, 0, 0, 0.05);
|
|
329
|
+
font-size: 0.9rem;
|
|
330
|
+
}
|
|
331
|
+
|
|
332
|
+
.dbviewer-table-filter:focus {
|
|
333
|
+
box-shadow: 0 0 0 3px rgba(13, 110, 253, 0.15);
|
|
334
|
+
border-color: #86b7fe;
|
|
335
|
+
}
|
|
336
|
+
|
|
337
|
+
[data-bs-theme="dark"] .dbviewer-table-filter {
|
|
338
|
+
background: rgba(255, 255, 255, 0.05);
|
|
339
|
+
border-color: rgba(255, 255, 255, 0.1);
|
|
196
340
|
}
|
|
197
341
|
|
|
198
|
-
|
|
199
|
-
|
|
200
|
-
|
|
201
|
-
.dbviewer-table-filter { border-radius: 20px; padding-left: 2.5rem; margin-bottom: 1rem; }
|
|
342
|
+
[data-bs-theme="dark"] .dbviewer-table-filter:focus {
|
|
343
|
+
border-color: rgba(134, 183, 254, 0.7);
|
|
344
|
+
}
|
|
202
345
|
|
|
203
346
|
/* Table structure and visualization components */
|
|
204
|
-
.dbviewer-card {
|
|
347
|
+
.dbviewer-card {
|
|
348
|
+
border-radius: 0.5rem;
|
|
349
|
+
transition: all 0.2s ease;
|
|
350
|
+
overflow: hidden;
|
|
351
|
+
box-shadow: 0 2px 12px rgba(0, 0, 0, 0.06), 0 1px 4px rgba(0, 0, 0, 0.08);
|
|
352
|
+
height: 100%;
|
|
353
|
+
}
|
|
354
|
+
|
|
355
|
+
.dbviewer-card:hover {
|
|
356
|
+
box-shadow: 0 5px 15px rgba(0, 0, 0, 0.08), 0 1px 6px rgba(0, 0, 0, 0.1);
|
|
357
|
+
transform: translateY(-2px);
|
|
358
|
+
}
|
|
359
|
+
|
|
360
|
+
/* Improved card headers */
|
|
361
|
+
.dbviewer-card .card-header {
|
|
362
|
+
font-weight: 600;
|
|
363
|
+
padding: 1rem 1.25rem;
|
|
364
|
+
border-bottom-width: 1px;
|
|
365
|
+
}
|
|
366
|
+
|
|
367
|
+
/* Card body padding */
|
|
368
|
+
.dbviewer-card .card-body {
|
|
369
|
+
padding: 1.25rem;
|
|
370
|
+
}
|
|
205
371
|
|
|
206
372
|
[data-bs-theme="light"] .dbviewer-card {
|
|
207
|
-
border:
|
|
373
|
+
border: none;
|
|
374
|
+
background: #ffffff;
|
|
208
375
|
}
|
|
209
376
|
|
|
210
377
|
[data-bs-theme="dark"] .dbviewer-card {
|
|
211
|
-
border:
|
|
378
|
+
border: none;
|
|
379
|
+
background: #212529;
|
|
212
380
|
}
|
|
213
381
|
|
|
214
|
-
.dbviewer-scrollable {
|
|
215
|
-
|
|
382
|
+
.dbviewer-scrollable {
|
|
383
|
+
max-height: 700px;
|
|
384
|
+
overflow-y: auto;
|
|
385
|
+
border-radius: 0.5rem;
|
|
386
|
+
scrollbar-width: thin;
|
|
387
|
+
scrollbar-color: rgba(0, 0, 0, 0.2) transparent;
|
|
388
|
+
}
|
|
389
|
+
|
|
390
|
+
.dbviewer-scrollable::-webkit-scrollbar {
|
|
391
|
+
width: 5px;
|
|
392
|
+
height: 8px;
|
|
393
|
+
}
|
|
394
|
+
|
|
395
|
+
.dbviewer-scrollable::-webkit-scrollbar-track {
|
|
396
|
+
background: transparent;
|
|
397
|
+
}
|
|
398
|
+
|
|
399
|
+
.dbviewer-scrollable::-webkit-scrollbar-thumb {
|
|
400
|
+
background-color: rgba(0, 0, 0, 0.2);
|
|
401
|
+
border-radius: 10px;
|
|
402
|
+
}
|
|
403
|
+
|
|
404
|
+
[data-bs-theme="dark"] .dbviewer-scrollable::-webkit-scrollbar-thumb {
|
|
405
|
+
background-color: rgba(255, 255, 255, 0.2);
|
|
406
|
+
}
|
|
407
|
+
|
|
408
|
+
.dbviewer-scrollable thead {
|
|
409
|
+
position: sticky;
|
|
410
|
+
top: 0;
|
|
411
|
+
z-index: 1;
|
|
412
|
+
box-shadow: 0 1px 3px rgba(0, 0, 0, 0.05);
|
|
413
|
+
width: 100%;
|
|
414
|
+
}
|
|
415
|
+
|
|
416
|
+
/* Ensure the scrollable table headers have solid backgrounds */
|
|
417
|
+
[data-bs-theme="light"] .dbviewer-scrollable thead {
|
|
418
|
+
background-color: #f1f3f5;
|
|
419
|
+
}
|
|
420
|
+
|
|
421
|
+
[data-bs-theme="dark"] .dbviewer-scrollable thead {
|
|
422
|
+
background-color: #343a40;
|
|
423
|
+
}
|
|
424
|
+
|
|
425
|
+
/* Ensure individual th cells also have proper background */
|
|
426
|
+
.dbviewer-scrollable thead th {
|
|
427
|
+
background-color: transparent;
|
|
428
|
+
}
|
|
429
|
+
|
|
430
|
+
/* Specific fix for sticky table headers to ensure solid backgrounds */
|
|
431
|
+
.table-responsive .table thead,
|
|
432
|
+
.dbviewer-scrollable .table thead {
|
|
433
|
+
position: sticky;
|
|
434
|
+
top: 0;
|
|
435
|
+
z-index: 10;
|
|
436
|
+
}
|
|
437
|
+
|
|
438
|
+
/* Additional specificity for table headers in dark mode */
|
|
439
|
+
[data-bs-theme="light"] .table-responsive .table thead th,
|
|
440
|
+
[data-bs-theme="light"] .dbviewer-scrollable .table thead th {
|
|
441
|
+
background-color: #f1f3f5;
|
|
442
|
+
}
|
|
443
|
+
|
|
444
|
+
[data-bs-theme="dark"] .table-responsive .table thead th,
|
|
445
|
+
[data-bs-theme="dark"] .dbviewer-scrollable .table thead th {
|
|
446
|
+
background-color: #343a40;
|
|
447
|
+
}
|
|
448
|
+
|
|
449
|
+
/* Ensure borders appear properly with sticky headers */
|
|
450
|
+
.table thead th {
|
|
451
|
+
box-shadow: inset 0 1px 0 var(--bs-border-color),
|
|
452
|
+
inset 0 -1px 0 var(--bs-border-color);
|
|
453
|
+
}
|
|
454
|
+
|
|
455
|
+
/* Enhanced badge styling */
|
|
456
|
+
.badge {
|
|
457
|
+
font-weight: 500;
|
|
458
|
+
padding: 0.4em 0.6em;
|
|
459
|
+
border-radius: 6px;
|
|
460
|
+
letter-spacing: 0.01em;
|
|
461
|
+
font-size: 0.75em;
|
|
462
|
+
text-transform: none;
|
|
463
|
+
}
|
|
216
464
|
|
|
217
|
-
/* Badge styling for dark mode */
|
|
218
465
|
[data-bs-theme="dark"] .bg-secondary-subtle {
|
|
219
466
|
background-color: rgba(255, 255, 255, 0.15) !important;
|
|
220
|
-
color: #
|
|
467
|
+
color: #f8f9fa !important;
|
|
221
468
|
}
|
|
222
469
|
|
|
223
470
|
[data-bs-theme="light"] .bg-secondary-subtle {
|
|
224
471
|
background-color: #e9ecef !important;
|
|
225
|
-
color: #
|
|
472
|
+
color: #495057 !important;
|
|
226
473
|
}
|
|
227
474
|
|
|
228
475
|
/* Table header styling */
|
|
229
476
|
.dbviewer-table-header {
|
|
230
|
-
background-color:
|
|
477
|
+
background-color: #f1f3f5;
|
|
231
478
|
}
|
|
232
479
|
|
|
233
480
|
[data-bs-theme="dark"] .dbviewer-table-header {
|
|
234
|
-
background-color:
|
|
481
|
+
background-color: #343a40;
|
|
235
482
|
}
|
|
236
483
|
|
|
237
484
|
/* List group styling for dark mode */
|
|
@@ -244,7 +491,7 @@
|
|
|
244
491
|
[data-bs-theme="dark"] .dbviewer-table-header {
|
|
245
492
|
position: sticky;
|
|
246
493
|
top: 0;
|
|
247
|
-
background: #
|
|
494
|
+
background: #343a40;
|
|
248
495
|
z-index: 1;
|
|
249
496
|
}
|
|
250
497
|
|
|
@@ -269,26 +516,32 @@
|
|
|
269
516
|
box-shadow: 0 1px 2px rgba(0,0,0,0.2);
|
|
270
517
|
}
|
|
271
518
|
|
|
272
|
-
/*
|
|
519
|
+
/* Enhanced dark mode toggle */
|
|
273
520
|
.theme-toggle {
|
|
274
521
|
background: transparent;
|
|
275
522
|
border: none;
|
|
276
|
-
padding: 0.
|
|
523
|
+
padding: 0.4rem 0.6rem;
|
|
524
|
+
margin-right: 0.25rem;
|
|
277
525
|
cursor: pointer;
|
|
278
526
|
display: flex;
|
|
279
527
|
align-items: center;
|
|
528
|
+
justify-content: center;
|
|
280
529
|
color: white;
|
|
281
|
-
opacity: 0.
|
|
282
|
-
transition:
|
|
530
|
+
opacity: 0.85;
|
|
531
|
+
transition: all 0.3s cubic-bezier(0.175, 0.885, 0.32, 1.275);
|
|
532
|
+
border-radius: 50%;
|
|
533
|
+
width: 36px;
|
|
534
|
+
height: 36px;
|
|
283
535
|
}
|
|
284
536
|
|
|
285
537
|
.theme-toggle:hover {
|
|
286
538
|
opacity: 1;
|
|
287
|
-
transform: rotate(
|
|
539
|
+
transform: rotate(15deg) scale(1.1);
|
|
540
|
+
background-color: rgba(255, 255, 255, 0.1);
|
|
288
541
|
}
|
|
289
542
|
|
|
290
543
|
.theme-toggle:active {
|
|
291
|
-
transform: rotate(
|
|
544
|
+
transform: rotate(30deg) scale(0.9);
|
|
292
545
|
}
|
|
293
546
|
|
|
294
547
|
.theme-toggle .bi-sun,
|
|
@@ -308,35 +561,103 @@
|
|
|
308
561
|
font-size: 1.2rem;
|
|
309
562
|
}
|
|
310
563
|
|
|
311
|
-
/* Header styles for
|
|
564
|
+
/* Header styles for a more professional look */
|
|
312
565
|
.navbar {
|
|
313
|
-
transition:
|
|
566
|
+
transition: all 0.3s ease;
|
|
567
|
+
padding: 0.5rem 1rem;
|
|
568
|
+
box-shadow: 0 2px 15px rgba(0, 0, 0, 0.08);
|
|
569
|
+
}
|
|
570
|
+
|
|
571
|
+
.navbar-brand {
|
|
572
|
+
font-weight: 600;
|
|
573
|
+
letter-spacing: -0.01em;
|
|
574
|
+
}
|
|
575
|
+
|
|
576
|
+
.nav-link {
|
|
577
|
+
font-weight: 500;
|
|
578
|
+
padding: 0.5rem 0.8rem !important;
|
|
579
|
+
border-radius: 4px;
|
|
580
|
+
transition: all 0.2s ease;
|
|
581
|
+
margin: 0 2px;
|
|
582
|
+
}
|
|
583
|
+
|
|
584
|
+
.nav-link.active {
|
|
585
|
+
background-color: rgba(255, 255, 255, 0.15);
|
|
586
|
+
}
|
|
587
|
+
|
|
588
|
+
.nav-link:hover:not(.active) {
|
|
589
|
+
background-color: rgba(255, 255, 255, 0.1);
|
|
314
590
|
}
|
|
315
591
|
|
|
316
592
|
[data-bs-theme="light"] .navbar.bg-primary {
|
|
317
|
-
background
|
|
593
|
+
background: linear-gradient(to right, #0d6efd, #0b5ed7) !important;
|
|
318
594
|
}
|
|
319
595
|
|
|
320
596
|
[data-bs-theme="dark"] .navbar.bg-primary {
|
|
321
|
-
background
|
|
322
|
-
border-bottom: 1px solid
|
|
597
|
+
background: linear-gradient(to right, #212529, #1a1e21) !important;
|
|
598
|
+
border-bottom: 1px solid rgba(73, 80, 87, 0.5);
|
|
599
|
+
}
|
|
600
|
+
|
|
601
|
+
/* Enhanced list group styling */
|
|
602
|
+
.list-group-item {
|
|
603
|
+
border-radius: 0;
|
|
604
|
+
border-left: 0;
|
|
605
|
+
border-right: 0;
|
|
606
|
+
padding: 0.75rem 1.25rem;
|
|
607
|
+
transition: all 0.15s ease-in-out;
|
|
608
|
+
position: relative;
|
|
609
|
+
font-weight: 500;
|
|
610
|
+
font-size: 0.9rem;
|
|
611
|
+
}
|
|
612
|
+
|
|
613
|
+
.list-group-item:first-child {
|
|
614
|
+
border-top: 0;
|
|
615
|
+
}
|
|
616
|
+
|
|
617
|
+
.list-group-item-action {
|
|
618
|
+
border-left: 3px solid transparent;
|
|
619
|
+
}
|
|
620
|
+
|
|
621
|
+
.list-group-item-action:hover {
|
|
622
|
+
border-left-color: rgba(13, 110, 253, 0.3);
|
|
623
|
+
}
|
|
624
|
+
|
|
625
|
+
.list-group-item.active {
|
|
626
|
+
border-left-color: #0d6efd;
|
|
627
|
+
font-weight: 600;
|
|
628
|
+
position: relative;
|
|
629
|
+
}
|
|
630
|
+
|
|
631
|
+
[data-bs-theme="light"] .list-group-item {
|
|
632
|
+
background-color: transparent;
|
|
633
|
+
border-color: rgba(0, 0, 0, 0.08);
|
|
634
|
+
}
|
|
635
|
+
|
|
636
|
+
[data-bs-theme="light"] .list-group-item.active {
|
|
637
|
+
background-color: rgba(13, 110, 253, 0.08);
|
|
638
|
+
color: #0d6efd;
|
|
639
|
+
}
|
|
640
|
+
|
|
641
|
+
[data-bs-theme="light"] .list-group-item-action:hover,
|
|
642
|
+
[data-bs-theme="light"] .list-group-item-action:focus {
|
|
643
|
+
background-color: rgba(0, 0, 0, 0.03);
|
|
323
644
|
}
|
|
324
645
|
|
|
325
|
-
/* Sidebar list group styling for dark mode */
|
|
326
646
|
[data-bs-theme="dark"] .list-group-item {
|
|
327
|
-
background-color:
|
|
328
|
-
border-color:
|
|
647
|
+
background-color: transparent;
|
|
648
|
+
border-color: rgba(73, 80, 87, 0.3);
|
|
329
649
|
color: #e9ecef;
|
|
330
650
|
}
|
|
331
651
|
|
|
332
652
|
[data-bs-theme="dark"] .list-group-item.active {
|
|
333
|
-
background-color:
|
|
334
|
-
border-color:
|
|
653
|
+
background-color: rgba(13, 110, 253, 0.15);
|
|
654
|
+
border-color: rgba(73, 80, 87, 0.3);
|
|
655
|
+
color: #6ea8fe;
|
|
335
656
|
}
|
|
336
657
|
|
|
337
658
|
[data-bs-theme="dark"] .list-group-item-action:hover,
|
|
338
659
|
[data-bs-theme="dark"] .list-group-item-action:focus {
|
|
339
|
-
background-color:
|
|
660
|
+
background-color: rgba(255, 255, 255, 0.03);
|
|
340
661
|
color: #f8f9fa;
|
|
341
662
|
}
|
|
342
663
|
|
|
@@ -359,6 +680,59 @@
|
|
|
359
680
|
color: #adb5bd;
|
|
360
681
|
}
|
|
361
682
|
|
|
683
|
+
/* Enhanced button styling */
|
|
684
|
+
.btn {
|
|
685
|
+
font-weight: 500;
|
|
686
|
+
padding: 0.5rem 1rem;
|
|
687
|
+
border-radius: 0.375rem;
|
|
688
|
+
transition: all 0.2s ease;
|
|
689
|
+
box-shadow: 0 1px 2px rgba(0, 0, 0, 0.05);
|
|
690
|
+
}
|
|
691
|
+
|
|
692
|
+
.btn-sm {
|
|
693
|
+
padding: 0.35rem 0.75rem;
|
|
694
|
+
font-size: 0.85rem;
|
|
695
|
+
}
|
|
696
|
+
|
|
697
|
+
.btn-lg {
|
|
698
|
+
padding: 0.65rem 1.2rem;
|
|
699
|
+
font-size: 1.05rem;
|
|
700
|
+
}
|
|
701
|
+
|
|
702
|
+
.btn:active {
|
|
703
|
+
transform: translateY(1px);
|
|
704
|
+
}
|
|
705
|
+
|
|
706
|
+
.btn-primary {
|
|
707
|
+
border: none;
|
|
708
|
+
background: linear-gradient(135deg, #0d6efd, #0b5ed7);
|
|
709
|
+
}
|
|
710
|
+
|
|
711
|
+
.btn-primary:hover {
|
|
712
|
+
background: linear-gradient(135deg, #0b5ed7, #0a58ca);
|
|
713
|
+
transform: translateY(-1px);
|
|
714
|
+
box-shadow: 0 4px 8px rgba(13, 110, 253, 0.25);
|
|
715
|
+
}
|
|
716
|
+
|
|
717
|
+
.btn-outline-primary {
|
|
718
|
+
border-width: 1px;
|
|
719
|
+
}
|
|
720
|
+
|
|
721
|
+
.btn-outline-primary:hover {
|
|
722
|
+
transform: translateY(-1px);
|
|
723
|
+
box-shadow: 0 4px 8px rgba(13, 110, 253, 0.15);
|
|
724
|
+
}
|
|
725
|
+
|
|
726
|
+
[data-bs-theme="dark"] .btn-outline-primary {
|
|
727
|
+
border-color: rgba(13, 110, 253, 0.7);
|
|
728
|
+
color: #6ea8fe;
|
|
729
|
+
}
|
|
730
|
+
|
|
731
|
+
[data-bs-theme="dark"] .btn-outline-primary:hover {
|
|
732
|
+
background-color: rgba(13, 110, 253, 0.2);
|
|
733
|
+
color: #6ea8fe;
|
|
734
|
+
}
|
|
735
|
+
|
|
362
736
|
/* Query timestamp */
|
|
363
737
|
[data-bs-theme="light"] .query-timestamp {
|
|
364
738
|
color: #6c757d;
|
|
@@ -387,6 +761,25 @@
|
|
|
387
761
|
text-decoration: underline;
|
|
388
762
|
}
|
|
389
763
|
|
|
764
|
+
/* Enhanced code blocks and SQL query styling */
|
|
765
|
+
pre, code {
|
|
766
|
+
font-family: "SFMono-Regular", Consolas, "Liberation Mono", Menlo, monospace;
|
|
767
|
+
border-radius: 4px;
|
|
768
|
+
transition: all 0.2s ease;
|
|
769
|
+
}
|
|
770
|
+
|
|
771
|
+
pre {
|
|
772
|
+
padding: 1rem;
|
|
773
|
+
margin-bottom: 1rem;
|
|
774
|
+
border-radius: 0.5rem;
|
|
775
|
+
box-shadow: 0 2px 8px rgba(0, 0, 0, 0.05);
|
|
776
|
+
}
|
|
777
|
+
|
|
778
|
+
code {
|
|
779
|
+
font-size: 0.875em;
|
|
780
|
+
padding: 0.2em 0.4em;
|
|
781
|
+
}
|
|
782
|
+
|
|
390
783
|
/* SQL query code in tables */
|
|
391
784
|
code.sql-query-code {
|
|
392
785
|
display: inline-block;
|
|
@@ -394,16 +787,38 @@
|
|
|
394
787
|
max-width: 100%;
|
|
395
788
|
overflow: hidden;
|
|
396
789
|
text-overflow: ellipsis;
|
|
397
|
-
padding:
|
|
398
|
-
border-radius:
|
|
790
|
+
padding: 3px 6px;
|
|
791
|
+
border-radius: 4px;
|
|
792
|
+
box-shadow: 0 1px 3px rgba(0, 0, 0, 0.03);
|
|
793
|
+
}
|
|
794
|
+
|
|
795
|
+
[data-bs-theme="light"] pre {
|
|
796
|
+
background-color: #f8f9fa;
|
|
797
|
+
border: 1px solid rgba(0, 0, 0, 0.05);
|
|
798
|
+
}
|
|
799
|
+
|
|
800
|
+
[data-bs-theme="light"] code {
|
|
801
|
+
background-color: rgba(0, 0, 0, 0.05);
|
|
802
|
+
color: #d63384;
|
|
399
803
|
}
|
|
400
804
|
|
|
401
805
|
[data-bs-theme="light"] code.sql-query-code {
|
|
402
806
|
background-color: rgba(0, 0, 0, 0.05);
|
|
807
|
+
color: #0550a0;
|
|
403
808
|
}
|
|
404
809
|
|
|
405
|
-
[data-bs-theme="dark"]
|
|
810
|
+
[data-bs-theme="dark"] pre {
|
|
811
|
+
background-color: #2c3034;
|
|
812
|
+
border: 1px solid rgba(255, 255, 255, 0.05);
|
|
813
|
+
}
|
|
814
|
+
|
|
815
|
+
[data-bs-theme="dark"] code {
|
|
406
816
|
background-color: rgba(255, 255, 255, 0.1);
|
|
817
|
+
color: #ff8bd0;
|
|
818
|
+
}
|
|
819
|
+
|
|
820
|
+
[data-bs-theme="dark"] code.sql-query-code {
|
|
821
|
+
background-color: rgba(0, 123, 255, 0.1);
|
|
407
822
|
color: #65cdff;
|
|
408
823
|
}
|
|
409
824
|
|
|
@@ -427,29 +842,103 @@
|
|
|
427
842
|
font-size: 0.875rem;
|
|
428
843
|
}
|
|
429
844
|
|
|
430
|
-
/*
|
|
845
|
+
/* Enhanced database name badge */
|
|
431
846
|
.database-name-badge {
|
|
432
|
-
font-size: 0.
|
|
433
|
-
font-weight:
|
|
847
|
+
font-size: 0.9rem;
|
|
848
|
+
font-weight: 600;
|
|
434
849
|
text-transform: lowercase;
|
|
435
850
|
letter-spacing: 0.02em;
|
|
851
|
+
padding: 0.35em 0.65em;
|
|
852
|
+
border-radius: 6px;
|
|
853
|
+
box-shadow: 0 1px 5px rgba(13, 110, 253, 0.3);
|
|
854
|
+
transition: all 0.2s ease;
|
|
855
|
+
}
|
|
856
|
+
|
|
857
|
+
.database-name-badge:hover {
|
|
858
|
+
transform: translateY(-1px);
|
|
859
|
+
box-shadow: 0 2px 8px rgba(13, 110, 253, 0.4);
|
|
436
860
|
}
|
|
437
861
|
|
|
438
862
|
[data-bs-theme="light"] .database-name-badge {
|
|
439
|
-
background
|
|
863
|
+
background: linear-gradient(135deg, #0d6efd, #0b5ed7);
|
|
440
864
|
color: #ffffff;
|
|
441
865
|
}
|
|
442
866
|
|
|
443
867
|
[data-bs-theme="dark"] .database-name-badge {
|
|
444
|
-
background
|
|
868
|
+
background: linear-gradient(135deg, #0d6efd, #0a58ca);
|
|
445
869
|
color: #ffffff;
|
|
446
870
|
}
|
|
447
871
|
|
|
448
|
-
/*
|
|
872
|
+
/* Enhanced table styling */
|
|
873
|
+
.table {
|
|
874
|
+
margin-bottom: 0;
|
|
875
|
+
width: 100%;
|
|
876
|
+
border-collapse: separate;
|
|
877
|
+
border-spacing: 0;
|
|
878
|
+
}
|
|
879
|
+
|
|
880
|
+
.table thead {
|
|
881
|
+
background-color: #f1f3f5;
|
|
882
|
+
}
|
|
883
|
+
|
|
884
|
+
.table thead th {
|
|
885
|
+
padding: 1rem;
|
|
886
|
+
font-weight: 600;
|
|
887
|
+
border-top: 0;
|
|
888
|
+
vertical-align: middle;
|
|
889
|
+
letter-spacing: 0.01em;
|
|
890
|
+
font-size: 0.88rem;
|
|
891
|
+
text-transform: uppercase;
|
|
892
|
+
position: sticky;
|
|
893
|
+
top: 0;
|
|
894
|
+
z-index: 5;
|
|
895
|
+
background-color: inherit; /* Ensure it inherits from parent thead */
|
|
896
|
+
}
|
|
897
|
+
|
|
898
|
+
.table tbody td {
|
|
899
|
+
padding: 0.85rem 1rem;
|
|
900
|
+
vertical-align: middle;
|
|
901
|
+
border-color: var(--bs-border-color);
|
|
902
|
+
font-size: 0.92rem;
|
|
903
|
+
}
|
|
904
|
+
|
|
905
|
+
.table tbody tr:hover {
|
|
906
|
+
background-color: rgba(0, 0, 0, 0.02);
|
|
907
|
+
}
|
|
908
|
+
|
|
909
|
+
[data-bs-theme="light"] .table thead {
|
|
910
|
+
background-color: #f1f3f5;
|
|
911
|
+
}
|
|
912
|
+
|
|
913
|
+
[data-bs-theme="light"] .table thead th {
|
|
914
|
+
color: #495057;
|
|
915
|
+
border-color: #dee2e6;
|
|
916
|
+
border-bottom: 2px solid #dee2e6;
|
|
917
|
+
box-shadow: 0 1px 2px rgba(0, 0, 0, 0.03);
|
|
918
|
+
}
|
|
919
|
+
|
|
920
|
+
[data-bs-theme="dark"] .table thead {
|
|
921
|
+
background-color: #343a40;
|
|
922
|
+
}
|
|
923
|
+
|
|
449
924
|
[data-bs-theme="dark"] .table thead th {
|
|
450
925
|
color: #e9ecef;
|
|
451
926
|
border-color: #495057;
|
|
452
927
|
border-bottom: 2px solid #495057;
|
|
928
|
+
box-shadow: 0 1px 2px rgba(0, 0, 0, 0.05);
|
|
929
|
+
}
|
|
930
|
+
|
|
931
|
+
[data-bs-theme="dark"] .table tbody tr:hover {
|
|
932
|
+
background-color: rgba(255, 255, 255, 0.03);
|
|
933
|
+
}
|
|
934
|
+
|
|
935
|
+
/* Zebra striping */
|
|
936
|
+
.table-striped > tbody > tr:nth-of-type(odd) > * {
|
|
937
|
+
background-color: rgba(0, 0, 0, 0.015);
|
|
938
|
+
}
|
|
939
|
+
|
|
940
|
+
[data-bs-theme="dark"] .table-striped > tbody > tr:nth-of-type(odd) > * {
|
|
941
|
+
background-color: rgba(255, 255, 255, 0.02);
|
|
453
942
|
}
|
|
454
943
|
|
|
455
944
|
/* Card title colors */
|
|
@@ -472,13 +961,64 @@
|
|
|
472
961
|
color: #000 !important;
|
|
473
962
|
}
|
|
474
963
|
|
|
475
|
-
/*
|
|
964
|
+
/* Enhanced alert styling */
|
|
965
|
+
.alert {
|
|
966
|
+
border-radius: 0.5rem;
|
|
967
|
+
border-width: 0;
|
|
968
|
+
padding: 1rem 1.25rem;
|
|
969
|
+
box-shadow: 0 3px 10px rgba(0, 0, 0, 0.08);
|
|
970
|
+
position: relative;
|
|
971
|
+
border-left: 4px solid transparent;
|
|
972
|
+
}
|
|
973
|
+
|
|
974
|
+
.alert-info {
|
|
975
|
+
background-color: rgba(13, 202, 240, 0.1);
|
|
976
|
+
border-left-color: #0dcaf0;
|
|
977
|
+
color: #087990;
|
|
978
|
+
}
|
|
979
|
+
|
|
980
|
+
.alert-danger {
|
|
981
|
+
background-color: rgba(220, 53, 69, 0.1);
|
|
982
|
+
border-left-color: #dc3545;
|
|
983
|
+
color: #b02a37;
|
|
984
|
+
}
|
|
985
|
+
|
|
986
|
+
.alert-success {
|
|
987
|
+
background-color: rgba(25, 135, 84, 0.1);
|
|
988
|
+
border-left-color: #198754;
|
|
989
|
+
color: #146c43;
|
|
990
|
+
}
|
|
991
|
+
|
|
992
|
+
.alert-warning {
|
|
993
|
+
background-color: rgba(255, 193, 7, 0.1);
|
|
994
|
+
border-left-color: #ffc107;
|
|
995
|
+
color: #997404;
|
|
996
|
+
}
|
|
997
|
+
|
|
476
998
|
[data-bs-theme="dark"] .alert-info {
|
|
477
|
-
background-color: rgba(13, 202, 240, 0.
|
|
478
|
-
border-color:
|
|
999
|
+
background-color: rgba(13, 202, 240, 0.15);
|
|
1000
|
+
border-left-color: #0dcaf0;
|
|
479
1001
|
color: #9eeaf9;
|
|
480
1002
|
}
|
|
481
1003
|
|
|
1004
|
+
[data-bs-theme="dark"] .alert-danger {
|
|
1005
|
+
background-color: rgba(220, 53, 69, 0.15);
|
|
1006
|
+
border-left-color: #dc3545;
|
|
1007
|
+
color: #ea868f;
|
|
1008
|
+
}
|
|
1009
|
+
|
|
1010
|
+
[data-bs-theme="dark"] .alert-success {
|
|
1011
|
+
background-color: rgba(25, 135, 84, 0.15);
|
|
1012
|
+
border-left-color: #198754;
|
|
1013
|
+
color: #75b798;
|
|
1014
|
+
}
|
|
1015
|
+
|
|
1016
|
+
[data-bs-theme="dark"] .alert-warning {
|
|
1017
|
+
background-color: rgba(255, 193, 7, 0.15);
|
|
1018
|
+
border-left-color: #ffc107;
|
|
1019
|
+
color: #ffda6a;
|
|
1020
|
+
}
|
|
1021
|
+
|
|
482
1022
|
/* Background colors for card headers in dark mode */
|
|
483
1023
|
[data-bs-theme="dark"] .bg-danger-subtle {
|
|
484
1024
|
background-color: rgba(220, 53, 69, 0.2) !important;
|
|
@@ -552,23 +1092,142 @@
|
|
|
552
1092
|
background-color: var(--bs-light);
|
|
553
1093
|
}
|
|
554
1094
|
|
|
555
|
-
/*
|
|
1095
|
+
/* Enhanced stat cards and metric icons */
|
|
1096
|
+
.stat-card-bg {
|
|
1097
|
+
background: #ffffff;
|
|
1098
|
+
border-radius: 0.75rem;
|
|
1099
|
+
box-shadow: 0 2px 12px rgba(0, 0, 0, 0.04);
|
|
1100
|
+
transition: all 0.3s ease;
|
|
1101
|
+
border: none;
|
|
1102
|
+
}
|
|
1103
|
+
|
|
1104
|
+
.stat-card-bg:hover {
|
|
1105
|
+
transform: translateY(-3px);
|
|
1106
|
+
box-shadow: 0 5px 15px rgba(0, 0, 0, 0.08);
|
|
1107
|
+
}
|
|
1108
|
+
|
|
1109
|
+
[data-bs-theme="dark"] .stat-card-bg {
|
|
1110
|
+
background-color: #212529;
|
|
1111
|
+
box-shadow: 0 2px 12px rgba(0, 0, 0, 0.1);
|
|
1112
|
+
}
|
|
1113
|
+
|
|
1114
|
+
/* Enhanced metric icon styling */
|
|
556
1115
|
.metric-icon {
|
|
557
1116
|
display: flex;
|
|
558
1117
|
align-items: center;
|
|
559
1118
|
justify-content: center;
|
|
560
|
-
border-radius:
|
|
561
|
-
width:
|
|
562
|
-
height:
|
|
563
|
-
min-width:
|
|
1119
|
+
border-radius: 14px;
|
|
1120
|
+
width: 65px;
|
|
1121
|
+
height: 65px;
|
|
1122
|
+
min-width: 65px;
|
|
564
1123
|
text-align: center;
|
|
565
|
-
background
|
|
1124
|
+
background: linear-gradient(135deg, rgba(var(--bs-primary-rgb), 0.2) 0%, rgba(var(--bs-primary-rgb), 0.1) 100%);
|
|
566
1125
|
color: var(--bs-primary);
|
|
1126
|
+
font-size: 1.6rem;
|
|
1127
|
+
transition: all 0.3s ease;
|
|
1128
|
+
box-shadow: 0 3px 10px rgba(var(--bs-primary-rgb), 0.1);
|
|
1129
|
+
}
|
|
1130
|
+
|
|
1131
|
+
.stat-card-bg:hover .metric-icon {
|
|
1132
|
+
transform: scale(1.05);
|
|
567
1133
|
}
|
|
568
1134
|
|
|
569
1135
|
[data-bs-theme="dark"] .metric-icon {
|
|
570
|
-
background
|
|
1136
|
+
background: linear-gradient(135deg, rgba(13, 110, 253, 0.3) 0%, rgba(13, 110, 253, 0.15) 100%);
|
|
571
1137
|
color: #6ea8fe;
|
|
1138
|
+
box-shadow: 0 3px 10px rgba(13, 110, 253, 0.15);
|
|
1139
|
+
}
|
|
1140
|
+
|
|
1141
|
+
/* Enhanced navbar toggler */
|
|
1142
|
+
.navbar-toggler {
|
|
1143
|
+
border: none;
|
|
1144
|
+
padding: 0.25rem 0.5rem;
|
|
1145
|
+
background-color: rgba(255, 255, 255, 0.1);
|
|
1146
|
+
border-radius: 6px;
|
|
1147
|
+
transition: all 0.2s ease;
|
|
1148
|
+
margin-right: 0.5rem;
|
|
1149
|
+
}
|
|
1150
|
+
|
|
1151
|
+
.navbar-toggler:focus {
|
|
1152
|
+
box-shadow: 0 0 0 3px rgba(255, 255, 255, 0.25);
|
|
1153
|
+
}
|
|
1154
|
+
|
|
1155
|
+
.navbar-toggler:hover {
|
|
1156
|
+
background-color: rgba(255, 255, 255, 0.15);
|
|
1157
|
+
}
|
|
1158
|
+
|
|
1159
|
+
.navbar-toggler-icon {
|
|
1160
|
+
width: 1.2em;
|
|
1161
|
+
height: 1.2em;
|
|
1162
|
+
}
|
|
1163
|
+
|
|
1164
|
+
/* Page transitions and animations */
|
|
1165
|
+
.dbviewer-main-content {
|
|
1166
|
+
animation: fadeInContent 0.4s ease-out;
|
|
1167
|
+
}
|
|
1168
|
+
|
|
1169
|
+
@keyframes fadeInContent {
|
|
1170
|
+
from {
|
|
1171
|
+
opacity: 0;
|
|
1172
|
+
transform: translateY(10px);
|
|
1173
|
+
}
|
|
1174
|
+
to {
|
|
1175
|
+
opacity: 1;
|
|
1176
|
+
transform: translateY(0);
|
|
1177
|
+
}
|
|
1178
|
+
}
|
|
1179
|
+
|
|
1180
|
+
/* Subtle hover animations */
|
|
1181
|
+
.nav-link, .list-group-item, .btn, .card, a {
|
|
1182
|
+
transition: all 0.2s ease;
|
|
1183
|
+
}
|
|
1184
|
+
|
|
1185
|
+
/* Improved table hover effect */
|
|
1186
|
+
.table-hover > tbody > tr:hover {
|
|
1187
|
+
transition: all 0.15s ease;
|
|
1188
|
+
}
|
|
1189
|
+
|
|
1190
|
+
[data-bs-theme="light"] .table-hover > tbody > tr:hover {
|
|
1191
|
+
background-color: rgba(13, 110, 253, 0.04);
|
|
1192
|
+
}
|
|
1193
|
+
|
|
1194
|
+
[data-bs-theme="dark"] .table-hover > tbody > tr:hover {
|
|
1195
|
+
background-color: rgba(13, 110, 253, 0.07);
|
|
1196
|
+
}
|
|
1197
|
+
|
|
1198
|
+
/* Button press effect */
|
|
1199
|
+
.btn:active, .nav-link:active, .list-group-item:active {
|
|
1200
|
+
transform: scale(0.97);
|
|
1201
|
+
}
|
|
1202
|
+
|
|
1203
|
+
/* Focus styles for accessibility */
|
|
1204
|
+
:focus-visible {
|
|
1205
|
+
outline: 3px solid rgba(13, 110, 253, 0.25);
|
|
1206
|
+
outline-offset: 2px;
|
|
1207
|
+
border-radius: 4px;
|
|
1208
|
+
}
|
|
1209
|
+
|
|
1210
|
+
/* Improved scrollbar for the entire app */
|
|
1211
|
+
html {
|
|
1212
|
+
scrollbar-width: thin;
|
|
1213
|
+
scrollbar-color: rgba(0, 0, 0, 0.2) transparent;
|
|
1214
|
+
}
|
|
1215
|
+
|
|
1216
|
+
html::-webkit-scrollbar {
|
|
1217
|
+
width: 8px;
|
|
1218
|
+
}
|
|
1219
|
+
|
|
1220
|
+
html::-webkit-scrollbar-track {
|
|
1221
|
+
background: transparent;
|
|
1222
|
+
}
|
|
1223
|
+
|
|
1224
|
+
html::-webkit-scrollbar-thumb {
|
|
1225
|
+
background-color: rgba(0, 0, 0, 0.2);
|
|
1226
|
+
border-radius: 10px;
|
|
1227
|
+
}
|
|
1228
|
+
|
|
1229
|
+
[data-bs-theme="dark"] html::-webkit-scrollbar-thumb {
|
|
1230
|
+
background-color: rgba(255, 255, 255, 0.2);
|
|
572
1231
|
}
|
|
573
1232
|
</style>
|
|
574
1233
|
</head>
|
data/lib/dbviewer/version.rb
CHANGED
metadata
CHANGED
|
@@ -1,14 +1,14 @@
|
|
|
1
1
|
--- !ruby/object:Gem::Specification
|
|
2
2
|
name: dbviewer
|
|
3
3
|
version: !ruby/object:Gem::Version
|
|
4
|
-
version: 0.
|
|
4
|
+
version: 0.4.1
|
|
5
5
|
platform: ruby
|
|
6
6
|
authors:
|
|
7
7
|
- Wailan Tirajoh
|
|
8
8
|
autorequire:
|
|
9
9
|
bindir: bin
|
|
10
10
|
cert_chain: []
|
|
11
|
-
date: 2025-05-
|
|
11
|
+
date: 2025-05-24 00:00:00.000000000 Z
|
|
12
12
|
dependencies:
|
|
13
13
|
- !ruby/object:Gem::Dependency
|
|
14
14
|
name: rails
|