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