sqlite-hub 0.9.0 → 0.9.3
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.
- package/changelog.md +12 -0
- package/frontend/index.html +21 -20
- package/frontend/js/app.js +386 -8
- package/frontend/js/components/modal.js +13 -4
- package/frontend/js/components/queryHistoryDetail.js +14 -2
- package/frontend/js/components/queryHistoryPanel.js +13 -9
- package/frontend/js/components/rowEditorPanel.js +48 -25
- package/frontend/js/lib/queryChartOptions.js +5 -1
- package/frontend/js/lib/queryCharts.js +50 -2
- package/frontend/js/store.js +177 -21
- package/frontend/js/views/charts.js +103 -30
- package/frontend/js/views/data.js +31 -1
- package/frontend/js/views/editor.js +1 -0
- package/frontend/js/views/mediaTagging.js +146 -76
- package/frontend/styles/base.css +57 -13
- package/frontend/styles/components.css +172 -96
- package/frontend/styles/layout.css +1 -1
- package/frontend/styles/structure-graph.css +11 -11
- package/frontend/styles/tokens.css +47 -4
- package/frontend/styles/utilities.css +21 -0
- package/frontend/styles/views.css +218 -96
- package/package.json +1 -1
- package/server/services/storage/appStateStore.js +9 -6
- package/server/services/storage/queryHistoryChartUtils.js +19 -2
- package/server/services/storage/queryHistoryUtils.js +165 -2
- package/shortkeys.md +5 -0
|
@@ -55,14 +55,14 @@
|
|
|
55
55
|
}
|
|
56
56
|
|
|
57
57
|
.structure-graph__toolbar .standard-button.is-active {
|
|
58
|
-
background:
|
|
59
|
-
border-color:
|
|
58
|
+
background: var(--primary-alpha-12);
|
|
59
|
+
border-color: rgb(var(--rgb-primary) / 0.38);
|
|
60
60
|
color: var(--color-primary-container);
|
|
61
61
|
}
|
|
62
62
|
|
|
63
63
|
.structure-graph__toolbar .standard-button:disabled,
|
|
64
64
|
.structure-graph__section-header .standard-button:disabled {
|
|
65
|
-
border-color:
|
|
65
|
+
border-color: var(--border-medium);
|
|
66
66
|
color: rgba(231, 223, 189, 0.34);
|
|
67
67
|
}
|
|
68
68
|
|
|
@@ -81,7 +81,7 @@
|
|
|
81
81
|
background:
|
|
82
82
|
linear-gradient(rgba(138, 123, 52, 0.09) 1px, transparent 1px),
|
|
83
83
|
linear-gradient(90deg, rgba(138, 123, 52, 0.08) 1px, transparent 1px),
|
|
84
|
-
radial-gradient(circle at top left,
|
|
84
|
+
radial-gradient(circle at top left, rgb(var(--rgb-primary) / 0.14), transparent 30%),
|
|
85
85
|
radial-gradient(circle at bottom right, rgba(45, 250, 255, 0.1), transparent 24%),
|
|
86
86
|
linear-gradient(to bottom, rgba(27, 27, 24, 0.99), rgba(9, 10, 11, 0.99));
|
|
87
87
|
background-size: 28px 28px, 28px 28px, auto, auto, auto;
|
|
@@ -109,7 +109,7 @@
|
|
|
109
109
|
}
|
|
110
110
|
|
|
111
111
|
.structure-graph__empty-icon {
|
|
112
|
-
color:
|
|
112
|
+
color: rgb(var(--rgb-primary) / 0.42);
|
|
113
113
|
font-size: 2.25rem;
|
|
114
114
|
}
|
|
115
115
|
|
|
@@ -275,8 +275,8 @@
|
|
|
275
275
|
}
|
|
276
276
|
|
|
277
277
|
.structure-graph__flag.is-key {
|
|
278
|
-
background:
|
|
279
|
-
border-color:
|
|
278
|
+
background: var(--primary-alpha-18);
|
|
279
|
+
border-color: rgb(var(--rgb-primary) / 0.34);
|
|
280
280
|
color: #fff6ae;
|
|
281
281
|
}
|
|
282
282
|
|
|
@@ -298,7 +298,7 @@
|
|
|
298
298
|
|
|
299
299
|
.structure-graph__list-item {
|
|
300
300
|
align-items: center;
|
|
301
|
-
color:
|
|
301
|
+
color: rgb(var(--rgb-on-surface) / 0.82);
|
|
302
302
|
display: flex;
|
|
303
303
|
justify-content: space-between;
|
|
304
304
|
gap: 0.75rem;
|
|
@@ -324,8 +324,8 @@
|
|
|
324
324
|
}
|
|
325
325
|
|
|
326
326
|
.structure-entry--graph-active {
|
|
327
|
-
border-color:
|
|
328
|
-
box-shadow: inset 0 0 0 1px
|
|
327
|
+
border-color: rgb(var(--rgb-primary) / 0.44);
|
|
328
|
+
box-shadow: inset 0 0 0 1px var(--primary-alpha-18);
|
|
329
329
|
}
|
|
330
330
|
|
|
331
331
|
.structure-entry--graph-related {
|
|
@@ -340,7 +340,7 @@
|
|
|
340
340
|
|
|
341
341
|
.structure-graph__inspector {
|
|
342
342
|
border-left: 0;
|
|
343
|
-
border-top: 1px solid
|
|
343
|
+
border-top: 1px solid var(--border-medium);
|
|
344
344
|
max-height: 28rem;
|
|
345
345
|
}
|
|
346
346
|
}
|
|
@@ -1,11 +1,31 @@
|
|
|
1
1
|
:root {
|
|
2
|
+
--rgb-primary: 252 227 0;
|
|
3
|
+
--rgb-outline: 75 71 50;
|
|
4
|
+
--rgb-on-surface: 229 226 225;
|
|
5
|
+
--rgb-on-surface-variant: 205 199 171;
|
|
6
|
+
--rgb-background: 19 19 19;
|
|
7
|
+
--rgb-surface: 19 19 19;
|
|
8
|
+
--rgb-surface-lowest: 14 14 14;
|
|
9
|
+
--rgb-surface-low: 28 27 27;
|
|
10
|
+
--rgb-surface-container: 32 31 31;
|
|
11
|
+
--rgb-surface-high: 42 42 42;
|
|
12
|
+
--rgb-surface-highest: 53 53 52;
|
|
13
|
+
--rgb-surface-bright: 58 57 57;
|
|
14
|
+
--rgb-error: 255 180 171;
|
|
15
|
+
--rgb-error-container: 147 0 10;
|
|
16
|
+
--rgb-tertiary: 0 220 225;
|
|
17
|
+
--rgb-success: 34 197 94;
|
|
2
18
|
--color-background: #131313;
|
|
3
19
|
--color-surface: #131313;
|
|
4
20
|
--color-surface-lowest: #0e0e0e;
|
|
21
|
+
--color-surface-container-lowest: var(--color-surface-lowest);
|
|
5
22
|
--color-surface-low: #1c1b1b;
|
|
23
|
+
--color-surface-container-low: var(--color-surface-low);
|
|
6
24
|
--color-surface-container: #201f1f;
|
|
7
25
|
--color-surface-high: #2a2a2a;
|
|
26
|
+
--color-surface-container-high: var(--color-surface-high);
|
|
8
27
|
--color-surface-highest: #353534;
|
|
28
|
+
--color-surface-container-highest: var(--color-surface-highest);
|
|
9
29
|
--color-surface-bright: #3a3939;
|
|
10
30
|
--color-primary-container: #fce300;
|
|
11
31
|
--color-primary-fixed: #fde403;
|
|
@@ -16,8 +36,31 @@
|
|
|
16
36
|
--color-error: #ffb4ab;
|
|
17
37
|
--color-error-container: #93000a;
|
|
18
38
|
--color-tertiary-dim: #00dce1;
|
|
19
|
-
--color-grid-dot:
|
|
39
|
+
--color-grid-dot: rgb(var(--rgb-primary) / 0.03);
|
|
20
40
|
--color-success: #22c55e;
|
|
41
|
+
--border-subtle: rgb(var(--rgb-outline) / 0.12);
|
|
42
|
+
--border-medium: rgb(var(--rgb-outline) / 0.18);
|
|
43
|
+
--border-strong: rgb(var(--rgb-outline) / 0.24);
|
|
44
|
+
--text-muted: rgb(var(--rgb-on-surface) / 0.6);
|
|
45
|
+
--text-subtle: rgb(var(--rgb-on-surface) / 0.45);
|
|
46
|
+
--text-faint: rgb(var(--rgb-on-surface) / 0.35);
|
|
47
|
+
--text-variant-muted: rgb(var(--rgb-on-surface-variant) / 0.55);
|
|
48
|
+
--text-variant-subtle: rgb(var(--rgb-on-surface-variant) / 0.45);
|
|
49
|
+
--primary-alpha-03: rgb(var(--rgb-primary) / 0.03);
|
|
50
|
+
--primary-alpha-05: rgb(var(--rgb-primary) / 0.05);
|
|
51
|
+
--primary-alpha-06: rgb(var(--rgb-primary) / 0.06);
|
|
52
|
+
--primary-alpha-08: rgb(var(--rgb-primary) / 0.08);
|
|
53
|
+
--primary-alpha-10: rgb(var(--rgb-primary) / 0.1);
|
|
54
|
+
--primary-alpha-12: rgb(var(--rgb-primary) / 0.12);
|
|
55
|
+
--primary-alpha-15: rgb(var(--rgb-primary) / 0.15);
|
|
56
|
+
--primary-alpha-18: rgb(var(--rgb-primary) / 0.18);
|
|
57
|
+
--primary-alpha-20: rgb(var(--rgb-primary) / 0.2);
|
|
58
|
+
--primary-alpha-22: rgb(var(--rgb-primary) / 0.22);
|
|
59
|
+
--primary-alpha-24: rgb(var(--rgb-primary) / 0.24);
|
|
60
|
+
--primary-alpha-30: rgb(var(--rgb-primary) / 0.3);
|
|
61
|
+
--primary-alpha-35: rgb(var(--rgb-primary) / 0.35);
|
|
62
|
+
--focus-ring: 0 0 0 2px var(--color-surface), 0 0 0 4px var(--primary-alpha-30);
|
|
63
|
+
--focus-ring-inset: inset 0 0 0 1px var(--primary-alpha-30), 0 0 0 2px var(--primary-alpha-12);
|
|
21
64
|
--font-family-headline: "Space Grotesk", sans-serif;
|
|
22
65
|
--font-family-body: "Inter", sans-serif;
|
|
23
66
|
--font-family-mono: "Roboto Mono", monospace;
|
|
@@ -41,9 +84,9 @@
|
|
|
41
84
|
--sidebar-width: 256px;
|
|
42
85
|
--panel-width: 480px;
|
|
43
86
|
--shadow-sidebar: 4px 0 0 0 #131313;
|
|
44
|
-
--shadow-panel: -20px 0 60px
|
|
45
|
-
--shadow-subtle-glow: 0 0 15px
|
|
46
|
-
--shadow-strong-glow: 0 0 20px
|
|
87
|
+
--shadow-panel: -20px 0 60px rgb(0 0 0 / 0.8);
|
|
88
|
+
--shadow-subtle-glow: 0 0 15px var(--primary-alpha-30);
|
|
89
|
+
--shadow-strong-glow: 0 0 20px var(--primary-alpha-30);
|
|
47
90
|
--transition-fast: 150ms ease;
|
|
48
91
|
--transition-standard: 300ms ease;
|
|
49
92
|
--duration-cursor-blink: 1s;
|
|
@@ -0,0 +1,21 @@
|
|
|
1
|
+
.truncate {
|
|
2
|
+
overflow: hidden;
|
|
3
|
+
text-overflow: ellipsis;
|
|
4
|
+
white-space: nowrap;
|
|
5
|
+
}
|
|
6
|
+
|
|
7
|
+
.text-muted {
|
|
8
|
+
color: var(--text-muted);
|
|
9
|
+
}
|
|
10
|
+
|
|
11
|
+
.text-subtle {
|
|
12
|
+
color: var(--text-subtle);
|
|
13
|
+
}
|
|
14
|
+
|
|
15
|
+
.border-subtle {
|
|
16
|
+
border-color: var(--border-subtle);
|
|
17
|
+
}
|
|
18
|
+
|
|
19
|
+
.border-medium {
|
|
20
|
+
border-color: var(--border-medium);
|
|
21
|
+
}
|