cowork-dash 0.1.8__py3-none-any.whl → 0.2.0__py3-none-any.whl
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.
- cowork_dash/agent.py +32 -11
- cowork_dash/app.py +888 -81
- cowork_dash/assets/app.js +34 -0
- cowork_dash/assets/styles.css +788 -697
- cowork_dash/canvas.py +8 -0
- cowork_dash/cli.py +9 -0
- cowork_dash/components.py +398 -55
- cowork_dash/config.py +12 -1
- cowork_dash/file_utils.py +65 -9
- cowork_dash/layout.py +2 -2
- cowork_dash/sandbox.py +361 -0
- cowork_dash/tools.py +734 -79
- {cowork_dash-0.1.8.dist-info → cowork_dash-0.2.0.dist-info}/METADATA +1 -1
- cowork_dash-0.2.0.dist-info/RECORD +23 -0
- cowork_dash-0.1.8.dist-info/RECORD +0 -22
- {cowork_dash-0.1.8.dist-info → cowork_dash-0.2.0.dist-info}/WHEEL +0 -0
- {cowork_dash-0.1.8.dist-info → cowork_dash-0.2.0.dist-info}/entry_points.txt +0 -0
- {cowork_dash-0.1.8.dist-info → cowork_dash-0.2.0.dist-info}/licenses/LICENSE +0 -0
cowork_dash/assets/styles.css
CHANGED
|
@@ -1,6 +1,55 @@
|
|
|
1
|
-
/*
|
|
2
|
-
|
|
1
|
+
/* ============================================
|
|
2
|
+
Cowork Dash - Minimal Professional Design
|
|
3
|
+
Clean, elegant, distraction-free interface
|
|
4
|
+
============================================ */
|
|
5
|
+
|
|
6
|
+
@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600&family=JetBrains+Mono:wght@400;500&display=swap');
|
|
7
|
+
|
|
8
|
+
/* ============================================
|
|
9
|
+
CSS Variables - Neutral Palette
|
|
10
|
+
============================================ */
|
|
11
|
+
:root {
|
|
12
|
+
--bg-primary: #fafafa;
|
|
13
|
+
--bg-secondary: #ffffff;
|
|
14
|
+
--bg-tertiary: #f5f5f5;
|
|
15
|
+
--border-subtle: #e5e5e5;
|
|
16
|
+
--border-muted: #ebebeb;
|
|
17
|
+
--text-primary: #171717;
|
|
18
|
+
--text-secondary: #525252;
|
|
19
|
+
--text-muted: #a3a3a3;
|
|
20
|
+
--accent-blue: #3b82f6;
|
|
21
|
+
--accent-green: #22c55e;
|
|
22
|
+
--accent-amber: #f59e0b;
|
|
23
|
+
--accent-red: #ef4444;
|
|
24
|
+
--accent-purple: #8b5cf6;
|
|
25
|
+
--shadow-sm: 0 1px 2px rgba(0,0,0,0.04);
|
|
26
|
+
--shadow-md: 0 2px 4px rgba(0,0,0,0.06);
|
|
27
|
+
--radius-sm: 4px;
|
|
28
|
+
--radius-md: 6px;
|
|
29
|
+
--transition-fast: 0.1s ease;
|
|
30
|
+
}
|
|
31
|
+
|
|
32
|
+
[data-mantine-color-scheme="dark"] {
|
|
33
|
+
--bg-primary: #1a1b1e;
|
|
34
|
+
--bg-secondary: #25262b;
|
|
35
|
+
--bg-tertiary: #2c2e33;
|
|
36
|
+
--border-subtle: #373a40;
|
|
37
|
+
--border-muted: #2e3035;
|
|
38
|
+
--text-primary: #f1f3f5;
|
|
39
|
+
--text-secondary: #a6a7ab;
|
|
40
|
+
--text-muted: #5c5f66;
|
|
41
|
+
--accent-blue: #74c0fc;
|
|
42
|
+
--accent-green: #69db7c;
|
|
43
|
+
--accent-amber: #ffd43b;
|
|
44
|
+
--accent-red: #ff8787;
|
|
45
|
+
--accent-purple: #b197fc;
|
|
46
|
+
--shadow-sm: 0 1px 2px rgba(0,0,0,0.25);
|
|
47
|
+
--shadow-md: 0 2px 6px rgba(0,0,0,0.35);
|
|
48
|
+
}
|
|
3
49
|
|
|
50
|
+
/* ============================================
|
|
51
|
+
Base Reset & Typography
|
|
52
|
+
============================================ */
|
|
4
53
|
* {
|
|
5
54
|
margin: 0;
|
|
6
55
|
padding: 0;
|
|
@@ -8,245 +57,170 @@
|
|
|
8
57
|
}
|
|
9
58
|
|
|
10
59
|
body {
|
|
11
|
-
font-family: '
|
|
12
|
-
background: var(--
|
|
13
|
-
color: var(--
|
|
14
|
-
line-height: 1.
|
|
15
|
-
font-size:
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
[data-mantine-color-scheme="dark"] body {
|
|
19
|
-
background: var(--mantine-color-dark-7, #1a1b1e);
|
|
20
|
-
color: var(--mantine-color-dark-0, #c1c2c5);
|
|
60
|
+
font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
|
|
61
|
+
background: var(--bg-primary);
|
|
62
|
+
color: var(--text-primary);
|
|
63
|
+
line-height: 1.5;
|
|
64
|
+
font-size: 14px;
|
|
65
|
+
-webkit-font-smoothing: antialiased;
|
|
66
|
+
-moz-osx-font-smoothing: grayscale;
|
|
21
67
|
}
|
|
22
68
|
|
|
23
69
|
code, pre, .mono {
|
|
24
|
-
font-family: '
|
|
25
|
-
font-size:
|
|
70
|
+
font-family: 'JetBrains Mono', 'SF Mono', 'Monaco', monospace;
|
|
71
|
+
font-size: 13px;
|
|
26
72
|
}
|
|
27
73
|
|
|
28
|
-
/*
|
|
29
|
-
|
|
30
|
-
|
|
74
|
+
/* ============================================
|
|
75
|
+
Animations - Subtle & Fast
|
|
76
|
+
============================================ */
|
|
77
|
+
@keyframes fadeIn {
|
|
78
|
+
from { opacity: 0; transform: translateY(2px); }
|
|
31
79
|
to { opacity: 1; transform: translateY(0); }
|
|
32
80
|
}
|
|
33
|
-
.message-enter { animation: slideIn 0.15s ease forwards; }
|
|
34
81
|
|
|
35
82
|
@keyframes pulse {
|
|
36
83
|
0%, 100% { opacity: 1; }
|
|
37
84
|
50% { opacity: 0.5; }
|
|
38
85
|
}
|
|
39
|
-
.thinking-pulse { animation: pulse 1.2s ease-in-out infinite; }
|
|
40
86
|
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
|
|
87
|
+
.message-enter { animation: fadeIn 0.15s ease forwards; }
|
|
88
|
+
.thinking-pulse { animation: pulse 1.5s ease-in-out infinite; }
|
|
89
|
+
|
|
90
|
+
/* ============================================
|
|
91
|
+
Chat Panel
|
|
92
|
+
============================================ */
|
|
93
|
+
#chat-panel {
|
|
94
|
+
background: var(--bg-primary);
|
|
45
95
|
}
|
|
46
|
-
.loading-dots::after { content: ''; animation: dots 1.2s steps(1, end) infinite; }
|
|
47
96
|
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
|
|
51
|
-
.todo-item { display: flex; align-items: flex-start; gap: 5px; padding: 3px 0; }
|
|
97
|
+
#chat-messages {
|
|
98
|
+
background: var(--bg-primary);
|
|
99
|
+
}
|
|
52
100
|
|
|
53
|
-
/*
|
|
54
|
-
|
|
55
|
-
|
|
56
|
-
|
|
57
|
-
|
|
58
|
-
|
|
59
|
-
|
|
60
|
-
|
|
61
|
-
font-size: 10px;
|
|
101
|
+
/* ============================================
|
|
102
|
+
Chat Messages - Clean Cards
|
|
103
|
+
============================================ */
|
|
104
|
+
.chat-message {
|
|
105
|
+
padding: 12px 14px;
|
|
106
|
+
background: var(--bg-secondary);
|
|
107
|
+
border-radius: var(--radius-md);
|
|
108
|
+
margin-bottom: 8px;
|
|
62
109
|
}
|
|
63
|
-
|
|
64
|
-
|
|
110
|
+
|
|
111
|
+
.chat-message-user {
|
|
112
|
+
background: var(--bg-tertiary);
|
|
113
|
+
border-left: 2px solid var(--accent-blue);
|
|
65
114
|
}
|
|
66
|
-
|
|
67
|
-
|
|
115
|
+
|
|
116
|
+
.chat-message-agent {
|
|
117
|
+
background: var(--bg-secondary);
|
|
118
|
+
border-left: 2px solid var(--accent-green);
|
|
68
119
|
}
|
|
69
120
|
|
|
70
|
-
|
|
121
|
+
.chat-message-loading {
|
|
122
|
+
background: var(--bg-secondary);
|
|
123
|
+
border-left: 2px solid var(--accent-purple);
|
|
124
|
+
padding: 12px 14px;
|
|
125
|
+
}
|
|
126
|
+
|
|
127
|
+
/* Message Labels */
|
|
128
|
+
.message-role-user { color: var(--accent-blue); font-weight: 500; }
|
|
129
|
+
.message-role-agent { color: var(--accent-green); font-weight: 500; }
|
|
130
|
+
.message-time { color: var(--text-muted); font-size: 12px; }
|
|
131
|
+
.thinking-text { color: var(--accent-purple); }
|
|
132
|
+
|
|
133
|
+
/* ============================================
|
|
134
|
+
Markdown Content
|
|
135
|
+
============================================ */
|
|
71
136
|
#chat-messages .markdown {
|
|
72
|
-
padding:
|
|
137
|
+
padding: 4px 0;
|
|
73
138
|
}
|
|
139
|
+
|
|
74
140
|
#chat-messages h2 {
|
|
75
|
-
font-size:
|
|
141
|
+
font-size: 15px;
|
|
76
142
|
font-weight: 600;
|
|
77
|
-
margin:
|
|
78
|
-
color: var(--
|
|
143
|
+
margin: 12px 0 6px;
|
|
144
|
+
color: var(--text-primary);
|
|
79
145
|
}
|
|
146
|
+
|
|
80
147
|
#chat-messages h3 {
|
|
81
|
-
font-size:
|
|
148
|
+
font-size: 14px;
|
|
82
149
|
font-weight: 600;
|
|
83
|
-
margin:
|
|
84
|
-
color: var(--
|
|
150
|
+
margin: 10px 0 4px;
|
|
151
|
+
color: var(--text-primary);
|
|
85
152
|
}
|
|
153
|
+
|
|
154
|
+
#chat-messages p {
|
|
155
|
+
margin: 6px 0;
|
|
156
|
+
line-height: 1.6;
|
|
157
|
+
}
|
|
158
|
+
|
|
86
159
|
#chat-messages ul, #chat-messages ol {
|
|
87
|
-
margin:
|
|
160
|
+
margin: 6px 0;
|
|
88
161
|
padding-left: 20px;
|
|
89
|
-
line-height: 1.5;
|
|
90
162
|
}
|
|
163
|
+
|
|
91
164
|
#chat-messages li {
|
|
92
165
|
margin: 3px 0;
|
|
93
166
|
}
|
|
94
|
-
|
|
95
|
-
margin: 5px 0;
|
|
96
|
-
line-height: 1.5;
|
|
97
|
-
}
|
|
167
|
+
|
|
98
168
|
#chat-messages strong {
|
|
99
169
|
font-weight: 600;
|
|
100
|
-
color: var(--
|
|
170
|
+
color: var(--text-primary);
|
|
101
171
|
}
|
|
172
|
+
|
|
102
173
|
#chat-messages code {
|
|
103
|
-
background: var(--
|
|
104
|
-
padding:
|
|
174
|
+
background: var(--bg-tertiary);
|
|
175
|
+
padding: 2px 6px;
|
|
105
176
|
border-radius: 3px;
|
|
106
|
-
font-
|
|
107
|
-
font-size: 14px;
|
|
177
|
+
font-size: 13px;
|
|
108
178
|
}
|
|
179
|
+
|
|
109
180
|
#chat-messages pre {
|
|
110
|
-
background: var(--
|
|
111
|
-
padding:
|
|
112
|
-
border-radius:
|
|
181
|
+
background: var(--bg-tertiary);
|
|
182
|
+
padding: 12px;
|
|
183
|
+
border-radius: var(--radius-sm);
|
|
113
184
|
overflow-x: auto;
|
|
114
|
-
margin:
|
|
185
|
+
margin: 8px 0;
|
|
115
186
|
}
|
|
187
|
+
|
|
116
188
|
#chat-messages pre code {
|
|
117
189
|
background: none;
|
|
118
190
|
padding: 0;
|
|
119
191
|
}
|
|
120
192
|
|
|
121
|
-
/*
|
|
122
|
-
|
|
123
|
-
|
|
124
|
-
}
|
|
125
|
-
.breadcrumb-item {
|
|
126
|
-
transition: background 0.15s ease;
|
|
127
|
-
}
|
|
128
|
-
.breadcrumb-clickable:hover {
|
|
129
|
-
background: var(--mantine-color-blue-light) !important;
|
|
130
|
-
}
|
|
131
|
-
.breadcrumb-separator {
|
|
132
|
-
user-select: none;
|
|
133
|
-
}
|
|
134
|
-
[data-mantine-color-scheme="dark"] .breadcrumb-bar {
|
|
135
|
-
background: var(--mantine-color-dark-6) !important;
|
|
136
|
-
}
|
|
137
|
-
|
|
138
|
-
/* Folder selection styles */
|
|
139
|
-
.folder-select-target {
|
|
140
|
-
transition: background 0.15s ease;
|
|
141
|
-
}
|
|
142
|
-
|
|
143
|
-
.folder-expand-toggle {
|
|
144
|
-
opacity: 0.6;
|
|
145
|
-
transition: opacity 0.15s ease;
|
|
146
|
-
}
|
|
147
|
-
.folder-expand-toggle:hover {
|
|
148
|
-
opacity: 1;
|
|
149
|
-
}
|
|
150
|
-
|
|
151
|
-
/* Dark mode - breadcrumb */
|
|
152
|
-
[data-mantine-color-scheme="dark"] .breadcrumb-clickable:hover {
|
|
153
|
-
background: var(--mantine-color-dark-5) !important;
|
|
154
|
-
}
|
|
155
|
-
|
|
156
|
-
/* Dark mode - input/summary/chat */
|
|
157
|
-
[data-mantine-color-scheme="dark"] .file-item:hover { background: var(--mantine-color-dark-5) !important; }
|
|
158
|
-
[data-mantine-color-scheme="dark"] .folder-header:hover { background: var(--mantine-color-dark-5) !important; }
|
|
159
|
-
[data-mantine-color-scheme="dark"] details summary:hover { background: var(--mantine-color-dark-5) !important; }
|
|
160
|
-
[data-mantine-color-scheme="dark"] .send-btn:hover:not(:disabled) { background: var(--mantine-color-blue-7) !important; }
|
|
161
|
-
[data-mantine-color-scheme="dark"] .chat-input:focus { border-color: var(--mantine-color-blue-6) !important; box-shadow: 0 0 0 1px var(--mantine-color-blue-9) !important; }
|
|
162
|
-
[data-mantine-color-scheme="dark"] #chat-messages h2,
|
|
163
|
-
[data-mantine-color-scheme="dark"] #chat-messages h3 { color: var(--mantine-color-dark-0); }
|
|
164
|
-
[data-mantine-color-scheme="dark"] #chat-messages strong { color: var(--mantine-color-dark-0); }
|
|
165
|
-
[data-mantine-color-scheme="dark"] #chat-messages code {
|
|
166
|
-
background: var(--mantine-color-dark-6);
|
|
167
|
-
color: var(--mantine-color-dark-0);
|
|
168
|
-
}
|
|
169
|
-
[data-mantine-color-scheme="dark"] #chat-messages pre {
|
|
170
|
-
background: var(--mantine-color-dark-6);
|
|
171
|
-
color: var(--mantine-color-dark-0);
|
|
172
|
-
}
|
|
173
|
-
[data-mantine-color-scheme="dark"] #chat-messages pre code {
|
|
174
|
-
color: var(--mantine-color-dark-0);
|
|
175
|
-
}
|
|
176
|
-
|
|
177
|
-
/* DMC Theme Integration */
|
|
178
|
-
:root {
|
|
179
|
-
--app-bg-primary: var(--mantine-color-body);
|
|
180
|
-
--app-bg-secondary: var(--mantine-color-gray-0);
|
|
181
|
-
--app-border: var(--mantine-color-default-border);
|
|
182
|
-
--app-text-primary: var(--mantine-color-text);
|
|
183
|
-
--app-text-muted: var(--mantine-color-dimmed);
|
|
184
|
-
}
|
|
185
|
-
|
|
186
|
-
[data-mantine-color-scheme="dark"] {
|
|
187
|
-
--app-bg-secondary: var(--mantine-color-dark-7);
|
|
188
|
-
}
|
|
189
|
-
|
|
190
|
-
/* Code and Preformatted Text */
|
|
191
|
-
code, pre {
|
|
192
|
-
font-family: 'IBM Plex Mono', 'Monaco', 'Courier New', monospace;
|
|
193
|
-
background: #f1f3f4;
|
|
194
|
-
padding: 1px 5px;
|
|
195
|
-
border-radius: 3px;
|
|
196
|
-
font-size: 14px;
|
|
197
|
-
}
|
|
198
|
-
|
|
199
|
-
pre {
|
|
200
|
-
padding: 10px;
|
|
201
|
-
overflow-x: auto;
|
|
202
|
-
border-radius: 4px;
|
|
203
|
-
border: 1px solid #e8eaed;
|
|
204
|
-
}
|
|
205
|
-
|
|
206
|
-
/* DataFrames */
|
|
207
|
-
.dataframe-table {
|
|
208
|
-
width: 100%;
|
|
209
|
-
border-collapse: collapse;
|
|
210
|
-
font-size: 14px;
|
|
211
|
-
}
|
|
212
|
-
|
|
213
|
-
.dataframe-table th {
|
|
214
|
-
background: #f8f9fa;
|
|
215
|
-
font-weight: 600;
|
|
216
|
-
padding: 5px 10px;
|
|
217
|
-
text-align: left;
|
|
218
|
-
border-bottom: 1px solid #e8eaed;
|
|
219
|
-
}
|
|
220
|
-
|
|
221
|
-
.dataframe-table td {
|
|
222
|
-
padding: 5px 10px;
|
|
223
|
-
border-bottom: 1px solid #e8eaed;
|
|
224
|
-
}
|
|
225
|
-
|
|
226
|
-
/* Collapsible Details - Compact */
|
|
193
|
+
/* ============================================
|
|
194
|
+
Details/Summary - Minimal Style
|
|
195
|
+
============================================ */
|
|
227
196
|
details {
|
|
228
|
-
background:
|
|
229
|
-
border:
|
|
230
|
-
border-radius: 3px;
|
|
197
|
+
background: transparent;
|
|
198
|
+
border: none;
|
|
231
199
|
padding: 0;
|
|
232
|
-
margin-bottom:
|
|
200
|
+
margin-bottom: 4px;
|
|
233
201
|
}
|
|
234
202
|
|
|
235
|
-
summary {
|
|
203
|
+
details summary {
|
|
204
|
+
list-style: none;
|
|
236
205
|
cursor: pointer;
|
|
237
|
-
|
|
238
|
-
padding: 5px 8px;
|
|
206
|
+
padding: 4px 8px 4px 18px;
|
|
239
207
|
position: relative;
|
|
240
|
-
padding-left: 28px;
|
|
241
208
|
font-size: 12px;
|
|
209
|
+
font-weight: 500;
|
|
210
|
+
color: var(--text-secondary);
|
|
211
|
+
border-radius: var(--radius-sm);
|
|
212
|
+
transition: background var(--transition-fast);
|
|
242
213
|
}
|
|
243
214
|
|
|
244
|
-
summary
|
|
245
|
-
|
|
215
|
+
details summary::-webkit-details-marker { display: none; }
|
|
216
|
+
|
|
217
|
+
details summary::before {
|
|
218
|
+
content: '›';
|
|
246
219
|
position: absolute;
|
|
247
|
-
left:
|
|
220
|
+
left: 6px;
|
|
221
|
+
font-size: 12px;
|
|
248
222
|
transition: transform 0.15s;
|
|
249
|
-
|
|
223
|
+
color: var(--text-muted);
|
|
250
224
|
}
|
|
251
225
|
|
|
252
226
|
details[open] summary::before {
|
|
@@ -254,816 +228,933 @@ details[open] summary::before {
|
|
|
254
228
|
}
|
|
255
229
|
|
|
256
230
|
details summary:hover {
|
|
257
|
-
background:
|
|
231
|
+
background: var(--bg-tertiary) !important;
|
|
258
232
|
}
|
|
259
233
|
|
|
260
|
-
/*
|
|
261
|
-
.
|
|
262
|
-
|
|
263
|
-
|
|
264
|
-
|
|
265
|
-
|
|
266
|
-
position: relative;
|
|
234
|
+
/* Details Variants */
|
|
235
|
+
.details-summary {
|
|
236
|
+
font-size: 12px;
|
|
237
|
+
font-weight: 500;
|
|
238
|
+
padding: 4px 8px 4px 18px;
|
|
239
|
+
color: var(--text-secondary);
|
|
267
240
|
}
|
|
268
241
|
|
|
269
|
-
.
|
|
270
|
-
|
|
242
|
+
.details-summary-thinking {
|
|
243
|
+
color: var(--accent-purple);
|
|
271
244
|
}
|
|
272
245
|
|
|
273
|
-
.
|
|
274
|
-
|
|
246
|
+
.details-summary-todo {
|
|
247
|
+
color: #0891b2;
|
|
275
248
|
}
|
|
276
249
|
|
|
277
|
-
|
|
278
|
-
|
|
279
|
-
|
|
280
|
-
overflow: auto;
|
|
250
|
+
.details-summary-warning {
|
|
251
|
+
color: var(--accent-amber);
|
|
252
|
+
padding-left: 8px;
|
|
281
253
|
}
|
|
282
254
|
|
|
283
|
-
.
|
|
284
|
-
|
|
285
|
-
height: auto;
|
|
286
|
-
max-height: 60vh;
|
|
255
|
+
.details-summary-warning::before {
|
|
256
|
+
content: none;
|
|
287
257
|
}
|
|
288
258
|
|
|
289
|
-
|
|
290
|
-
|
|
291
|
-
|
|
292
|
-
font-size: 15px;
|
|
259
|
+
.details-summary-success {
|
|
260
|
+
color: var(--accent-green);
|
|
261
|
+
padding-left: 8px;
|
|
293
262
|
}
|
|
294
263
|
|
|
295
|
-
|
|
296
|
-
|
|
297
|
-
background: #e8eaed;
|
|
264
|
+
.details-summary-success::before {
|
|
265
|
+
content: none;
|
|
298
266
|
}
|
|
299
267
|
|
|
300
|
-
.
|
|
301
|
-
|
|
268
|
+
.details-summary-muted {
|
|
269
|
+
color: var(--text-muted);
|
|
302
270
|
}
|
|
303
271
|
|
|
304
|
-
|
|
305
|
-
|
|
306
|
-
:
|
|
307
|
-
|
|
308
|
-
color: var(--mantine-color-dark-0);
|
|
272
|
+
.details-content {
|
|
273
|
+
font-size: 13px;
|
|
274
|
+
padding: 8px 10px;
|
|
275
|
+
color: var(--text-primary);
|
|
309
276
|
}
|
|
310
277
|
|
|
311
|
-
|
|
312
|
-
|
|
313
|
-
|
|
314
|
-
|
|
278
|
+
.details-content-thinking {
|
|
279
|
+
border-left: 2px solid var(--accent-purple);
|
|
280
|
+
margin-left: 8px;
|
|
281
|
+
padding-left: 10px;
|
|
315
282
|
}
|
|
316
283
|
|
|
317
|
-
|
|
318
|
-
|
|
319
|
-
|
|
284
|
+
.details-content-todo {
|
|
285
|
+
border-left: 2px solid #06b6d4;
|
|
286
|
+
margin-left: 8px;
|
|
287
|
+
padding-left: 10px;
|
|
320
288
|
}
|
|
321
289
|
|
|
322
|
-
|
|
323
|
-
|
|
290
|
+
/* Chat Details Wrapper */
|
|
291
|
+
.chat-details {
|
|
292
|
+
margin-bottom: 4px;
|
|
324
293
|
}
|
|
325
294
|
|
|
326
|
-
|
|
327
|
-
|
|
328
|
-
|
|
295
|
+
/* ============================================
|
|
296
|
+
Tool Calls - Clean Compact Design
|
|
297
|
+
============================================ */
|
|
298
|
+
.tool-call {
|
|
299
|
+
background: var(--bg-secondary);
|
|
300
|
+
border: 1px solid var(--border-subtle);
|
|
301
|
+
border-radius: var(--radius-md);
|
|
302
|
+
margin-bottom: 4px;
|
|
303
|
+
font-size: 12px;
|
|
304
|
+
padding: 0;
|
|
305
|
+
overflow: hidden;
|
|
329
306
|
}
|
|
330
307
|
|
|
331
|
-
|
|
332
|
-
|
|
308
|
+
.tool-call > summary.tool-call-header {
|
|
309
|
+
list-style: none;
|
|
310
|
+
cursor: pointer;
|
|
311
|
+
padding: 8px 10px;
|
|
312
|
+
display: flex;
|
|
313
|
+
align-items: center;
|
|
314
|
+
gap: 8px;
|
|
315
|
+
user-select: none;
|
|
316
|
+
transition: background var(--transition-fast);
|
|
333
317
|
}
|
|
334
318
|
|
|
335
|
-
|
|
336
|
-
|
|
337
|
-
}
|
|
319
|
+
.tool-call > summary.tool-call-header::-webkit-details-marker { display: none; }
|
|
320
|
+
.tool-call > summary.tool-call-header::before { content: none; }
|
|
338
321
|
|
|
339
|
-
|
|
340
|
-
background: var(--
|
|
322
|
+
.tool-call > summary.tool-call-header:hover {
|
|
323
|
+
background: var(--bg-tertiary);
|
|
341
324
|
}
|
|
342
325
|
|
|
343
|
-
|
|
344
|
-
|
|
326
|
+
.tool-call-body {
|
|
327
|
+
padding: 8px 10px 10px;
|
|
328
|
+
border-top: 1px solid var(--border-muted);
|
|
345
329
|
}
|
|
346
330
|
|
|
347
|
-
|
|
348
|
-
|
|
331
|
+
.tool-call-status-dot {
|
|
332
|
+
width: 6px;
|
|
333
|
+
height: 6px;
|
|
334
|
+
border-radius: 50%;
|
|
335
|
+
flex-shrink: 0;
|
|
349
336
|
}
|
|
350
337
|
|
|
351
|
-
|
|
352
|
-
|
|
353
|
-
}
|
|
338
|
+
.tool-call-success .tool-call-status-dot { background: var(--accent-green); }
|
|
339
|
+
.tool-call-error .tool-call-status-dot { background: var(--accent-red); }
|
|
340
|
+
.tool-call-running .tool-call-status-dot { background: var(--accent-amber); animation: pulse 1.5s ease-in-out infinite; }
|
|
341
|
+
.tool-call-pending .tool-call-status-dot { background: var(--text-muted); }
|
|
354
342
|
|
|
355
|
-
|
|
356
|
-
|
|
357
|
-
|
|
343
|
+
.tool-call-icon-success,
|
|
344
|
+
.tool-call-icon-error,
|
|
345
|
+
.tool-call-icon-running,
|
|
346
|
+
.tool-call-icon-pending { display: none; }
|
|
347
|
+
|
|
348
|
+
.tool-call-name {
|
|
349
|
+
font-size: 12px;
|
|
350
|
+
font-weight: 500;
|
|
351
|
+
color: var(--text-primary);
|
|
352
|
+
font-family: 'JetBrains Mono', monospace;
|
|
358
353
|
}
|
|
359
354
|
|
|
360
|
-
|
|
361
|
-
|
|
355
|
+
.tool-call-label {
|
|
356
|
+
font-size: 11px;
|
|
357
|
+
color: var(--text-muted);
|
|
362
358
|
}
|
|
363
359
|
|
|
364
|
-
|
|
365
|
-
|
|
366
|
-
|
|
360
|
+
.tool-call details {
|
|
361
|
+
margin-top: 6px;
|
|
362
|
+
background: transparent;
|
|
363
|
+
border: none;
|
|
364
|
+
padding: 0;
|
|
365
|
+
}
|
|
367
366
|
|
|
368
|
-
|
|
369
|
-
|
|
370
|
-
|
|
371
|
-
|
|
372
|
-
|
|
367
|
+
.tool-call-summary {
|
|
368
|
+
font-size: 10px;
|
|
369
|
+
font-weight: 500;
|
|
370
|
+
color: var(--text-muted);
|
|
371
|
+
cursor: pointer;
|
|
372
|
+
padding: 4px 6px;
|
|
373
373
|
border-radius: 3px;
|
|
374
|
+
background: var(--bg-tertiary);
|
|
375
|
+
text-transform: uppercase;
|
|
376
|
+
letter-spacing: 0.03em;
|
|
374
377
|
}
|
|
375
378
|
|
|
376
|
-
.
|
|
377
|
-
background: #eff6ff;
|
|
378
|
-
border-left-color: #3b82f6;
|
|
379
|
-
}
|
|
379
|
+
.tool-call-summary::before { content: none; }
|
|
380
380
|
|
|
381
|
-
.
|
|
382
|
-
background: var(--
|
|
383
|
-
border-left-color: #10b981;
|
|
381
|
+
.tool-call-summary:hover {
|
|
382
|
+
background: var(--border-subtle) !important;
|
|
384
383
|
}
|
|
385
384
|
|
|
386
|
-
.
|
|
387
|
-
|
|
388
|
-
|
|
389
|
-
|
|
385
|
+
.tool-call-args,
|
|
386
|
+
.tool-call-result {
|
|
387
|
+
font-size: 11px;
|
|
388
|
+
line-height: 1.5;
|
|
389
|
+
color: var(--text-secondary);
|
|
390
|
+
background: var(--bg-tertiary);
|
|
391
|
+
padding: 8px 10px;
|
|
392
|
+
border-radius: var(--radius-sm);
|
|
393
|
+
margin-top: 4px;
|
|
394
|
+
overflow: auto;
|
|
395
|
+
max-height: 120px;
|
|
396
|
+
white-space: pre-wrap;
|
|
397
|
+
word-break: break-word;
|
|
398
|
+
font-family: 'JetBrains Mono', monospace;
|
|
390
399
|
}
|
|
391
400
|
|
|
392
|
-
/*
|
|
393
|
-
|
|
394
|
-
|
|
401
|
+
/* ============================================
|
|
402
|
+
Todo Items
|
|
403
|
+
============================================ */
|
|
404
|
+
.todo-item {
|
|
405
|
+
display: flex;
|
|
406
|
+
align-items: flex-start;
|
|
407
|
+
gap: 6px;
|
|
408
|
+
padding: 3px 0;
|
|
395
409
|
}
|
|
396
410
|
|
|
397
|
-
|
|
398
|
-
|
|
399
|
-
|
|
411
|
+
/* ============================================
|
|
412
|
+
Input Area
|
|
413
|
+
============================================ */
|
|
414
|
+
.chat-input {
|
|
415
|
+
border: 1px solid var(--border-subtle) !important;
|
|
416
|
+
background: var(--bg-secondary) !important;
|
|
417
|
+
transition: border-color var(--transition-fast), box-shadow var(--transition-fast);
|
|
400
418
|
}
|
|
401
419
|
|
|
402
|
-
|
|
403
|
-
|
|
404
|
-
border-
|
|
420
|
+
.chat-input:focus {
|
|
421
|
+
outline: none;
|
|
422
|
+
border-color: var(--accent-blue) !important;
|
|
423
|
+
box-shadow: 0 0 0 2px rgba(59, 130, 246, 0.1) !important;
|
|
405
424
|
}
|
|
406
425
|
|
|
407
|
-
|
|
408
|
-
|
|
409
|
-
|
|
426
|
+
.chat-input::placeholder {
|
|
427
|
+
color: var(--text-muted);
|
|
428
|
+
font-size: 14px;
|
|
410
429
|
}
|
|
411
430
|
|
|
412
|
-
|
|
413
|
-
|
|
414
|
-
color: #2563eb;
|
|
431
|
+
.send-btn:hover:not(:disabled) {
|
|
432
|
+
background: #2563eb !important;
|
|
415
433
|
}
|
|
416
434
|
|
|
417
|
-
|
|
418
|
-
|
|
435
|
+
/* ============================================
|
|
436
|
+
Resize Handle
|
|
437
|
+
============================================ */
|
|
438
|
+
.resize-handle {
|
|
439
|
+
width: 4px;
|
|
440
|
+
cursor: col-resize;
|
|
441
|
+
background: transparent;
|
|
442
|
+
transition: background var(--transition-fast);
|
|
419
443
|
}
|
|
420
444
|
|
|
421
|
-
.
|
|
422
|
-
|
|
423
|
-
}
|
|
445
|
+
.resize-handle:hover { background: var(--border-subtle); }
|
|
446
|
+
.resize-handle:active { background: var(--text-muted); }
|
|
424
447
|
|
|
425
|
-
|
|
426
|
-
|
|
448
|
+
/* ============================================
|
|
449
|
+
File Browser
|
|
450
|
+
============================================ */
|
|
451
|
+
.file-tree-item {
|
|
452
|
+
background: transparent;
|
|
453
|
+
color: var(--text-primary);
|
|
454
|
+
border-bottom: 1px solid var(--border-muted);
|
|
455
|
+
transition: background var(--transition-fast);
|
|
427
456
|
}
|
|
428
457
|
|
|
429
|
-
|
|
430
|
-
|
|
458
|
+
.file-tree-item:hover {
|
|
459
|
+
background: var(--bg-tertiary) !important;
|
|
431
460
|
}
|
|
432
461
|
|
|
433
|
-
|
|
434
|
-
|
|
435
|
-
}
|
|
462
|
+
.folder-icon { color: var(--text-muted); }
|
|
463
|
+
.folder-name { color: var(--text-primary); font-size: 13px; }
|
|
464
|
+
.file-item { color: var(--text-secondary); font-size: 13px; }
|
|
465
|
+
.file-item:hover { background: var(--bg-tertiary); }
|
|
466
|
+
.folder-header:hover { background: var(--bg-tertiary); }
|
|
436
467
|
|
|
437
|
-
|
|
438
|
-
|
|
468
|
+
.file-tree-empty,
|
|
469
|
+
.file-tree-loading {
|
|
470
|
+
color: var(--text-muted);
|
|
471
|
+
font-size: 12px;
|
|
439
472
|
}
|
|
440
473
|
|
|
474
|
+
/* Breadcrumb */
|
|
475
|
+
.breadcrumb-bar { background: var(--bg-tertiary); }
|
|
476
|
+
.breadcrumb-item { transition: background var(--transition-fast); }
|
|
477
|
+
.breadcrumb-clickable:hover { background: var(--bg-secondary) !important; }
|
|
478
|
+
.breadcrumb-separator { user-select: none; }
|
|
479
|
+
.folder-select-target { transition: background var(--transition-fast); }
|
|
480
|
+
.folder-expand-toggle { opacity: 0.5; transition: opacity var(--transition-fast); }
|
|
481
|
+
.folder-expand-toggle:hover { opacity: 1; }
|
|
482
|
+
|
|
441
483
|
/* ============================================
|
|
442
|
-
|
|
484
|
+
Canvas
|
|
443
485
|
============================================ */
|
|
486
|
+
.canvas-empty { color: var(--text-muted); }
|
|
487
|
+
.canvas-empty-text { color: var(--text-muted); }
|
|
488
|
+
.canvas-item-title { color: var(--text-primary); font-size: 13px; }
|
|
444
489
|
|
|
445
|
-
.
|
|
446
|
-
margin-bottom:
|
|
447
|
-
|
|
448
|
-
|
|
449
|
-
|
|
450
|
-
|
|
451
|
-
|
|
452
|
-
|
|
453
|
-
padding: 5px 10px;
|
|
454
|
-
padding-left: 28px;
|
|
455
|
-
position: relative;
|
|
456
|
-
background: var(--mantine-color-gray-1);
|
|
457
|
-
border-left: 3px solid var(--mantine-color-dimmed);
|
|
458
|
-
user-select: none;
|
|
459
|
-
margin-bottom: 3px;
|
|
460
|
-
color: var(--mantine-color-dimmed);
|
|
461
|
-
}
|
|
462
|
-
|
|
463
|
-
.details-summary-thinking {
|
|
464
|
-
color: #7c3aed;
|
|
465
|
-
border-left-color: #a78bfa;
|
|
490
|
+
.canvas-item {
|
|
491
|
+
margin-bottom: 10px;
|
|
492
|
+
padding: 12px;
|
|
493
|
+
background: var(--bg-secondary);
|
|
494
|
+
border-radius: var(--radius-md);
|
|
495
|
+
border: 1px solid var(--border-subtle);
|
|
496
|
+
max-width: 100%;
|
|
497
|
+
overflow: hidden;
|
|
466
498
|
}
|
|
467
499
|
|
|
468
|
-
.
|
|
469
|
-
|
|
470
|
-
border
|
|
500
|
+
.canvas-item-container {
|
|
501
|
+
background: var(--bg-secondary);
|
|
502
|
+
border: 1px solid var(--border-subtle);
|
|
503
|
+
border-radius: var(--radius-md);
|
|
504
|
+
margin-bottom: 10px;
|
|
505
|
+
overflow: hidden;
|
|
506
|
+
transition: box-shadow var(--transition-fast);
|
|
471
507
|
}
|
|
472
508
|
|
|
473
|
-
.
|
|
474
|
-
|
|
475
|
-
border-left-color: #fbbf24;
|
|
509
|
+
.canvas-item-container:hover {
|
|
510
|
+
box-shadow: var(--shadow-md);
|
|
476
511
|
}
|
|
477
512
|
|
|
478
|
-
.
|
|
479
|
-
|
|
480
|
-
|
|
513
|
+
.canvas-item-header {
|
|
514
|
+
display: flex;
|
|
515
|
+
justify-content: space-between;
|
|
516
|
+
align-items: center;
|
|
517
|
+
padding: 6px 10px;
|
|
518
|
+
border-bottom: 1px solid var(--border-muted);
|
|
519
|
+
background: var(--bg-tertiary);
|
|
481
520
|
}
|
|
482
521
|
|
|
483
|
-
.
|
|
484
|
-
|
|
485
|
-
|
|
486
|
-
}
|
|
522
|
+
.canvas-item-title-text { color: var(--text-primary); }
|
|
523
|
+
.canvas-item-time { font-size: 11px; color: var(--text-muted); }
|
|
524
|
+
.canvas-item-content { padding: 12px; }
|
|
487
525
|
|
|
488
|
-
.
|
|
489
|
-
|
|
490
|
-
|
|
491
|
-
background: var(--mantine-color-gray-1);
|
|
492
|
-
color: var(--mantine-color-text);
|
|
526
|
+
.canvas-collapse-btn {
|
|
527
|
+
opacity: 0.5;
|
|
528
|
+
transition: opacity var(--transition-fast);
|
|
493
529
|
}
|
|
530
|
+
.canvas-collapse-btn:hover { opacity: 1; }
|
|
494
531
|
|
|
495
|
-
.
|
|
496
|
-
|
|
532
|
+
.canvas-delete-btn {
|
|
533
|
+
opacity: 0.3;
|
|
534
|
+
transition: opacity var(--transition-fast), color var(--transition-fast);
|
|
497
535
|
}
|
|
498
|
-
|
|
499
|
-
|
|
500
|
-
|
|
536
|
+
.canvas-delete-btn:hover {
|
|
537
|
+
opacity: 1;
|
|
538
|
+
color: var(--accent-red) !important;
|
|
501
539
|
}
|
|
502
540
|
|
|
503
|
-
|
|
504
|
-
|
|
505
|
-
|
|
541
|
+
.canvas-item-content-wrapper {
|
|
542
|
+
transition: max-height 0.2s ease-out;
|
|
543
|
+
overflow: hidden;
|
|
506
544
|
}
|
|
507
545
|
|
|
508
|
-
|
|
509
|
-
|
|
510
|
-
|
|
546
|
+
/* Canvas Markdown */
|
|
547
|
+
.canvas-markdown {
|
|
548
|
+
color: var(--text-primary);
|
|
549
|
+
font-size: 14px;
|
|
550
|
+
line-height: 1.6;
|
|
511
551
|
}
|
|
512
552
|
|
|
513
|
-
|
|
514
|
-
|
|
515
|
-
|
|
553
|
+
.canvas-markdown h1,
|
|
554
|
+
.canvas-markdown h2,
|
|
555
|
+
.canvas-markdown h3,
|
|
556
|
+
.canvas-markdown h4 {
|
|
557
|
+
color: var(--text-primary);
|
|
558
|
+
margin: 10px 0 6px;
|
|
516
559
|
}
|
|
517
560
|
|
|
518
|
-
|
|
519
|
-
|
|
520
|
-
|
|
521
|
-
}
|
|
561
|
+
.canvas-markdown h1 { font-size: 18px; }
|
|
562
|
+
.canvas-markdown h2 { font-size: 16px; }
|
|
563
|
+
.canvas-markdown h3 { font-size: 15px; }
|
|
564
|
+
.canvas-markdown h4 { font-size: 14px; }
|
|
522
565
|
|
|
523
|
-
|
|
524
|
-
|
|
525
|
-
|
|
526
|
-
}
|
|
566
|
+
.canvas-markdown p { color: var(--text-primary); margin: 6px 0; }
|
|
567
|
+
.canvas-markdown ul, .canvas-markdown ol { margin: 6px 0; padding-left: 20px; }
|
|
568
|
+
.canvas-markdown li { margin: 3px 0; color: var(--text-primary); }
|
|
569
|
+
.canvas-markdown strong { color: var(--text-primary); font-weight: 600; }
|
|
527
570
|
|
|
528
|
-
|
|
529
|
-
background: var(--
|
|
571
|
+
.canvas-markdown code {
|
|
572
|
+
background: var(--bg-tertiary);
|
|
573
|
+
padding: 2px 6px;
|
|
574
|
+
border-radius: 3px;
|
|
575
|
+
font-size: 13px;
|
|
530
576
|
}
|
|
531
577
|
|
|
532
|
-
|
|
533
|
-
|
|
578
|
+
.canvas-markdown pre {
|
|
579
|
+
background: var(--bg-tertiary);
|
|
580
|
+
padding: 12px;
|
|
581
|
+
border-radius: var(--radius-sm);
|
|
534
582
|
}
|
|
535
583
|
|
|
536
|
-
|
|
537
|
-
border-left-color: #06b6d4;
|
|
538
|
-
}
|
|
584
|
+
.canvas-code { color: var(--text-secondary); font-size: 13px; }
|
|
539
585
|
|
|
540
586
|
/* ============================================
|
|
541
|
-
|
|
587
|
+
Data Tables
|
|
542
588
|
============================================ */
|
|
543
|
-
|
|
544
|
-
|
|
545
|
-
|
|
546
|
-
|
|
547
|
-
border-left: 3px solid var(--mantine-color-dimmed);
|
|
548
|
-
margin-bottom: 5px;
|
|
549
|
-
font-size: 15px;
|
|
550
|
-
border-radius: 3px;
|
|
589
|
+
.dataframe-table {
|
|
590
|
+
width: 100%;
|
|
591
|
+
border-collapse: collapse;
|
|
592
|
+
font-size: 13px;
|
|
551
593
|
}
|
|
552
594
|
|
|
553
|
-
.
|
|
554
|
-
|
|
595
|
+
.dataframe-table th {
|
|
596
|
+
background: var(--bg-tertiary);
|
|
597
|
+
font-weight: 500;
|
|
598
|
+
padding: 8px 10px;
|
|
599
|
+
text-align: left;
|
|
600
|
+
border-bottom: 1px solid var(--border-subtle);
|
|
555
601
|
}
|
|
556
602
|
|
|
557
|
-
.
|
|
558
|
-
|
|
603
|
+
.dataframe-table td {
|
|
604
|
+
padding: 6px 10px;
|
|
605
|
+
border-bottom: 1px solid var(--border-muted);
|
|
559
606
|
}
|
|
560
607
|
|
|
561
|
-
|
|
562
|
-
|
|
608
|
+
/* CSV Preview */
|
|
609
|
+
.csv-preview-table {
|
|
610
|
+
width: 100%;
|
|
611
|
+
border-collapse: collapse;
|
|
612
|
+
font-size: 12px;
|
|
613
|
+
font-family: 'JetBrains Mono', monospace;
|
|
563
614
|
}
|
|
564
615
|
|
|
565
|
-
.
|
|
566
|
-
|
|
616
|
+
.csv-preview-table th {
|
|
617
|
+
background: var(--bg-tertiary);
|
|
618
|
+
font-weight: 500;
|
|
619
|
+
padding: 8px 10px;
|
|
620
|
+
text-align: left;
|
|
621
|
+
border-bottom: 1px solid var(--border-subtle);
|
|
622
|
+
position: sticky;
|
|
623
|
+
top: 0;
|
|
624
|
+
white-space: nowrap;
|
|
567
625
|
}
|
|
568
626
|
|
|
569
|
-
.
|
|
570
|
-
|
|
627
|
+
.csv-preview-table td {
|
|
628
|
+
padding: 6px 10px;
|
|
629
|
+
border-bottom: 1px solid var(--border-muted);
|
|
630
|
+
max-width: 250px;
|
|
631
|
+
overflow: hidden;
|
|
632
|
+
text-overflow: ellipsis;
|
|
633
|
+
white-space: nowrap;
|
|
571
634
|
}
|
|
572
635
|
|
|
573
|
-
.
|
|
574
|
-
|
|
636
|
+
.csv-preview-table tr:hover td {
|
|
637
|
+
background: var(--bg-tertiary);
|
|
575
638
|
}
|
|
576
639
|
|
|
577
|
-
|
|
578
|
-
|
|
640
|
+
/* CSV Pagination */
|
|
641
|
+
#csv-prev-page:disabled,
|
|
642
|
+
#csv-next-page:disabled {
|
|
643
|
+
opacity: 0.3;
|
|
644
|
+
cursor: not-allowed;
|
|
579
645
|
}
|
|
580
646
|
|
|
581
|
-
|
|
582
|
-
|
|
647
|
+
#csv-prev-page:not(:disabled):hover,
|
|
648
|
+
#csv-next-page:not(:disabled):hover {
|
|
649
|
+
background: var(--bg-tertiary) !important;
|
|
583
650
|
}
|
|
584
651
|
|
|
585
|
-
|
|
586
|
-
|
|
587
|
-
|
|
588
|
-
|
|
589
|
-
|
|
652
|
+
/* ============================================
|
|
653
|
+
Display Inline
|
|
654
|
+
============================================ */
|
|
655
|
+
.display-inline-container {
|
|
656
|
+
background: var(--bg-secondary);
|
|
657
|
+
border: 1px solid var(--border-subtle);
|
|
658
|
+
border-radius: var(--radius-md);
|
|
659
|
+
margin-top: 8px;
|
|
590
660
|
}
|
|
591
661
|
|
|
592
|
-
.
|
|
593
|
-
|
|
594
|
-
|
|
662
|
+
.display-inline-title {
|
|
663
|
+
color: var(--text-primary);
|
|
664
|
+
border-bottom: 1px solid var(--border-muted);
|
|
665
|
+
padding-bottom: 6px;
|
|
666
|
+
margin-bottom: 8px;
|
|
595
667
|
}
|
|
596
668
|
|
|
597
|
-
.
|
|
598
|
-
.
|
|
599
|
-
font-size: 12px;
|
|
600
|
-
color: var(--mantine-color-dimmed);
|
|
601
|
-
background: var(--mantine-color-gray-0);
|
|
602
|
-
padding: 10px;
|
|
603
|
-
border-radius: 5px;
|
|
604
|
-
margin-top: 5px;
|
|
605
|
-
margin-left: 22px;
|
|
606
|
-
overflow: auto;
|
|
607
|
-
max-height: 188px;
|
|
608
|
-
white-space: pre-wrap;
|
|
609
|
-
word-break: break-word;
|
|
610
|
-
}
|
|
669
|
+
.display-inline-error { color: var(--accent-red); }
|
|
670
|
+
.display-inline-image { display: block; margin: 0 auto; }
|
|
611
671
|
|
|
612
|
-
.
|
|
672
|
+
.display-inline-dataframe table {
|
|
673
|
+
width: 100%;
|
|
674
|
+
border-collapse: collapse;
|
|
613
675
|
font-size: 12px;
|
|
614
|
-
color: var(--mantine-color-dimmed);
|
|
615
|
-
cursor: pointer;
|
|
616
|
-
margin-top: 5px;
|
|
617
|
-
padding-left: 22px;
|
|
618
|
-
position: relative;
|
|
619
676
|
}
|
|
620
677
|
|
|
621
|
-
|
|
622
|
-
|
|
623
|
-
|
|
624
|
-
|
|
625
|
-
|
|
626
|
-
border-left-color: #34d399;
|
|
678
|
+
.display-inline-dataframe th,
|
|
679
|
+
.display-inline-dataframe td {
|
|
680
|
+
padding: 6px 10px;
|
|
681
|
+
border: 1px solid var(--border-subtle);
|
|
682
|
+
text-align: left;
|
|
627
683
|
}
|
|
628
684
|
|
|
629
|
-
|
|
630
|
-
|
|
685
|
+
.display-inline-dataframe th {
|
|
686
|
+
background: var(--bg-tertiary);
|
|
687
|
+
font-weight: 500;
|
|
631
688
|
}
|
|
632
689
|
|
|
633
|
-
|
|
634
|
-
border-left-color: #fbbf24;
|
|
635
|
-
}
|
|
690
|
+
.display-inline-df-summary { color: var(--text-muted); }
|
|
636
691
|
|
|
637
|
-
|
|
638
|
-
|
|
692
|
+
.display-inline-json,
|
|
693
|
+
.display-inline-text {
|
|
694
|
+
background: var(--bg-tertiary);
|
|
695
|
+
border: 1px solid var(--border-subtle);
|
|
696
|
+
font-family: 'JetBrains Mono', monospace;
|
|
639
697
|
}
|
|
640
698
|
|
|
641
|
-
|
|
642
|
-
|
|
643
|
-
}
|
|
699
|
+
.display-inline-filename { color: var(--text-muted); }
|
|
700
|
+
.display-inline-html iframe { background: white; }
|
|
644
701
|
|
|
645
|
-
|
|
646
|
-
|
|
702
|
+
/* ============================================
|
|
703
|
+
Mermaid Diagrams
|
|
704
|
+
============================================ */
|
|
705
|
+
.mermaid-diagram {
|
|
706
|
+
max-height: 60vh;
|
|
707
|
+
overflow: auto;
|
|
647
708
|
}
|
|
648
709
|
|
|
649
|
-
|
|
650
|
-
|
|
651
|
-
|
|
710
|
+
.mermaid-diagram svg {
|
|
711
|
+
max-width: 100%;
|
|
712
|
+
height: auto;
|
|
713
|
+
max-height: 60vh;
|
|
652
714
|
}
|
|
653
715
|
|
|
654
716
|
/* ============================================
|
|
655
|
-
|
|
717
|
+
Scrollbars - Minimal
|
|
656
718
|
============================================ */
|
|
657
|
-
|
|
658
|
-
|
|
659
|
-
|
|
660
|
-
color: var(--mantine-color-text);
|
|
661
|
-
border-bottom: 1px solid var(--mantine-color-gray-2);
|
|
662
|
-
transition: background 0.1s ease;
|
|
663
|
-
}
|
|
664
|
-
|
|
665
|
-
.file-tree-item:hover {
|
|
666
|
-
background: var(--mantine-color-gray-1) !important;
|
|
719
|
+
::-webkit-scrollbar {
|
|
720
|
+
width: 6px;
|
|
721
|
+
height: 6px;
|
|
667
722
|
}
|
|
668
723
|
|
|
669
|
-
|
|
670
|
-
|
|
724
|
+
::-webkit-scrollbar-track {
|
|
725
|
+
background: transparent;
|
|
671
726
|
}
|
|
672
727
|
|
|
673
|
-
|
|
674
|
-
|
|
675
|
-
|
|
728
|
+
::-webkit-scrollbar-thumb {
|
|
729
|
+
background: var(--border-subtle);
|
|
730
|
+
border-radius: 3px;
|
|
676
731
|
}
|
|
677
732
|
|
|
678
|
-
|
|
679
|
-
|
|
680
|
-
font-size: 14px;
|
|
733
|
+
::-webkit-scrollbar-thumb:hover {
|
|
734
|
+
background: var(--text-muted);
|
|
681
735
|
}
|
|
682
736
|
|
|
683
|
-
.
|
|
684
|
-
|
|
685
|
-
color: var(--mantine-color-dimmed);
|
|
686
|
-
font-size: 12px;
|
|
737
|
+
.csv-table-container {
|
|
738
|
+
scrollbar-width: thin;
|
|
687
739
|
}
|
|
688
740
|
|
|
689
|
-
|
|
690
|
-
|
|
741
|
+
.csv-table-container::-webkit-scrollbar {
|
|
742
|
+
width: 6px;
|
|
743
|
+
height: 6px;
|
|
691
744
|
}
|
|
692
745
|
|
|
693
|
-
|
|
694
|
-
background:
|
|
746
|
+
.csv-table-container::-webkit-scrollbar-track {
|
|
747
|
+
background: transparent;
|
|
695
748
|
}
|
|
696
749
|
|
|
697
|
-
|
|
698
|
-
|
|
750
|
+
.csv-table-container::-webkit-scrollbar-thumb {
|
|
751
|
+
background: var(--border-subtle);
|
|
752
|
+
border-radius: 3px;
|
|
699
753
|
}
|
|
700
754
|
|
|
701
755
|
/* ============================================
|
|
702
|
-
|
|
756
|
+
Interrupt/Approval Dialog
|
|
703
757
|
============================================ */
|
|
704
|
-
|
|
705
|
-
|
|
706
|
-
|
|
758
|
+
.interrupt-container {
|
|
759
|
+
padding: 16px;
|
|
760
|
+
background: #fffbeb;
|
|
761
|
+
border: 1px solid var(--accent-amber);
|
|
762
|
+
border-radius: var(--radius-md);
|
|
763
|
+
margin-bottom: 10px;
|
|
707
764
|
}
|
|
708
765
|
|
|
709
|
-
.
|
|
710
|
-
|
|
711
|
-
}
|
|
766
|
+
.interrupt-title { color: #92400e; font-weight: 600; }
|
|
767
|
+
.interrupt-message { color: var(--text-primary); }
|
|
768
|
+
.interrupt-tool-label { color: var(--text-muted); }
|
|
769
|
+
.interrupt-tool-name { color: #b45309; font-weight: 500; }
|
|
712
770
|
|
|
713
|
-
.
|
|
714
|
-
|
|
715
|
-
|
|
771
|
+
.interrupt-command,
|
|
772
|
+
.interrupt-args {
|
|
773
|
+
background: #fef3c7;
|
|
774
|
+
border: 1px solid #fde68a;
|
|
775
|
+
color: var(--text-primary);
|
|
776
|
+
border-radius: var(--radius-sm);
|
|
777
|
+
padding: 8px 10px;
|
|
778
|
+
font-family: 'JetBrains Mono', monospace;
|
|
779
|
+
font-size: 12px;
|
|
716
780
|
}
|
|
717
781
|
|
|
718
|
-
.
|
|
719
|
-
|
|
720
|
-
|
|
721
|
-
|
|
722
|
-
border-radius:
|
|
723
|
-
border: 1px solid var(--mantine-color-gray-3);
|
|
724
|
-
max-width: 100%;
|
|
725
|
-
overflow: hidden;
|
|
782
|
+
.interrupt-input {
|
|
783
|
+
border: 1px solid #fcd34d;
|
|
784
|
+
background: #ffffff;
|
|
785
|
+
color: var(--text-primary);
|
|
786
|
+
border-radius: var(--radius-sm);
|
|
726
787
|
}
|
|
727
788
|
|
|
728
|
-
.
|
|
729
|
-
|
|
730
|
-
|
|
731
|
-
|
|
789
|
+
.interrupt-btn {
|
|
790
|
+
border: none;
|
|
791
|
+
padding: 8px 16px;
|
|
792
|
+
border-radius: var(--radius-sm);
|
|
793
|
+
font-size: 13px;
|
|
794
|
+
font-weight: 500;
|
|
795
|
+
cursor: pointer;
|
|
796
|
+
transition: background var(--transition-fast);
|
|
732
797
|
}
|
|
733
798
|
|
|
734
|
-
.
|
|
735
|
-
|
|
736
|
-
|
|
737
|
-
.canvas-markdown h4 {
|
|
738
|
-
color: var(--mantine-color-text);
|
|
739
|
-
margin: 10px 0 5px 0;
|
|
799
|
+
.interrupt-btn-approve {
|
|
800
|
+
background: var(--accent-green);
|
|
801
|
+
color: #ffffff;
|
|
740
802
|
}
|
|
803
|
+
.interrupt-btn-approve:hover { background: #16a34a; }
|
|
741
804
|
|
|
742
|
-
.
|
|
743
|
-
|
|
744
|
-
|
|
745
|
-
.canvas-markdown h4 { font-size: 15px; }
|
|
746
|
-
|
|
747
|
-
.canvas-markdown p {
|
|
748
|
-
color: var(--mantine-color-text);
|
|
749
|
-
margin: 5px 0;
|
|
805
|
+
.interrupt-btn-reject {
|
|
806
|
+
background: var(--accent-red);
|
|
807
|
+
color: #ffffff;
|
|
750
808
|
}
|
|
809
|
+
.interrupt-btn-reject:hover { background: #dc2626; }
|
|
751
810
|
|
|
752
|
-
.
|
|
753
|
-
|
|
754
|
-
|
|
755
|
-
padding-left: 24px;
|
|
756
|
-
list-style-position: inside;
|
|
811
|
+
.interrupt-btn-edit {
|
|
812
|
+
background: var(--bg-tertiary);
|
|
813
|
+
color: var(--text-primary);
|
|
757
814
|
}
|
|
815
|
+
.interrupt-btn-edit:hover { background: var(--border-subtle); }
|
|
758
816
|
|
|
759
|
-
|
|
760
|
-
|
|
761
|
-
|
|
817
|
+
/* Dark mode interrupt */
|
|
818
|
+
[data-mantine-color-scheme="dark"] .interrupt-container {
|
|
819
|
+
background: #422006;
|
|
820
|
+
border-color: #a16207;
|
|
762
821
|
}
|
|
763
822
|
|
|
764
|
-
.
|
|
765
|
-
|
|
766
|
-
font-weight: 600;
|
|
767
|
-
}
|
|
823
|
+
[data-mantine-color-scheme="dark"] .interrupt-title { color: #fcd34d; }
|
|
824
|
+
[data-mantine-color-scheme="dark"] .interrupt-tool-name { color: #fbbf24; }
|
|
768
825
|
|
|
769
|
-
.
|
|
770
|
-
|
|
771
|
-
|
|
772
|
-
|
|
826
|
+
[data-mantine-color-scheme="dark"] .interrupt-command,
|
|
827
|
+
[data-mantine-color-scheme="dark"] .interrupt-args {
|
|
828
|
+
background: #451a03;
|
|
829
|
+
border-color: #78350f;
|
|
773
830
|
}
|
|
774
831
|
|
|
775
|
-
.
|
|
776
|
-
|
|
777
|
-
|
|
832
|
+
[data-mantine-color-scheme="dark"] .interrupt-input {
|
|
833
|
+
border-color: #78350f;
|
|
834
|
+
background: var(--bg-secondary);
|
|
778
835
|
}
|
|
779
836
|
|
|
780
|
-
|
|
781
|
-
|
|
782
|
-
|
|
837
|
+
/* ============================================
|
|
838
|
+
Code Blocks
|
|
839
|
+
============================================ */
|
|
840
|
+
code, pre {
|
|
841
|
+
font-family: 'JetBrains Mono', 'SF Mono', monospace;
|
|
842
|
+
background: var(--bg-tertiary);
|
|
843
|
+
font-size: 13px;
|
|
783
844
|
}
|
|
784
845
|
|
|
785
|
-
|
|
786
|
-
|
|
787
|
-
|
|
788
|
-
border-
|
|
846
|
+
pre {
|
|
847
|
+
padding: 12px;
|
|
848
|
+
overflow-x: auto;
|
|
849
|
+
border-radius: var(--radius-sm);
|
|
789
850
|
}
|
|
790
851
|
|
|
791
|
-
|
|
792
|
-
|
|
852
|
+
code {
|
|
853
|
+
padding: 2px 6px;
|
|
854
|
+
border-radius: 3px;
|
|
793
855
|
}
|
|
794
856
|
|
|
795
|
-
|
|
796
|
-
|
|
797
|
-
|
|
857
|
+
/* ============================================
|
|
858
|
+
Dark Mode - Explicit Overrides
|
|
859
|
+
============================================ */
|
|
798
860
|
|
|
799
|
-
|
|
800
|
-
|
|
861
|
+
/* Body and panels */
|
|
862
|
+
[data-mantine-color-scheme="dark"] body {
|
|
863
|
+
background: var(--bg-primary);
|
|
864
|
+
color: var(--text-primary);
|
|
801
865
|
}
|
|
802
866
|
|
|
803
|
-
[data-mantine-color-scheme="dark"]
|
|
804
|
-
|
|
867
|
+
[data-mantine-color-scheme="dark"] #chat-panel,
|
|
868
|
+
[data-mantine-color-scheme="dark"] #chat-messages {
|
|
869
|
+
background: var(--bg-primary);
|
|
805
870
|
}
|
|
806
871
|
|
|
807
|
-
/*
|
|
808
|
-
|
|
809
|
-
background: var(--
|
|
810
|
-
border: 1px solid var(--mantine-color-gray-3);
|
|
811
|
-
border-radius: 6px;
|
|
812
|
-
margin-bottom: 12px;
|
|
813
|
-
overflow: hidden;
|
|
814
|
-
transition: box-shadow 0.15s ease;
|
|
872
|
+
/* Chat messages */
|
|
873
|
+
[data-mantine-color-scheme="dark"] .chat-message {
|
|
874
|
+
background: var(--bg-secondary);
|
|
815
875
|
}
|
|
816
876
|
|
|
817
|
-
.
|
|
818
|
-
|
|
877
|
+
[data-mantine-color-scheme="dark"] .chat-message-user {
|
|
878
|
+
background: #2d3748;
|
|
879
|
+
border-left-color: var(--accent-blue);
|
|
819
880
|
}
|
|
820
881
|
|
|
821
|
-
.
|
|
822
|
-
|
|
823
|
-
|
|
824
|
-
align-items: center;
|
|
825
|
-
padding: 6px 10px;
|
|
826
|
-
border-bottom: 1px solid var(--mantine-color-gray-2);
|
|
827
|
-
background: var(--mantine-color-gray-0);
|
|
882
|
+
[data-mantine-color-scheme="dark"] .chat-message-agent {
|
|
883
|
+
background: var(--bg-secondary);
|
|
884
|
+
border-left-color: var(--accent-green);
|
|
828
885
|
}
|
|
829
886
|
|
|
830
|
-
|
|
831
|
-
|
|
887
|
+
[data-mantine-color-scheme="dark"] .chat-message-loading {
|
|
888
|
+
background: var(--bg-secondary);
|
|
889
|
+
border-left-color: var(--accent-purple);
|
|
832
890
|
}
|
|
833
891
|
|
|
834
|
-
|
|
835
|
-
|
|
836
|
-
}
|
|
892
|
+
/* Message role labels - brighter in dark mode */
|
|
893
|
+
[data-mantine-color-scheme="dark"] .message-role-user { color: #a5d8ff; }
|
|
894
|
+
[data-mantine-color-scheme="dark"] .message-role-agent { color: #8ce99a; }
|
|
895
|
+
[data-mantine-color-scheme="dark"] .thinking-text { color: #d0bfff; }
|
|
896
|
+
[data-mantine-color-scheme="dark"] .message-time { color: #5c5f66; }
|
|
837
897
|
|
|
838
|
-
|
|
839
|
-
|
|
840
|
-
}
|
|
898
|
+
/* Details/Summary */
|
|
899
|
+
[data-mantine-color-scheme="dark"] .details-summary-thinking { color: #d0bfff; }
|
|
900
|
+
[data-mantine-color-scheme="dark"] .details-summary-todo { color: #99e9f2; }
|
|
901
|
+
[data-mantine-color-scheme="dark"] .details-summary-warning { color: #ffe066; }
|
|
902
|
+
[data-mantine-color-scheme="dark"] .details-summary-success { color: #8ce99a; }
|
|
841
903
|
|
|
842
|
-
.
|
|
843
|
-
|
|
844
|
-
transition: opacity 0.15s ease, transform 0.15s ease;
|
|
904
|
+
[data-mantine-color-scheme="dark"] .details-content-thinking {
|
|
905
|
+
border-left-color: var(--accent-purple);
|
|
845
906
|
}
|
|
846
907
|
|
|
847
|
-
.
|
|
848
|
-
|
|
908
|
+
[data-mantine-color-scheme="dark"] .details-content-todo {
|
|
909
|
+
border-left-color: #3bc9db;
|
|
849
910
|
}
|
|
850
911
|
|
|
851
|
-
|
|
852
|
-
|
|
853
|
-
|
|
912
|
+
/* Tool calls */
|
|
913
|
+
[data-mantine-color-scheme="dark"] .tool-call {
|
|
914
|
+
background: var(--bg-secondary);
|
|
915
|
+
border-color: var(--border-subtle);
|
|
854
916
|
}
|
|
855
917
|
|
|
856
|
-
.
|
|
857
|
-
|
|
858
|
-
color: var(--mantine-color-red-6) !important;
|
|
918
|
+
[data-mantine-color-scheme="dark"] .tool-call > summary.tool-call-header:hover {
|
|
919
|
+
background: var(--bg-tertiary);
|
|
859
920
|
}
|
|
860
921
|
|
|
861
|
-
|
|
862
|
-
|
|
863
|
-
overflow: hidden;
|
|
922
|
+
[data-mantine-color-scheme="dark"] .tool-call-body {
|
|
923
|
+
border-top-color: var(--border-muted);
|
|
864
924
|
}
|
|
865
925
|
|
|
866
|
-
|
|
867
|
-
[data-mantine-color-scheme="dark"] .
|
|
868
|
-
|
|
869
|
-
|
|
926
|
+
[data-mantine-color-scheme="dark"] .tool-call-success .tool-call-status-dot { background: #69db7c; }
|
|
927
|
+
[data-mantine-color-scheme="dark"] .tool-call-error .tool-call-status-dot { background: #ff8787; }
|
|
928
|
+
[data-mantine-color-scheme="dark"] .tool-call-running .tool-call-status-dot { background: #ffd43b; }
|
|
929
|
+
[data-mantine-color-scheme="dark"] .tool-call-pending .tool-call-status-dot { background: #5c5f66; }
|
|
930
|
+
|
|
931
|
+
[data-mantine-color-scheme="dark"] .tool-call-name { color: var(--text-primary); }
|
|
932
|
+
[data-mantine-color-scheme="dark"] .tool-call-label { color: var(--text-muted); }
|
|
933
|
+
|
|
934
|
+
[data-mantine-color-scheme="dark"] .tool-call-summary {
|
|
935
|
+
background: var(--bg-tertiary);
|
|
936
|
+
color: var(--text-muted);
|
|
870
937
|
}
|
|
871
938
|
|
|
872
|
-
[data-mantine-color-scheme="dark"] .
|
|
873
|
-
|
|
939
|
+
[data-mantine-color-scheme="dark"] .tool-call-summary:hover {
|
|
940
|
+
background: var(--border-subtle) !important;
|
|
874
941
|
}
|
|
875
942
|
|
|
876
|
-
[data-mantine-color-scheme="dark"] .
|
|
877
|
-
|
|
878
|
-
|
|
943
|
+
[data-mantine-color-scheme="dark"] .tool-call-args,
|
|
944
|
+
[data-mantine-color-scheme="dark"] .tool-call-result {
|
|
945
|
+
background: var(--bg-tertiary);
|
|
946
|
+
color: var(--text-secondary);
|
|
879
947
|
}
|
|
880
948
|
|
|
881
|
-
|
|
882
|
-
|
|
949
|
+
/* Input area */
|
|
950
|
+
[data-mantine-color-scheme="dark"] .chat-input {
|
|
951
|
+
border-color: var(--border-subtle) !important;
|
|
952
|
+
background: var(--bg-secondary) !important;
|
|
953
|
+
color: var(--text-primary) !important;
|
|
883
954
|
}
|
|
884
955
|
|
|
885
|
-
[data-mantine-color-scheme="dark"] .
|
|
886
|
-
color: var(--
|
|
956
|
+
[data-mantine-color-scheme="dark"] .chat-input:focus {
|
|
957
|
+
border-color: var(--accent-blue) !important;
|
|
958
|
+
box-shadow: 0 0 0 2px rgba(116, 192, 252, 0.15) !important;
|
|
887
959
|
}
|
|
888
960
|
|
|
889
|
-
[data-mantine-color-scheme="dark"] .
|
|
890
|
-
color: var(--
|
|
961
|
+
[data-mantine-color-scheme="dark"] .chat-input::placeholder {
|
|
962
|
+
color: var(--text-muted);
|
|
891
963
|
}
|
|
892
964
|
|
|
893
|
-
[data-mantine-color-scheme="dark"] .
|
|
894
|
-
|
|
965
|
+
[data-mantine-color-scheme="dark"] .send-btn:hover:not(:disabled) {
|
|
966
|
+
background: #3b82f6 !important;
|
|
895
967
|
}
|
|
896
968
|
|
|
897
|
-
|
|
898
|
-
|
|
969
|
+
/* File browser */
|
|
970
|
+
[data-mantine-color-scheme="dark"] .file-tree-item {
|
|
971
|
+
border-bottom-color: var(--border-muted);
|
|
899
972
|
}
|
|
900
973
|
|
|
901
|
-
[data-mantine-color-scheme="dark"] .
|
|
902
|
-
|
|
974
|
+
[data-mantine-color-scheme="dark"] .file-tree-item:hover {
|
|
975
|
+
background: var(--bg-tertiary) !important;
|
|
903
976
|
}
|
|
904
977
|
|
|
905
|
-
|
|
906
|
-
|
|
907
|
-
|
|
908
|
-
::-webkit-scrollbar {
|
|
909
|
-
width: 8px;
|
|
910
|
-
height: 8px;
|
|
978
|
+
[data-mantine-color-scheme="dark"] .file-item:hover,
|
|
979
|
+
[data-mantine-color-scheme="dark"] .folder-header:hover {
|
|
980
|
+
background: var(--bg-tertiary) !important;
|
|
911
981
|
}
|
|
912
982
|
|
|
913
|
-
|
|
914
|
-
background:
|
|
983
|
+
[data-mantine-color-scheme="dark"] .breadcrumb-bar {
|
|
984
|
+
background: var(--bg-tertiary);
|
|
915
985
|
}
|
|
916
986
|
|
|
917
|
-
|
|
918
|
-
background:
|
|
919
|
-
border-radius: 4px;
|
|
987
|
+
[data-mantine-color-scheme="dark"] .breadcrumb-clickable:hover {
|
|
988
|
+
background: var(--bg-secondary) !important;
|
|
920
989
|
}
|
|
921
990
|
|
|
922
|
-
|
|
923
|
-
|
|
991
|
+
/* Canvas */
|
|
992
|
+
[data-mantine-color-scheme="dark"] .canvas-item,
|
|
993
|
+
[data-mantine-color-scheme="dark"] .canvas-item-container {
|
|
994
|
+
background: var(--bg-secondary);
|
|
995
|
+
border-color: var(--border-subtle);
|
|
924
996
|
}
|
|
925
997
|
|
|
926
|
-
[data-mantine-color-scheme="dark"]
|
|
927
|
-
|
|
998
|
+
[data-mantine-color-scheme="dark"] .canvas-item-container:hover {
|
|
999
|
+
box-shadow: 0 2px 8px rgba(0, 0, 0, 0.4);
|
|
928
1000
|
}
|
|
929
1001
|
|
|
930
|
-
[data-mantine-color-scheme="dark"]
|
|
931
|
-
background: var(--
|
|
1002
|
+
[data-mantine-color-scheme="dark"] .canvas-item-header {
|
|
1003
|
+
background: var(--bg-tertiary);
|
|
1004
|
+
border-bottom-color: var(--border-muted);
|
|
932
1005
|
}
|
|
933
1006
|
|
|
934
|
-
|
|
935
|
-
|
|
936
|
-
|
|
1007
|
+
[data-mantine-color-scheme="dark"] .canvas-delete-btn:hover {
|
|
1008
|
+
color: #ff8787 !important;
|
|
1009
|
+
}
|
|
937
1010
|
|
|
938
|
-
|
|
939
|
-
|
|
940
|
-
|
|
941
|
-
|
|
942
|
-
border-
|
|
943
|
-
margin-bottom: 10px;
|
|
1011
|
+
/* Data tables */
|
|
1012
|
+
[data-mantine-color-scheme="dark"] .dataframe-table th,
|
|
1013
|
+
[data-mantine-color-scheme="dark"] .csv-preview-table th {
|
|
1014
|
+
background: var(--bg-tertiary);
|
|
1015
|
+
border-color: var(--border-subtle);
|
|
944
1016
|
}
|
|
945
1017
|
|
|
946
|
-
.
|
|
947
|
-
|
|
1018
|
+
[data-mantine-color-scheme="dark"] .dataframe-table td,
|
|
1019
|
+
[data-mantine-color-scheme="dark"] .csv-preview-table td {
|
|
1020
|
+
border-color: var(--border-muted);
|
|
948
1021
|
}
|
|
949
1022
|
|
|
950
|
-
.
|
|
951
|
-
|
|
1023
|
+
[data-mantine-color-scheme="dark"] .csv-preview-table tr:hover td {
|
|
1024
|
+
background: var(--bg-tertiary);
|
|
952
1025
|
}
|
|
953
1026
|
|
|
954
|
-
|
|
955
|
-
|
|
1027
|
+
/* Display inline */
|
|
1028
|
+
[data-mantine-color-scheme="dark"] .display-inline-container {
|
|
1029
|
+
background: var(--bg-secondary);
|
|
1030
|
+
border-color: var(--border-subtle);
|
|
956
1031
|
}
|
|
957
1032
|
|
|
958
|
-
.
|
|
959
|
-
color:
|
|
1033
|
+
[data-mantine-color-scheme="dark"] .display-inline-title {
|
|
1034
|
+
border-color: var(--border-muted);
|
|
960
1035
|
}
|
|
961
1036
|
|
|
962
|
-
.
|
|
963
|
-
background:
|
|
964
|
-
border: 1px solid #fde68a;
|
|
965
|
-
color: var(--mantine-color-text);
|
|
1037
|
+
[data-mantine-color-scheme="dark"] .display-inline-dataframe th {
|
|
1038
|
+
background: var(--bg-tertiary);
|
|
966
1039
|
}
|
|
967
1040
|
|
|
968
|
-
.
|
|
969
|
-
|
|
970
|
-
border:
|
|
971
|
-
color: var(--mantine-color-text);
|
|
1041
|
+
[data-mantine-color-scheme="dark"] .display-inline-dataframe th,
|
|
1042
|
+
[data-mantine-color-scheme="dark"] .display-inline-dataframe td {
|
|
1043
|
+
border-color: var(--border-subtle);
|
|
972
1044
|
}
|
|
973
1045
|
|
|
974
|
-
.
|
|
975
|
-
|
|
976
|
-
background:
|
|
977
|
-
color: var(--
|
|
1046
|
+
[data-mantine-color-scheme="dark"] .display-inline-json,
|
|
1047
|
+
[data-mantine-color-scheme="dark"] .display-inline-text {
|
|
1048
|
+
background: var(--bg-tertiary);
|
|
1049
|
+
border-color: var(--border-subtle);
|
|
978
1050
|
}
|
|
979
1051
|
|
|
980
|
-
|
|
981
|
-
|
|
982
|
-
|
|
983
|
-
|
|
984
|
-
|
|
985
|
-
font-weight: 500;
|
|
986
|
-
cursor: pointer;
|
|
987
|
-
transition: background 0.15s ease;
|
|
1052
|
+
/* Code blocks */
|
|
1053
|
+
[data-mantine-color-scheme="dark"] code,
|
|
1054
|
+
[data-mantine-color-scheme="dark"] pre {
|
|
1055
|
+
background: var(--bg-tertiary);
|
|
1056
|
+
color: var(--text-primary);
|
|
988
1057
|
}
|
|
989
1058
|
|
|
990
|
-
|
|
991
|
-
|
|
992
|
-
|
|
1059
|
+
/* Scrollbars */
|
|
1060
|
+
[data-mantine-color-scheme="dark"] ::-webkit-scrollbar-thumb {
|
|
1061
|
+
background: #4a4d55;
|
|
993
1062
|
}
|
|
994
1063
|
|
|
995
|
-
|
|
996
|
-
background: #
|
|
1064
|
+
[data-mantine-color-scheme="dark"] ::-webkit-scrollbar-thumb:hover {
|
|
1065
|
+
background: #5c5f66;
|
|
997
1066
|
}
|
|
998
1067
|
|
|
999
|
-
|
|
1000
|
-
|
|
1001
|
-
|
|
1068
|
+
/* Resize handle */
|
|
1069
|
+
[data-mantine-color-scheme="dark"] .resize-handle:hover {
|
|
1070
|
+
background: #4a4d55;
|
|
1002
1071
|
}
|
|
1003
1072
|
|
|
1004
|
-
.
|
|
1005
|
-
background: #
|
|
1073
|
+
[data-mantine-color-scheme="dark"] .resize-handle:active {
|
|
1074
|
+
background: #5c5f66;
|
|
1006
1075
|
}
|
|
1007
1076
|
|
|
1008
|
-
|
|
1009
|
-
|
|
1010
|
-
|
|
1077
|
+
/* Summary hover in dark mode */
|
|
1078
|
+
[data-mantine-color-scheme="dark"] details summary:hover {
|
|
1079
|
+
background: var(--bg-tertiary) !important;
|
|
1011
1080
|
}
|
|
1012
1081
|
|
|
1013
|
-
|
|
1014
|
-
|
|
1082
|
+
/* Display inline collapsible styles */
|
|
1083
|
+
.display-inline-container {
|
|
1084
|
+
border: 1px solid var(--mantine-color-default-border);
|
|
1085
|
+
background: var(--mantine-color-body);
|
|
1015
1086
|
}
|
|
1016
1087
|
|
|
1017
|
-
|
|
1018
|
-
|
|
1019
|
-
|
|
1020
|
-
|
|
1088
|
+
.display-inline-summary {
|
|
1089
|
+
cursor: pointer;
|
|
1090
|
+
font-weight: 500;
|
|
1091
|
+
font-size: 14px;
|
|
1092
|
+
padding: 6px 10px;
|
|
1093
|
+
padding-left: 24px;
|
|
1094
|
+
border-radius: 5px;
|
|
1095
|
+
list-style: none;
|
|
1096
|
+
position: relative;
|
|
1097
|
+
user-select: none;
|
|
1098
|
+
transition: background 0.15s ease;
|
|
1021
1099
|
}
|
|
1022
1100
|
|
|
1023
|
-
|
|
1024
|
-
|
|
1101
|
+
.display-inline-summary::-webkit-details-marker {
|
|
1102
|
+
display: none;
|
|
1025
1103
|
}
|
|
1026
1104
|
|
|
1027
|
-
|
|
1028
|
-
|
|
1105
|
+
.display-inline-summary::before {
|
|
1106
|
+
content: "▶";
|
|
1107
|
+
font-size: 9px;
|
|
1108
|
+
position: absolute;
|
|
1109
|
+
left: 10px;
|
|
1110
|
+
top: 50%;
|
|
1111
|
+
transform: translateY(-50%);
|
|
1112
|
+
transition: transform 0.15s ease;
|
|
1113
|
+
color: var(--mantine-color-dimmed);
|
|
1029
1114
|
}
|
|
1030
1115
|
|
|
1031
|
-
|
|
1032
|
-
|
|
1033
|
-
border-color: #78350f;
|
|
1116
|
+
details.display-inline-container[open] > .display-inline-summary::before {
|
|
1117
|
+
transform: translateY(-50%) rotate(90deg);
|
|
1034
1118
|
}
|
|
1035
1119
|
|
|
1036
|
-
|
|
1037
|
-
background:
|
|
1038
|
-
border-color: #78350f;
|
|
1120
|
+
.display-inline-summary:hover {
|
|
1121
|
+
background: var(--mantine-color-gray-1);
|
|
1039
1122
|
}
|
|
1040
1123
|
|
|
1041
|
-
[data-mantine-color-scheme="dark"] .
|
|
1042
|
-
|
|
1043
|
-
background: var(--mantine-color-dark-7);
|
|
1124
|
+
[data-mantine-color-scheme="dark"] .display-inline-summary:hover {
|
|
1125
|
+
background: var(--mantine-color-dark-5);
|
|
1044
1126
|
}
|
|
1045
1127
|
|
|
1046
|
-
|
|
1047
|
-
|
|
1128
|
+
.display-inline-content {
|
|
1129
|
+
padding: 0 10px 5px 10px;
|
|
1048
1130
|
}
|
|
1049
1131
|
|
|
1050
|
-
|
|
1051
|
-
|
|
1132
|
+
.display-inline-image {
|
|
1133
|
+
display: block;
|
|
1134
|
+
margin: 0 auto;
|
|
1052
1135
|
}
|
|
1053
1136
|
|
|
1054
|
-
|
|
1055
|
-
|
|
1137
|
+
/* Add to Canvas button in display inline header */
|
|
1138
|
+
.add-to-canvas-btn {
|
|
1139
|
+
opacity: 0.5;
|
|
1140
|
+
transition: opacity 0.15s ease, color 0.15s ease;
|
|
1141
|
+
flex-shrink: 0;
|
|
1142
|
+
margin-left: 8px;
|
|
1056
1143
|
}
|
|
1057
1144
|
|
|
1058
|
-
|
|
1059
|
-
|
|
1145
|
+
.add-to-canvas-btn:hover {
|
|
1146
|
+
opacity: 1;
|
|
1147
|
+
color: var(--mantine-color-blue-6);
|
|
1060
1148
|
}
|
|
1061
1149
|
|
|
1062
|
-
|
|
1063
|
-
|
|
1064
|
-
color: var(--mantine-color-dark-0);
|
|
1150
|
+
.display-inline-summary-row {
|
|
1151
|
+
padding-right: 4px;
|
|
1065
1152
|
}
|
|
1066
1153
|
|
|
1067
|
-
|
|
1068
|
-
|
|
1154
|
+
.display-inline-summary-text {
|
|
1155
|
+
flex: 1;
|
|
1156
|
+
min-width: 0;
|
|
1157
|
+
overflow: hidden;
|
|
1158
|
+
text-overflow: ellipsis;
|
|
1159
|
+
white-space: nowrap;
|
|
1069
1160
|
}
|