@dwelle/excalidraw 0.5.0-e05a141 → 0.5.0-e2a82c4d8
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/dev/{chunk-JCMFCSXV.js → chunk-7M7SVUYU.js} +121 -7
- package/dist/dev/chunk-7M7SVUYU.js.map +7 -0
- package/dist/dev/{chunk-P7XQCHXR.js → chunk-HJWER26G.js} +901 -439
- package/dist/dev/chunk-HJWER26G.js.map +7 -0
- package/dist/dev/{chunk-B7UQ5W6R.js → chunk-Q5BO7QEK.js} +2 -2
- package/dist/dev/{chunk-B7UQ5W6R.js.map → chunk-Q5BO7QEK.js.map} +1 -1
- package/dist/dev/components/TTDDialog/CodeMirrorEditor-4GD6MAJW.js +259 -0
- package/dist/dev/components/TTDDialog/CodeMirrorEditor-4GD6MAJW.js.map +7 -0
- package/dist/dev/data/{image-BUI6GQJR.js → image-UQK7BQY4.js} +3 -3
- package/dist/dev/index.css +2444 -173
- package/dist/dev/index.css.map +3 -3
- package/dist/dev/index.js +6875 -1415
- package/dist/dev/index.js.map +4 -4
- package/dist/dev/locales/{en-SEGQGVZN.js → en-IHKMFGHF.js} +6 -2
- package/dist/dev/subset-shared.chunk.js +1 -1
- package/dist/dev/subset-worker.chunk.js +1 -1
- package/dist/prod/chunk-QHCRJDAB.js +12 -0
- package/dist/prod/chunk-R2CZDOAE.js +34 -0
- package/dist/prod/{chunk-KDBB3MAO.js → chunk-XXRJJHWR.js} +1 -1
- package/dist/prod/components/TTDDialog/CodeMirrorEditor-P2CDXXOC.js +1 -0
- package/dist/prod/data/image-WAWRV65K.js +1 -0
- package/dist/prod/index.css +1 -1
- package/dist/prod/index.js +34 -25
- package/dist/prod/locales/en-QQWGF6XN.js +1 -0
- package/dist/prod/subset-shared.chunk.js +1 -1
- package/dist/prod/subset-worker.chunk.js +1 -1
- package/dist/types/common/src/utils.d.ts +5 -3
- package/dist/types/element/src/Scene.d.ts +2 -0
- package/dist/types/element/src/arrowheads.d.ts +3 -0
- package/dist/types/element/src/binding.d.ts +5 -4
- package/dist/types/element/src/bounds.d.ts +5 -3
- package/dist/types/element/src/elbowArrow.d.ts +2 -0
- package/dist/types/element/src/frame.d.ts +1 -1
- package/dist/types/element/src/index.d.ts +1 -0
- package/dist/types/element/src/linearElementEditor.d.ts +5 -2
- package/dist/types/element/src/mutateElement.d.ts +2 -0
- package/dist/types/element/src/selection.d.ts +7 -3
- package/dist/types/element/src/shape.d.ts +1 -1
- package/dist/types/element/src/textElement.d.ts +1 -1
- package/dist/types/element/src/textWrapping.d.ts +26 -0
- package/dist/types/element/src/types.d.ts +4 -1
- package/dist/types/element/src/utils.d.ts +2 -2
- package/dist/types/excalidraw/TTA/TTAChatEmptyState.d.ts +7 -0
- package/dist/types/excalidraw/TTA/TTAChatMessage.d.ts +15 -0
- package/dist/types/excalidraw/TTA/TTAComposer.d.ts +24 -0
- package/dist/types/excalidraw/TTA/TTADialog.d.ts +19 -0
- package/dist/types/excalidraw/TTA/TTADialogPanel.d.ts +46 -0
- package/dist/types/excalidraw/TTA/TTADialogTrigger.d.ts +10 -0
- package/dist/types/excalidraw/TTA/TTAHistory.d.ts +11 -0
- package/dist/types/excalidraw/TTA/TTAWarningMessage.d.ts +5 -0
- package/dist/types/excalidraw/TTA/chatErrors.d.ts +13 -0
- package/dist/types/excalidraw/TTA/chatHelpers.d.ts +26 -0
- package/dist/types/excalidraw/TTA/client.d.ts +74 -0
- package/dist/types/excalidraw/TTA/history.d.ts +2 -0
- package/dist/types/excalidraw/TTA/insertAISkeletons.d.ts +20 -0
- package/dist/types/excalidraw/TTA/types.d.ts +167 -0
- package/dist/types/excalidraw/TTA/useAIAssistantPreview.d.ts +18 -0
- package/dist/types/excalidraw/TTA/useAIStreamingCanvasPreview.d.ts +21 -0
- package/dist/types/excalidraw/TTA/useAIStreamingLifecycle.d.ts +34 -0
- package/dist/types/excalidraw/TTA/useTTAChatHistory.d.ts +18 -0
- package/dist/types/excalidraw/TTA/utils.d.ts +14 -0
- package/dist/types/excalidraw/actions/actionAddToLibrary.d.ts +15 -6
- package/dist/types/excalidraw/actions/actionBoundText.d.ts +11 -5
- package/dist/types/excalidraw/actions/actionCanvas.d.ts +50 -20
- package/dist/types/excalidraw/actions/actionClipboard.d.ts +10 -4
- package/dist/types/excalidraw/actions/actionCropEditor.d.ts +5 -2
- package/dist/types/excalidraw/actions/actionDeleteSelected.d.ts +15 -6
- package/dist/types/excalidraw/actions/actionDeselect.d.ts +161 -0
- package/dist/types/excalidraw/actions/actionElementLink.d.ts +5 -2
- package/dist/types/excalidraw/actions/actionElementLock.d.ts +10 -4
- package/dist/types/excalidraw/actions/actionEmbeddable.d.ts +5 -2
- package/dist/types/excalidraw/actions/actionExport.d.ts +21 -8
- package/dist/types/excalidraw/actions/actionFrame.d.ts +20 -8
- package/dist/types/excalidraw/actions/actionGroup.d.ts +11 -5
- package/dist/types/excalidraw/actions/actionLinearEditor.d.ts +5 -2
- package/dist/types/excalidraw/actions/actionLink.d.ts +5 -2
- package/dist/types/excalidraw/actions/actionMenu.d.ts +5 -2
- package/dist/types/excalidraw/actions/actionProperties.d.ts +12 -6
- package/dist/types/excalidraw/actions/actionSelectAll.d.ts +5 -2
- package/dist/types/excalidraw/actions/actionStyles.d.ts +6 -2
- package/dist/types/excalidraw/actions/actionTextAutoResize.d.ts +3 -3
- package/dist/types/excalidraw/actions/actionToggleArrowBinding.d.ts +174 -0
- package/dist/types/excalidraw/actions/actionToggleGridMode.d.ts +5 -2
- package/dist/types/excalidraw/actions/actionToggleMidpointSnapping.d.ts +174 -0
- package/dist/types/excalidraw/actions/actionToggleObjectsSnapMode.d.ts +5 -2
- package/dist/types/excalidraw/actions/actionToggleSearchMenu.d.ts +5 -2
- package/dist/types/excalidraw/actions/actionToggleStats.d.ts +5 -2
- package/dist/types/excalidraw/actions/actionToggleViewMode.d.ts +5 -2
- package/dist/types/excalidraw/actions/actionToggleZenMode.d.ts +5 -2
- package/dist/types/excalidraw/actions/index.d.ts +3 -0
- package/dist/types/excalidraw/actions/types.d.ts +1 -1
- package/dist/types/excalidraw/aiWarnings.d.ts +7 -0
- package/dist/types/excalidraw/appState.d.ts +4 -0
- package/dist/types/excalidraw/components/AI/ChatMessage.d.ts +33 -0
- package/dist/types/excalidraw/components/AI/index.d.ts +2 -0
- package/dist/types/excalidraw/components/App.d.ts +11 -1
- package/dist/types/excalidraw/components/FilledButton.d.ts +1 -1
- package/dist/types/excalidraw/components/IconPicker.d.ts +14 -9
- package/dist/types/excalidraw/components/Range.d.ts +10 -4
- package/dist/types/excalidraw/components/TTDDialog/Chat/TTDRateLimitWarningContent.d.ts +5 -0
- package/dist/types/excalidraw/components/TTDDialog/CodeMirrorEditor.d.ts +11 -0
- package/dist/types/excalidraw/components/TTDDialog/TTDDialog.d.ts +2 -2
- package/dist/types/excalidraw/components/TTDDialog/TTDDialogInput.d.ts +3 -3
- package/dist/types/excalidraw/components/TTDDialog/TTDDialogOutput.d.ts +4 -1
- package/dist/types/excalidraw/components/TTDDialog/mermaid-lang-lite.d.ts +2 -0
- package/dist/types/excalidraw/components/TTDDialog/types.d.ts +5 -1
- package/dist/types/excalidraw/components/TTDDialog/utils/TTDStreamFetch.d.ts +24 -6
- package/dist/types/excalidraw/components/TTDDialog/utils/mermaidAutoFix.d.ts +1 -0
- package/dist/types/excalidraw/components/TTDDialog/utils/mermaidError.d.ts +10 -0
- package/dist/types/excalidraw/components/canvases/InteractiveCanvas.d.ts +1 -0
- package/dist/types/excalidraw/components/dropdownMenu/DropdownMenuItemContentRadio.d.ts +2 -1
- package/dist/types/excalidraw/components/icons.d.ts +18 -8
- package/dist/types/excalidraw/components/main-menu/DefaultItems.d.ts +3 -0
- package/dist/types/excalidraw/context/tunnels.d.ts +1 -0
- package/dist/types/excalidraw/data/blob.d.ts +9 -3
- package/dist/types/excalidraw/data/filesystem.d.ts +3 -3
- package/dist/types/excalidraw/data/index.d.ts +1 -1
- package/dist/types/excalidraw/data/json.d.ts +6 -3
- package/dist/types/excalidraw/data/resave.d.ts +1 -1
- package/dist/types/excalidraw/data/sse.d.ts +15 -0
- package/dist/types/excalidraw/index.d.ts +15 -2
- package/dist/types/excalidraw/textAutoResizeHandle.d.ts +15 -0
- package/dist/types/excalidraw/types.d.ts +15 -2
- package/dist/types/excalidraw/wysiwyg/textWysiwyg.d.ts +5 -1
- package/dist/types/math/src/curve.d.ts +4 -1
- package/dist/types/math/src/point.d.ts +1 -1
- package/package.json +11 -5
- package/CHANGELOG.md +0 -2385
- package/dist/dev/chunk-JCMFCSXV.js.map +0 -7
- package/dist/dev/chunk-P7XQCHXR.js.map +0 -7
- package/dist/prod/chunk-FVPDTNSG.js +0 -12
- package/dist/prod/chunk-LRBVLW2I.js +0 -33
- package/dist/prod/data/image-KI7JN73E.js +0 -1
- package/dist/prod/locales/en-6237XDE7.js +0 -1
- package/dist/types/excalidraw/data/ai/types.d.ts +0 -242
- package/history.ts +0 -249
- /package/dist/dev/data/{image-BUI6GQJR.js.map → image-UQK7BQY4.js.map} +0 -0
- /package/dist/dev/locales/{en-SEGQGVZN.js.map → en-IHKMFGHF.js.map} +0 -0
package/dist/dev/index.css
CHANGED
|
@@ -285,9 +285,13 @@
|
|
|
285
285
|
--popup-text-inverted-color: #fff;
|
|
286
286
|
--select-highlight-color: #339af0;
|
|
287
287
|
--shadow-island:
|
|
288
|
-
0px 0px
|
|
289
|
-
0px 0px
|
|
288
|
+
0px 0px 1px 0px rgba(0, 0, 0, 0.17),
|
|
289
|
+
0px 0px 3px 0px rgba(0, 0, 0, 0.08),
|
|
290
290
|
0px 7px 14px 0px rgba(0, 0, 0, 0.05);
|
|
291
|
+
--shadow-island-stronger:
|
|
292
|
+
0px 0px 1px 0px rgba(0, 0, 0, 0.17),
|
|
293
|
+
0px 0px 3px 0px rgba(0, 0, 0, 0.08),
|
|
294
|
+
0px 7px 14px 0px rgb(0 0 0 / 18%);
|
|
291
295
|
--button-hover-bg: var(--color-surface-high);
|
|
292
296
|
--button-active-bg: var(--color-surface-high);
|
|
293
297
|
--button-active-border: var(--color-brand-active);
|
|
@@ -328,6 +332,7 @@
|
|
|
328
332
|
--chat-msg-shadow: 0 1px 2px rgba(0, 0, 0, 0.1);
|
|
329
333
|
--space-factor: 0.25rem;
|
|
330
334
|
--text-primary-color: var(--color-on-surface);
|
|
335
|
+
--text-secondary-color: #6f6f78;
|
|
331
336
|
--color-selection: #6965db;
|
|
332
337
|
--color-icon-white: #fff;
|
|
333
338
|
--color-primary: #6965db;
|
|
@@ -448,10 +453,6 @@
|
|
|
448
453
|
--popup-text-color: #ced4da;
|
|
449
454
|
--popup-text-inverted-color: #2c2c2c;
|
|
450
455
|
--select-highlight-color: #4dabf7;
|
|
451
|
-
--shadow-island:
|
|
452
|
-
0px 0px 0.9310142993927002px 0px rgba(0, 0, 0, 0.17),
|
|
453
|
-
0px 0px 3.1270833015441895px 0px rgba(0, 0, 0, 0.08),
|
|
454
|
-
0px 7px 14px 0px rgba(0, 0, 0, 0.05);
|
|
455
456
|
--modal-shadow:
|
|
456
457
|
0px 100px 80px rgba(0, 0, 0, 0.07),
|
|
457
458
|
0px 41.7776px 33.4221px rgba(0, 0, 0, 0.0503198),
|
|
@@ -465,6 +466,7 @@
|
|
|
465
466
|
--color-slider-track: hsl(244, 23%, 39%);
|
|
466
467
|
--color-selection: #3530c4;
|
|
467
468
|
--color-icon-white: var(--color-gray-90);
|
|
469
|
+
--text-secondary-color: #b8b7c6;
|
|
468
470
|
--color-primary: #a8a5ff;
|
|
469
471
|
--color-primary-darker: #b2aeff;
|
|
470
472
|
--color-primary-darkest: #beb9ff;
|
|
@@ -1146,13 +1148,18 @@
|
|
|
1146
1148
|
padding: 0.5rem;
|
|
1147
1149
|
background: var(--popup-bg-color);
|
|
1148
1150
|
border: 0 solid rgba(255, 255, 255, 0.25);
|
|
1149
|
-
box-shadow: var(--shadow-island);
|
|
1151
|
+
box-shadow: var(--shadow-island-stronger);
|
|
1150
1152
|
border-radius: 4px;
|
|
1151
|
-
position: absolute;
|
|
1152
1153
|
}
|
|
1153
1154
|
:root[dir=rtl] .excalidraw .picker {
|
|
1154
1155
|
padding: 0.4rem;
|
|
1155
1156
|
}
|
|
1157
|
+
.excalidraw .picker-sections,
|
|
1158
|
+
.excalidraw .picker-section {
|
|
1159
|
+
display: flex;
|
|
1160
|
+
flex-direction: column;
|
|
1161
|
+
gap: 0.5rem;
|
|
1162
|
+
}
|
|
1156
1163
|
.excalidraw .picker-container button,
|
|
1157
1164
|
.excalidraw .picker button {
|
|
1158
1165
|
position: relative;
|
|
@@ -1199,7 +1206,12 @@
|
|
|
1199
1206
|
}
|
|
1200
1207
|
.excalidraw .picker-collapsible {
|
|
1201
1208
|
font-size: 0.75rem;
|
|
1202
|
-
padding: 0
|
|
1209
|
+
padding: 0;
|
|
1210
|
+
color: var(--text-primary-color);
|
|
1211
|
+
}
|
|
1212
|
+
.excalidraw .picker-section-label {
|
|
1213
|
+
font-size: 0.75rem;
|
|
1214
|
+
color: var(--text-primary-color);
|
|
1203
1215
|
}
|
|
1204
1216
|
.excalidraw .picker-keybinding {
|
|
1205
1217
|
position: absolute;
|
|
@@ -1756,7 +1768,7 @@
|
|
|
1756
1768
|
|
|
1757
1769
|
/* components/dropdownMenu/DropdownMenu.scss */
|
|
1758
1770
|
.excalidraw .dropdown-menu {
|
|
1759
|
-
max-width:
|
|
1771
|
+
max-width: 20rem;
|
|
1760
1772
|
z-index: 1;
|
|
1761
1773
|
}
|
|
1762
1774
|
.excalidraw .dropdown-menu--placement-top {
|
|
@@ -1898,6 +1910,18 @@
|
|
|
1898
1910
|
background-color: var(--button-hover-bg);
|
|
1899
1911
|
box-shadow: 0 0 0 1px var(--color-brand-active);
|
|
1900
1912
|
}
|
|
1913
|
+
.excalidraw .dropdown-menu .dropdown-menu-item[disabled] {
|
|
1914
|
+
cursor: not-allowed;
|
|
1915
|
+
opacity: 0.5;
|
|
1916
|
+
pointer-events: none;
|
|
1917
|
+
}
|
|
1918
|
+
.excalidraw .dropdown-menu .dropdown-menu-item[disabled]:hover {
|
|
1919
|
+
background-color: transparent;
|
|
1920
|
+
}
|
|
1921
|
+
.excalidraw .dropdown-menu .dropdown-menu-item[disabled]:active {
|
|
1922
|
+
background-color: transparent;
|
|
1923
|
+
box-shadow: none;
|
|
1924
|
+
}
|
|
1901
1925
|
.excalidraw .dropdown-menu .dropdown-menu-item svg {
|
|
1902
1926
|
width: 1rem;
|
|
1903
1927
|
height: 1rem;
|
|
@@ -2327,9 +2351,13 @@
|
|
|
2327
2351
|
--popup-text-inverted-color: #fff;
|
|
2328
2352
|
--select-highlight-color: #339af0;
|
|
2329
2353
|
--shadow-island:
|
|
2330
|
-
0px 0px
|
|
2331
|
-
0px 0px
|
|
2354
|
+
0px 0px 1px 0px rgba(0, 0, 0, 0.17),
|
|
2355
|
+
0px 0px 3px 0px rgba(0, 0, 0, 0.08),
|
|
2332
2356
|
0px 7px 14px 0px rgba(0, 0, 0, 0.05);
|
|
2357
|
+
--shadow-island-stronger:
|
|
2358
|
+
0px 0px 1px 0px rgba(0, 0, 0, 0.17),
|
|
2359
|
+
0px 0px 3px 0px rgba(0, 0, 0, 0.08),
|
|
2360
|
+
0px 7px 14px 0px rgb(0 0 0 / 18%);
|
|
2333
2361
|
--button-hover-bg: var(--color-surface-high);
|
|
2334
2362
|
--button-active-bg: var(--color-surface-high);
|
|
2335
2363
|
--button-active-border: var(--color-brand-active);
|
|
@@ -2370,6 +2398,7 @@
|
|
|
2370
2398
|
--chat-msg-shadow: 0 1px 2px rgba(0, 0, 0, 0.1);
|
|
2371
2399
|
--space-factor: 0.25rem;
|
|
2372
2400
|
--text-primary-color: var(--color-on-surface);
|
|
2401
|
+
--text-secondary-color: #6f6f78;
|
|
2373
2402
|
--color-selection: #6965db;
|
|
2374
2403
|
--color-icon-white: #fff;
|
|
2375
2404
|
--color-primary: #6965db;
|
|
@@ -2490,10 +2519,6 @@
|
|
|
2490
2519
|
--popup-text-color: #ced4da;
|
|
2491
2520
|
--popup-text-inverted-color: #2c2c2c;
|
|
2492
2521
|
--select-highlight-color: #4dabf7;
|
|
2493
|
-
--shadow-island:
|
|
2494
|
-
0px 0px 0.9310142993927002px 0px rgba(0, 0, 0, 0.17),
|
|
2495
|
-
0px 0px 3.1270833015441895px 0px rgba(0, 0, 0, 0.08),
|
|
2496
|
-
0px 7px 14px 0px rgba(0, 0, 0, 0.05);
|
|
2497
2522
|
--modal-shadow:
|
|
2498
2523
|
0px 100px 80px rgba(0, 0, 0, 0.07),
|
|
2499
2524
|
0px 41.7776px 33.4221px rgba(0, 0, 0, 0.0503198),
|
|
@@ -2507,6 +2532,7 @@
|
|
|
2507
2532
|
--color-slider-track: hsl(244, 23%, 39%);
|
|
2508
2533
|
--color-selection: #3530c4;
|
|
2509
2534
|
--color-icon-white: var(--color-gray-90);
|
|
2535
|
+
--text-secondary-color: #b8b7c6;
|
|
2510
2536
|
--color-primary: #a8a5ff;
|
|
2511
2537
|
--color-primary-darker: #b2aeff;
|
|
2512
2538
|
--color-primary-darkest: #beb9ff;
|
|
@@ -4069,14 +4095,16 @@
|
|
|
4069
4095
|
border-radius: 10px;
|
|
4070
4096
|
background: var(--RadioGroup-background);
|
|
4071
4097
|
border: 1px solid var(--RadioGroup-border);
|
|
4098
|
+
gap: 2px;
|
|
4072
4099
|
}
|
|
4073
4100
|
.excalidraw .RadioGroup__choice {
|
|
4074
4101
|
position: relative;
|
|
4075
4102
|
display: flex;
|
|
4076
4103
|
align-items: center;
|
|
4077
4104
|
justify-content: center;
|
|
4078
|
-
width:
|
|
4105
|
+
min-width: 20px;
|
|
4079
4106
|
height: 24px;
|
|
4107
|
+
padding: 0 0.375rem;
|
|
4080
4108
|
color: var(--RadioGroup-choice-color-off);
|
|
4081
4109
|
background: var(--RadioGroup-choice-background-off);
|
|
4082
4110
|
border-radius: 8px;
|
|
@@ -4155,7 +4183,7 @@
|
|
|
4155
4183
|
color: var(--text-color);
|
|
4156
4184
|
background-color: var(--back-color);
|
|
4157
4185
|
border-color: var(--border-color);
|
|
4158
|
-
border-radius:
|
|
4186
|
+
border-radius: var(--border-radius-lg);
|
|
4159
4187
|
border-width: 1px;
|
|
4160
4188
|
border-style: solid;
|
|
4161
4189
|
font-family: var(--font-family);
|
|
@@ -4390,6 +4418,17 @@
|
|
|
4390
4418
|
.excalidraw .ExcButton--size-medium .ExcButton__contents {
|
|
4391
4419
|
gap: 0.5rem;
|
|
4392
4420
|
}
|
|
4421
|
+
.excalidraw .ExcButton--size-small {
|
|
4422
|
+
font-weight: 600;
|
|
4423
|
+
font-size: 0.675rem;
|
|
4424
|
+
min-height: 2rem;
|
|
4425
|
+
padding: 0.25rem 0.75rem;
|
|
4426
|
+
letter-spacing: normal;
|
|
4427
|
+
border-radius: var(--border-radius-md);
|
|
4428
|
+
}
|
|
4429
|
+
.excalidraw .ExcButton--size-small .ExcButton__contents {
|
|
4430
|
+
gap: 0.375rem;
|
|
4431
|
+
}
|
|
4393
4432
|
.excalidraw .ExcButton--variant-icon {
|
|
4394
4433
|
padding: 0.5rem 0.75rem;
|
|
4395
4434
|
width: 3rem;
|
|
@@ -4627,6 +4666,301 @@
|
|
|
4627
4666
|
padding-inline: 2.5rem;
|
|
4628
4667
|
}
|
|
4629
4668
|
|
|
4669
|
+
/* components/AI/ChatMessage.scss */
|
|
4670
|
+
.ai-chat-message {
|
|
4671
|
+
display: flex;
|
|
4672
|
+
flex-direction: column;
|
|
4673
|
+
gap: 0.35rem;
|
|
4674
|
+
position: relative;
|
|
4675
|
+
padding-bottom: 0.5rem;
|
|
4676
|
+
}
|
|
4677
|
+
.ai-chat-message--user {
|
|
4678
|
+
flex-direction: column;
|
|
4679
|
+
align-items: flex-end;
|
|
4680
|
+
gap: 0.5rem;
|
|
4681
|
+
}
|
|
4682
|
+
.ai-chat-message--user .ai-chat-message__bubble {
|
|
4683
|
+
align-self: flex-end;
|
|
4684
|
+
background: var(--color-primary-light);
|
|
4685
|
+
border-radius: 0.5rem;
|
|
4686
|
+
max-width: 80%;
|
|
4687
|
+
}
|
|
4688
|
+
.ai-chat-message--user .ai-chat-message__actions {
|
|
4689
|
+
opacity: 1;
|
|
4690
|
+
position: static;
|
|
4691
|
+
justify-content: flex-end;
|
|
4692
|
+
align-self: flex-end;
|
|
4693
|
+
}
|
|
4694
|
+
.ai-chat-message--assistant {
|
|
4695
|
+
flex-direction: column;
|
|
4696
|
+
align-items: flex-start;
|
|
4697
|
+
width: 100%;
|
|
4698
|
+
padding-bottom: 2.5rem;
|
|
4699
|
+
}
|
|
4700
|
+
.ai-chat-message--assistant .ai-chat-message__bubble {
|
|
4701
|
+
background: transparent;
|
|
4702
|
+
border-radius: 0.5rem;
|
|
4703
|
+
position: relative;
|
|
4704
|
+
width: 100%;
|
|
4705
|
+
box-sizing: border-box;
|
|
4706
|
+
padding-bottom: 0.75rem;
|
|
4707
|
+
user-select: text;
|
|
4708
|
+
-webkit-user-select: text;
|
|
4709
|
+
}
|
|
4710
|
+
.ai-chat-message--assistant .ai-chat-message__actions {
|
|
4711
|
+
justify-content: flex-start;
|
|
4712
|
+
width: 100%;
|
|
4713
|
+
pointer-events: auto;
|
|
4714
|
+
z-index: 1;
|
|
4715
|
+
margin-top: 0.5rem;
|
|
4716
|
+
}
|
|
4717
|
+
.ai-chat-message--system {
|
|
4718
|
+
justify-content: flex-start;
|
|
4719
|
+
}
|
|
4720
|
+
.ai-chat-message--system .ai-chat-message__bubble {
|
|
4721
|
+
background: var(--color-warning);
|
|
4722
|
+
color: var(--color-warning-color);
|
|
4723
|
+
border-radius: 0.5rem;
|
|
4724
|
+
min-width: 6rem;
|
|
4725
|
+
}
|
|
4726
|
+
.ai-chat-message--system .ai-chat-message__bubble .ai-chat-message__header-label,
|
|
4727
|
+
.ai-chat-message--system .ai-chat-message__bubble .ai-chat-message__header-timestamp {
|
|
4728
|
+
color: inherit;
|
|
4729
|
+
}
|
|
4730
|
+
.ai-chat-message--error:hover .ai-chat-message__actions {
|
|
4731
|
+
opacity: 1;
|
|
4732
|
+
}
|
|
4733
|
+
.ai-chat-message--error .ai-chat-message__bubble {
|
|
4734
|
+
background: transparent;
|
|
4735
|
+
border-radius: 0.5rem;
|
|
4736
|
+
position: relative;
|
|
4737
|
+
width: 100%;
|
|
4738
|
+
box-sizing: border-box;
|
|
4739
|
+
padding-bottom: 0.75rem;
|
|
4740
|
+
}
|
|
4741
|
+
.ai-chat-message--error .ai-chat-message__actions {
|
|
4742
|
+
justify-content: flex-start;
|
|
4743
|
+
width: 100%;
|
|
4744
|
+
opacity: 1;
|
|
4745
|
+
}
|
|
4746
|
+
.ai-chat-message__actions {
|
|
4747
|
+
display: flex;
|
|
4748
|
+
align-items: center;
|
|
4749
|
+
gap: 0.75rem;
|
|
4750
|
+
transition: opacity 0.2s ease;
|
|
4751
|
+
}
|
|
4752
|
+
.ai-chat-message__bubble {
|
|
4753
|
+
border-radius: var(--border-radius-md);
|
|
4754
|
+
padding: 0.75rem;
|
|
4755
|
+
display: flex;
|
|
4756
|
+
flex-direction: column;
|
|
4757
|
+
gap: 0.35rem;
|
|
4758
|
+
}
|
|
4759
|
+
.ai-chat-message__header {
|
|
4760
|
+
display: flex;
|
|
4761
|
+
align-items: center;
|
|
4762
|
+
justify-content: space-between;
|
|
4763
|
+
gap: 0.25rem;
|
|
4764
|
+
}
|
|
4765
|
+
.ai-chat-message__header-label {
|
|
4766
|
+
font-family: var(--ui-font, system-ui, sans-serif);
|
|
4767
|
+
font-size: 0.75rem;
|
|
4768
|
+
font-weight: 600;
|
|
4769
|
+
font-variation-settings: "wght" 600;
|
|
4770
|
+
color: var(--text-primary-color);
|
|
4771
|
+
white-space: nowrap;
|
|
4772
|
+
overflow: hidden;
|
|
4773
|
+
text-overflow: ellipsis;
|
|
4774
|
+
}
|
|
4775
|
+
.ai-chat-message__header-timestamp {
|
|
4776
|
+
font-size: 0.625rem;
|
|
4777
|
+
font-weight: 400;
|
|
4778
|
+
color: var(--color-on-surface, var(--text-secondary-color));
|
|
4779
|
+
white-space: nowrap;
|
|
4780
|
+
}
|
|
4781
|
+
.ai-chat-message__image {
|
|
4782
|
+
max-width: 100%;
|
|
4783
|
+
margin-bottom: 0.5rem;
|
|
4784
|
+
border-radius: 8px;
|
|
4785
|
+
overflow: hidden;
|
|
4786
|
+
cursor: pointer;
|
|
4787
|
+
background: var(--default-bg-color);
|
|
4788
|
+
}
|
|
4789
|
+
.ai-chat-message__image img {
|
|
4790
|
+
display: block;
|
|
4791
|
+
width: 100%;
|
|
4792
|
+
height: auto;
|
|
4793
|
+
object-fit: contain;
|
|
4794
|
+
max-height: 200px;
|
|
4795
|
+
}
|
|
4796
|
+
.ai-chat-message__image:hover {
|
|
4797
|
+
opacity: 0.9;
|
|
4798
|
+
}
|
|
4799
|
+
.ai-chat-message__image:focus-visible {
|
|
4800
|
+
outline: 2px solid var(--color-primary);
|
|
4801
|
+
outline-offset: 2px;
|
|
4802
|
+
}
|
|
4803
|
+
.ai-chat-message__content {
|
|
4804
|
+
white-space: pre-wrap;
|
|
4805
|
+
word-break: break-word;
|
|
4806
|
+
user-select: text;
|
|
4807
|
+
-webkit-user-select: text;
|
|
4808
|
+
line-height: 1.5;
|
|
4809
|
+
}
|
|
4810
|
+
.ai-chat-message__content--pending {
|
|
4811
|
+
color: var(--text-secondary-color);
|
|
4812
|
+
}
|
|
4813
|
+
.ai-chat-message__cursor {
|
|
4814
|
+
display: inline-block;
|
|
4815
|
+
margin-left: 2px;
|
|
4816
|
+
color: currentColor;
|
|
4817
|
+
animation: ai-chat-cursor-blink 1s infinite;
|
|
4818
|
+
}
|
|
4819
|
+
.ai-chat-message__preview {
|
|
4820
|
+
margin-top: 0.35rem;
|
|
4821
|
+
background: transparent;
|
|
4822
|
+
padding: 0;
|
|
4823
|
+
display: flex;
|
|
4824
|
+
align-items: center;
|
|
4825
|
+
justify-content: center;
|
|
4826
|
+
position: relative;
|
|
4827
|
+
cursor: pointer;
|
|
4828
|
+
outline: none;
|
|
4829
|
+
border-radius: var(--border-radius-md);
|
|
4830
|
+
overflow: hidden;
|
|
4831
|
+
}
|
|
4832
|
+
.ai-chat-message__preview img {
|
|
4833
|
+
width: 100%;
|
|
4834
|
+
height: auto;
|
|
4835
|
+
object-fit: contain;
|
|
4836
|
+
display: block;
|
|
4837
|
+
}
|
|
4838
|
+
.ai-chat-message__preview:focus-visible {
|
|
4839
|
+
outline: 2px solid var(--color-primary);
|
|
4840
|
+
outline-offset: 2px;
|
|
4841
|
+
}
|
|
4842
|
+
.ai-chat-message__action {
|
|
4843
|
+
display: inline-flex;
|
|
4844
|
+
align-items: center;
|
|
4845
|
+
justify-content: center;
|
|
4846
|
+
background: none;
|
|
4847
|
+
border: none;
|
|
4848
|
+
cursor: pointer;
|
|
4849
|
+
padding: 0.25rem 0;
|
|
4850
|
+
margin: 0;
|
|
4851
|
+
color: var(--text-secondary-color);
|
|
4852
|
+
transition: color 0.2s ease, transform 0.2s ease;
|
|
4853
|
+
flex-shrink: 0;
|
|
4854
|
+
gap: 0.25rem;
|
|
4855
|
+
}
|
|
4856
|
+
.ai-chat-message__action svg {
|
|
4857
|
+
width: 0.875rem;
|
|
4858
|
+
height: 0.875rem;
|
|
4859
|
+
opacity: 1;
|
|
4860
|
+
color: currentColor;
|
|
4861
|
+
}
|
|
4862
|
+
.ai-chat-message__action:hover:not(:disabled) {
|
|
4863
|
+
color: var(--color-primary);
|
|
4864
|
+
}
|
|
4865
|
+
.ai-chat-message__action:focus-visible {
|
|
4866
|
+
outline: none;
|
|
4867
|
+
box-shadow: 0 0 0 2px rgba(105, 101, 219, 0.35);
|
|
4868
|
+
}
|
|
4869
|
+
.ai-chat-message__action:disabled {
|
|
4870
|
+
opacity: 0.4;
|
|
4871
|
+
cursor: not-allowed;
|
|
4872
|
+
}
|
|
4873
|
+
.ai-chat-message__action__label {
|
|
4874
|
+
font-size: 12px;
|
|
4875
|
+
font-family: monospace;
|
|
4876
|
+
word-spacing: -2px;
|
|
4877
|
+
}
|
|
4878
|
+
.ai-chat-message__action--danger {
|
|
4879
|
+
margin-left: auto;
|
|
4880
|
+
}
|
|
4881
|
+
.ai-chat-message__action--danger:hover:not(:disabled) {
|
|
4882
|
+
color: var(--color-danger);
|
|
4883
|
+
}
|
|
4884
|
+
.ai-chat-message__action--invisible {
|
|
4885
|
+
visibility: hidden;
|
|
4886
|
+
pointer-events: none;
|
|
4887
|
+
}
|
|
4888
|
+
@keyframes ai-chat-cursor-blink {
|
|
4889
|
+
0%, 50% {
|
|
4890
|
+
opacity: 1;
|
|
4891
|
+
}
|
|
4892
|
+
51%, 100% {
|
|
4893
|
+
opacity: 0;
|
|
4894
|
+
}
|
|
4895
|
+
}
|
|
4896
|
+
.ai-chat-message__error-details {
|
|
4897
|
+
margin-top: 0.35rem;
|
|
4898
|
+
font-size: 0.85rem;
|
|
4899
|
+
}
|
|
4900
|
+
.ai-chat-message__error-message {
|
|
4901
|
+
color: var(--color-error, #d64045);
|
|
4902
|
+
line-height: 1.35;
|
|
4903
|
+
}
|
|
4904
|
+
.ai-chat-message__error-hint {
|
|
4905
|
+
margin-top: 0.2rem;
|
|
4906
|
+
color: var(--text-secondary-color);
|
|
4907
|
+
line-height: 1.35;
|
|
4908
|
+
}
|
|
4909
|
+
.ai-chat-message__error-text {
|
|
4910
|
+
color: var(--color-danger);
|
|
4911
|
+
font-weight: 500;
|
|
4912
|
+
white-space: pre-wrap;
|
|
4913
|
+
word-wrap: break-word;
|
|
4914
|
+
}
|
|
4915
|
+
.ai-chat-message__error-actions {
|
|
4916
|
+
display: flex;
|
|
4917
|
+
flex-direction: column;
|
|
4918
|
+
gap: 0;
|
|
4919
|
+
}
|
|
4920
|
+
.ai-chat-message__error-link {
|
|
4921
|
+
display: flex;
|
|
4922
|
+
align-items: center;
|
|
4923
|
+
background: none;
|
|
4924
|
+
border: none;
|
|
4925
|
+
cursor: pointer;
|
|
4926
|
+
font-size: 0.875rem;
|
|
4927
|
+
font-weight: 500;
|
|
4928
|
+
padding: 0;
|
|
4929
|
+
margin-top: 0.5rem;
|
|
4930
|
+
text-decoration: underline;
|
|
4931
|
+
font-family: inherit;
|
|
4932
|
+
color: var(--link-color);
|
|
4933
|
+
}
|
|
4934
|
+
.ai-chat-message__error-link:hover {
|
|
4935
|
+
color: var(--link-color-hover);
|
|
4936
|
+
}
|
|
4937
|
+
.ai-chat-message__error-link:active {
|
|
4938
|
+
color: var(--link-color-active);
|
|
4939
|
+
}
|
|
4940
|
+
.ai-chat-message__error-link:disabled {
|
|
4941
|
+
cursor: not-allowed;
|
|
4942
|
+
text-decoration: none;
|
|
4943
|
+
}
|
|
4944
|
+
.ai-chat-message__shimmer {
|
|
4945
|
+
background:
|
|
4946
|
+
linear-gradient(
|
|
4947
|
+
90deg,
|
|
4948
|
+
var(--fg-muted) 0%,
|
|
4949
|
+
var(--text-primary-color) 25%,
|
|
4950
|
+
var(--color-primary) 50%,
|
|
4951
|
+
var(--text-primary-color) 75%,
|
|
4952
|
+
var(--fg-muted) 100%);
|
|
4953
|
+
background-size: 200% auto;
|
|
4954
|
+
-webkit-text-fill-color: transparent;
|
|
4955
|
+
animation: ai-shimmer 1.5s linear infinite;
|
|
4956
|
+
font-weight: 600;
|
|
4957
|
+
}
|
|
4958
|
+
@keyframes ai-shimmer {
|
|
4959
|
+
to {
|
|
4960
|
+
background-position: 200% center;
|
|
4961
|
+
}
|
|
4962
|
+
}
|
|
4963
|
+
|
|
4630
4964
|
/* components/TTDDialog/TTDDialog.scss */
|
|
4631
4965
|
.excalidraw.theme--dark .chat-message--assistant .chat-message__content {
|
|
4632
4966
|
background: var(--color-surface-lowest);
|
|
@@ -4772,146 +5106,80 @@
|
|
|
4772
5106
|
.excalidraw .chat-interface__send-button svg {
|
|
4773
5107
|
transform: rotate(-90deg);
|
|
4774
5108
|
}
|
|
4775
|
-
.excalidraw .chat-message {
|
|
4776
|
-
|
|
5109
|
+
.excalidraw .ai-chat-message--ttd {
|
|
5110
|
+
flex-direction: row;
|
|
4777
5111
|
align-items: center;
|
|
4778
|
-
|
|
5112
|
+
padding-bottom: 0;
|
|
4779
5113
|
}
|
|
4780
|
-
.excalidraw .chat-message--user {
|
|
5114
|
+
.excalidraw .ai-chat-message--ttd.ai-chat-message--user {
|
|
4781
5115
|
justify-content: flex-end;
|
|
5116
|
+
flex-direction: row;
|
|
4782
5117
|
}
|
|
4783
|
-
.excalidraw .chat-message--user .chat-
|
|
5118
|
+
.excalidraw .ai-chat-message--ttd.ai-chat-message--user .ai-chat-message__bubble {
|
|
4784
5119
|
background: var(--color-primary-light);
|
|
4785
5120
|
color: var(--text-primary-color);
|
|
4786
|
-
border
|
|
5121
|
+
border: none;
|
|
5122
|
+
max-width: 80%;
|
|
4787
5123
|
min-width: 6rem;
|
|
5124
|
+
padding: 0.75rem 1rem;
|
|
5125
|
+
box-shadow: var(--chat-msg-shadow);
|
|
4788
5126
|
}
|
|
4789
|
-
.excalidraw .chat-message--assistant {
|
|
5127
|
+
.excalidraw .ai-chat-message--ttd.ai-chat-message--assistant {
|
|
4790
5128
|
flex-direction: column;
|
|
4791
5129
|
justify-content: flex-start;
|
|
4792
5130
|
align-items: flex-start;
|
|
5131
|
+
padding-bottom: 0;
|
|
4793
5132
|
}
|
|
4794
|
-
.excalidraw .chat-message--assistant .chat-
|
|
5133
|
+
.excalidraw .ai-chat-message--ttd.ai-chat-message--assistant .ai-chat-message__bubble {
|
|
4795
5134
|
background: var(--color-surface-low);
|
|
4796
5135
|
color: var(--color-on-surface);
|
|
4797
|
-
border
|
|
5136
|
+
border: none;
|
|
5137
|
+
max-width: min(540px, 100%);
|
|
4798
5138
|
min-width: 6rem;
|
|
5139
|
+
padding: 0.75rem 1rem;
|
|
5140
|
+
box-shadow: var(--chat-msg-shadow);
|
|
4799
5141
|
}
|
|
4800
|
-
.excalidraw .chat-message--assistant .chat-
|
|
5142
|
+
.excalidraw .ai-chat-message--ttd.ai-chat-message--assistant .ai-chat-message__bubble .ai-chat-message__content {
|
|
4801
5143
|
font-family: monospace;
|
|
4802
5144
|
}
|
|
4803
|
-
.excalidraw .chat-message--
|
|
5145
|
+
.excalidraw .ai-chat-message--ttd.ai-chat-message--assistant .ai-chat-message__actions {
|
|
5146
|
+
margin-top: 0;
|
|
5147
|
+
}
|
|
5148
|
+
.excalidraw .ai-chat-message--ttd.ai-chat-message--system {
|
|
4804
5149
|
justify-content: flex-start;
|
|
4805
|
-
margin-bottom: 0;
|
|
4806
5150
|
}
|
|
4807
|
-
.excalidraw .chat-message--system .chat-
|
|
5151
|
+
.excalidraw .ai-chat-message--ttd.ai-chat-message--system .ai-chat-message__bubble {
|
|
4808
5152
|
background: var(--color-warning);
|
|
4809
|
-
color: var(--color-
|
|
4810
|
-
border
|
|
5153
|
+
color: var(--color-warning-color);
|
|
5154
|
+
border: none;
|
|
5155
|
+
max-width: 80%;
|
|
4811
5156
|
min-width: 6rem;
|
|
5157
|
+
padding: 0.75rem 1rem;
|
|
5158
|
+
box-shadow: var(--chat-msg-shadow);
|
|
5159
|
+
}
|
|
5160
|
+
.excalidraw .ai-chat-message--ttd.ai-chat-message--system .ai-chat-message__bubble .ai-chat-message__header-label,
|
|
5161
|
+
.excalidraw .ai-chat-message--ttd.ai-chat-message--system .ai-chat-message__bubble .ai-chat-message__header-timestamp {
|
|
5162
|
+
color: inherit;
|
|
4812
5163
|
}
|
|
4813
|
-
.excalidraw .chat-message--system .chat-
|
|
5164
|
+
.excalidraw .ai-chat-message--ttd.ai-chat-message--system .ai-chat-message__bubble .ai-chat-message__content {
|
|
4814
5165
|
font-family: monospace;
|
|
4815
5166
|
}
|
|
4816
|
-
.excalidraw .chat-
|
|
5167
|
+
.excalidraw .ai-chat-message--ttd.ai-chat-message--error .ai-chat-message__bubble {
|
|
5168
|
+
background: var(--color-surface-low);
|
|
5169
|
+
border: none;
|
|
4817
5170
|
max-width: 80%;
|
|
5171
|
+
min-width: 6rem;
|
|
4818
5172
|
padding: 0.75rem 1rem;
|
|
4819
5173
|
box-shadow: var(--chat-msg-shadow);
|
|
4820
5174
|
}
|
|
4821
|
-
.excalidraw .chat-message__header {
|
|
4822
|
-
display: flex;
|
|
4823
|
-
justify-content: space-between;
|
|
4824
|
-
align-items: center;
|
|
4825
|
-
gap: 1rem;
|
|
5175
|
+
.excalidraw .ai-chat-message--ttd .ai-chat-message__header {
|
|
4826
5176
|
margin-bottom: 0.5rem;
|
|
4827
|
-
|
|
4828
|
-
}
|
|
4829
|
-
.excalidraw .chat-message__role {
|
|
4830
|
-
font-weight: 600;
|
|
4831
|
-
}
|
|
4832
|
-
.excalidraw .chat-message__timestamp {
|
|
4833
|
-
font-size: 0.625rem;
|
|
4834
|
-
}
|
|
4835
|
-
.excalidraw .chat-message__actions {
|
|
4836
|
-
display: flex;
|
|
4837
|
-
align-items: center;
|
|
4838
|
-
gap: 0.5rem;
|
|
4839
|
-
}
|
|
4840
|
-
.excalidraw .chat-message__action {
|
|
4841
|
-
display: inline-flex;
|
|
4842
|
-
align-items: center;
|
|
4843
|
-
justify-content: center;
|
|
4844
|
-
background: none;
|
|
4845
|
-
border: none;
|
|
4846
|
-
cursor: pointer;
|
|
4847
|
-
padding: 0.25rem 0;
|
|
4848
|
-
color: var(--color-gray-60);
|
|
4849
|
-
transition: color 0.2s ease;
|
|
4850
|
-
flex-shrink: 0;
|
|
4851
|
-
}
|
|
4852
|
-
.excalidraw .chat-message__action.invisible {
|
|
4853
|
-
visibility: hidden;
|
|
4854
|
-
pointer-events: none;
|
|
4855
|
-
}
|
|
4856
|
-
.excalidraw .chat-message__action:hover {
|
|
4857
|
-
color: var(--color-primary);
|
|
4858
|
-
}
|
|
4859
|
-
.excalidraw .chat-message__action svg {
|
|
4860
|
-
width: 14px;
|
|
4861
|
-
height: 14px;
|
|
4862
|
-
}
|
|
4863
|
-
.excalidraw .chat-message__action--danger:hover {
|
|
4864
|
-
color: var(--color-danger);
|
|
4865
|
-
}
|
|
4866
|
-
.excalidraw .chat-message__body {
|
|
4867
|
-
line-height: 1.5;
|
|
4868
|
-
}
|
|
4869
|
-
.excalidraw .chat-message__text {
|
|
4870
|
-
white-space: pre-wrap;
|
|
4871
|
-
word-wrap: break-word;
|
|
4872
|
-
}
|
|
4873
|
-
.excalidraw .chat-message__cursor {
|
|
4874
|
-
display: inline-block;
|
|
4875
|
-
margin-left: 2px;
|
|
4876
|
-
color: currentColor;
|
|
4877
|
-
animation: blink 1s infinite;
|
|
4878
|
-
}
|
|
4879
|
-
.excalidraw .chat-message__loading {
|
|
4880
|
-
display: flex;
|
|
4881
|
-
align-items: center;
|
|
4882
|
-
gap: 0.5rem;
|
|
4883
|
-
}
|
|
4884
|
-
.excalidraw .chat-message__typing-indicator {
|
|
4885
|
-
display: flex;
|
|
4886
|
-
gap: 0.25rem;
|
|
4887
|
-
}
|
|
4888
|
-
.excalidraw .chat-message__typing-indicator span {
|
|
4889
|
-
width: 6px;
|
|
4890
|
-
height: 6px;
|
|
4891
|
-
border-radius: 50%;
|
|
4892
|
-
background: currentColor;
|
|
4893
|
-
opacity: 0.4;
|
|
4894
|
-
animation: typing 1.4s infinite ease-in-out;
|
|
4895
|
-
}
|
|
4896
|
-
.excalidraw .chat-message__typing-indicator span:nth-child(1) {
|
|
4897
|
-
animation-delay: -0.32s;
|
|
4898
|
-
}
|
|
4899
|
-
.excalidraw .chat-message__typing-indicator span:nth-child(2) {
|
|
4900
|
-
animation-delay: -0.16s;
|
|
4901
|
-
}
|
|
4902
|
-
.excalidraw .chat-message__typing-indicator span:nth-child(3) {
|
|
4903
|
-
animation-delay: 0s;
|
|
5177
|
+
gap: 1rem;
|
|
4904
5178
|
}
|
|
4905
|
-
.excalidraw .chat-
|
|
4906
|
-
|
|
4907
|
-
font-weight: 500;
|
|
4908
|
-
white-space: pre-wrap;
|
|
4909
|
-
word-wrap: break-word;
|
|
4910
|
-
display: flex;
|
|
4911
|
-
flex-direction: column;
|
|
4912
|
-
gap: 0.5rem;
|
|
5179
|
+
.excalidraw .ai-chat-message--ttd .ai-chat-message__action--danger {
|
|
5180
|
+
margin-left: 0;
|
|
4913
5181
|
}
|
|
4914
|
-
.excalidraw .chat-
|
|
5182
|
+
.excalidraw .ai-chat-message--ttd .ai-chat-message__error-message {
|
|
4915
5183
|
background: var(--color-warning-background);
|
|
4916
5184
|
color: var(--color-warning-color);
|
|
4917
5185
|
padding: 0.5rem 0.75rem;
|
|
@@ -4919,47 +5187,11 @@
|
|
|
4919
5187
|
margin-top: 1rem;
|
|
4920
5188
|
font-size: 0.875rem;
|
|
4921
5189
|
}
|
|
4922
|
-
.excalidraw .chat-
|
|
4923
|
-
|
|
4924
|
-
align-items: center;
|
|
4925
|
-
background: none;
|
|
4926
|
-
border: none;
|
|
4927
|
-
cursor: pointer;
|
|
4928
|
-
font-size: 0.875rem;
|
|
4929
|
-
font-weight: 500;
|
|
4930
|
-
padding: 0;
|
|
4931
|
-
margin-top: 1rem;
|
|
4932
|
-
text-decoration: underline;
|
|
4933
|
-
font-family: inherit;
|
|
4934
|
-
color: var(--link-color);
|
|
4935
|
-
}
|
|
4936
|
-
.excalidraw .chat-message__error-link:hover {
|
|
4937
|
-
color: var(--link-color-hover);
|
|
4938
|
-
}
|
|
4939
|
-
.excalidraw .chat-message__error-link:active {
|
|
4940
|
-
color: var(--link-color-active);
|
|
4941
|
-
}
|
|
4942
|
-
.excalidraw .chat-message__error-link:disabled {
|
|
4943
|
-
cursor: not-allowed;
|
|
4944
|
-
text-decoration: none;
|
|
4945
|
-
}
|
|
4946
|
-
@keyframes typing {
|
|
4947
|
-
0%, 80%, 100% {
|
|
4948
|
-
transform: scale(0.8);
|
|
4949
|
-
opacity: 0.4;
|
|
4950
|
-
}
|
|
4951
|
-
40% {
|
|
4952
|
-
transform: scale(1);
|
|
4953
|
-
opacity: 1;
|
|
4954
|
-
}
|
|
5190
|
+
.excalidraw.theme--dark .ai-chat-message--ttd.ai-chat-message--assistant .ai-chat-message__bubble {
|
|
5191
|
+
background: var(--color-surface-lowest);
|
|
4955
5192
|
}
|
|
4956
|
-
|
|
4957
|
-
|
|
4958
|
-
opacity: 1;
|
|
4959
|
-
}
|
|
4960
|
-
51%, 100% {
|
|
4961
|
-
opacity: 0;
|
|
4962
|
-
}
|
|
5193
|
+
.excalidraw.theme--dark .ai-chat-message--ttd.ai-chat-message--system .ai-chat-message__bubble {
|
|
5194
|
+
color: var(--color-warning-color);
|
|
4963
5195
|
}
|
|
4964
5196
|
.excalidraw .Modal.Dialog.ttd-dialog {
|
|
4965
5197
|
padding: 1.25rem;
|
|
@@ -5157,6 +5389,39 @@
|
|
|
5157
5389
|
height: 100%;
|
|
5158
5390
|
}
|
|
5159
5391
|
}
|
|
5392
|
+
.excalidraw .ttd-dialog-input--loading {
|
|
5393
|
+
display: flex;
|
|
5394
|
+
align-items: center;
|
|
5395
|
+
justify-content: center;
|
|
5396
|
+
}
|
|
5397
|
+
.excalidraw .ttd-dialog-input--codemirror {
|
|
5398
|
+
padding: 0;
|
|
5399
|
+
overflow: hidden;
|
|
5400
|
+
height: 0;
|
|
5401
|
+
flex: 1 1 0;
|
|
5402
|
+
min-height: 0;
|
|
5403
|
+
}
|
|
5404
|
+
.excalidraw .ttd-dialog-input--codemirror .cm-editor {
|
|
5405
|
+
height: 100%;
|
|
5406
|
+
font-family: monospace;
|
|
5407
|
+
}
|
|
5408
|
+
.excalidraw .ttd-dialog-input--codemirror .cm-editor.cm-focused {
|
|
5409
|
+
outline: none;
|
|
5410
|
+
}
|
|
5411
|
+
.excalidraw .ttd-dialog-input--codemirror .cm-scroller {
|
|
5412
|
+
padding: 0.85rem 0;
|
|
5413
|
+
overflow: auto;
|
|
5414
|
+
}
|
|
5415
|
+
.excalidraw .ttd-dialog-input--codemirror .cm-gutters {
|
|
5416
|
+
padding-left: 0.25rem;
|
|
5417
|
+
}
|
|
5418
|
+
.excalidraw .ttd-dialog-input--codemirror .cm-content {
|
|
5419
|
+
padding: 0;
|
|
5420
|
+
}
|
|
5421
|
+
.excalidraw .ttd-dialog-input--codemirror .cm-placeholder {
|
|
5422
|
+
color: var(--color-gray-40);
|
|
5423
|
+
font-style: italic;
|
|
5424
|
+
}
|
|
5160
5425
|
.excalidraw .ttd-dialog-output-wrapper {
|
|
5161
5426
|
display: flex;
|
|
5162
5427
|
flex-direction: column;
|
|
@@ -5257,15 +5522,49 @@
|
|
|
5257
5522
|
text-align: center;
|
|
5258
5523
|
margin-top: 0.25rem;
|
|
5259
5524
|
}
|
|
5525
|
+
.excalidraw .ttd-dialog-output-error .ttd-dialog-output-error-summary {
|
|
5526
|
+
width: 100%;
|
|
5527
|
+
max-width: 640px;
|
|
5528
|
+
color: var(--color-gray-50);
|
|
5529
|
+
font-size: 0.9rem;
|
|
5530
|
+
text-align: left;
|
|
5531
|
+
}
|
|
5532
|
+
.excalidraw .ttd-dialog-output-error .ttd-dialog-output-error-summary__headline {
|
|
5533
|
+
font-weight: 600;
|
|
5534
|
+
color: var(--color-gray-60);
|
|
5535
|
+
}
|
|
5536
|
+
.excalidraw .ttd-dialog-output-error .ttd-dialog-output-error-summary__label {
|
|
5537
|
+
margin-top: 0.35rem;
|
|
5538
|
+
font-weight: 500;
|
|
5539
|
+
}
|
|
5540
|
+
.excalidraw .ttd-dialog-output-error .ttd-dialog-output-error-summary__causes {
|
|
5541
|
+
margin: 0.35rem 0 0;
|
|
5542
|
+
padding-left: 2rem;
|
|
5543
|
+
}
|
|
5260
5544
|
.excalidraw .ttd-dialog-output-error .ttd-dialog-output-error-message {
|
|
5261
5545
|
text-align: left;
|
|
5262
5546
|
font-weight: 400;
|
|
5263
5547
|
color: var(--color-gray-50);
|
|
5264
5548
|
word-break: break-word;
|
|
5265
5549
|
white-space: pre-wrap;
|
|
5266
|
-
max-width:
|
|
5550
|
+
max-width: 640px;
|
|
5551
|
+
width: 100%;
|
|
5267
5552
|
font-family: monospace;
|
|
5268
5553
|
}
|
|
5554
|
+
.excalidraw .ttd-dialog-output-error .ttd-dialog-output-error-message__caret {
|
|
5555
|
+
color: var(--color-danger);
|
|
5556
|
+
}
|
|
5557
|
+
.excalidraw .ttd-dialog-output-error .ttd-dialog-output-error-autofix-slot {
|
|
5558
|
+
align-self: flex-start;
|
|
5559
|
+
margin-top: 0.35rem;
|
|
5560
|
+
min-height: 2.5rem;
|
|
5561
|
+
display: flex;
|
|
5562
|
+
align-items: flex-start;
|
|
5563
|
+
}
|
|
5564
|
+
.excalidraw .ttd-dialog-output-error .ttd-dialog-output-error-autofix {
|
|
5565
|
+
margin-top: 0;
|
|
5566
|
+
white-space: nowrap;
|
|
5567
|
+
}
|
|
5269
5568
|
.excalidraw .ttd-dialog-panels {
|
|
5270
5569
|
height: 100%;
|
|
5271
5570
|
}
|
|
@@ -6339,6 +6638,9 @@
|
|
|
6339
6638
|
.excalidraw .layer-ui__wrapper .layer-ui__wrapper__footer-right {
|
|
6340
6639
|
margin-top: auto;
|
|
6341
6640
|
margin-bottom: auto;
|
|
6641
|
+
display: flex;
|
|
6642
|
+
align-items: center;
|
|
6643
|
+
gap: 0.5rem;
|
|
6342
6644
|
}
|
|
6343
6645
|
.excalidraw .disable-view-mode {
|
|
6344
6646
|
display: flex;
|
|
@@ -6908,9 +7210,13 @@
|
|
|
6908
7210
|
--popup-text-inverted-color: #fff;
|
|
6909
7211
|
--select-highlight-color: #339af0;
|
|
6910
7212
|
--shadow-island:
|
|
6911
|
-
0px 0px
|
|
6912
|
-
0px 0px
|
|
7213
|
+
0px 0px 1px 0px rgba(0, 0, 0, 0.17),
|
|
7214
|
+
0px 0px 3px 0px rgba(0, 0, 0, 0.08),
|
|
6913
7215
|
0px 7px 14px 0px rgba(0, 0, 0, 0.05);
|
|
7216
|
+
--shadow-island-stronger:
|
|
7217
|
+
0px 0px 1px 0px rgba(0, 0, 0, 0.17),
|
|
7218
|
+
0px 0px 3px 0px rgba(0, 0, 0, 0.08),
|
|
7219
|
+
0px 7px 14px 0px rgb(0 0 0 / 18%);
|
|
6914
7220
|
--button-hover-bg: var(--color-surface-high);
|
|
6915
7221
|
--button-active-bg: var(--color-surface-high);
|
|
6916
7222
|
--button-active-border: var(--color-brand-active);
|
|
@@ -6951,6 +7257,7 @@
|
|
|
6951
7257
|
--chat-msg-shadow: 0 1px 2px rgba(0, 0, 0, 0.1);
|
|
6952
7258
|
--space-factor: 0.25rem;
|
|
6953
7259
|
--text-primary-color: var(--color-on-surface);
|
|
7260
|
+
--text-secondary-color: #6f6f78;
|
|
6954
7261
|
--color-selection: #6965db;
|
|
6955
7262
|
--color-icon-white: #fff;
|
|
6956
7263
|
--color-primary: #6965db;
|
|
@@ -7071,10 +7378,6 @@
|
|
|
7071
7378
|
--popup-text-color: #ced4da;
|
|
7072
7379
|
--popup-text-inverted-color: #2c2c2c;
|
|
7073
7380
|
--select-highlight-color: #4dabf7;
|
|
7074
|
-
--shadow-island:
|
|
7075
|
-
0px 0px 0.9310142993927002px 0px rgba(0, 0, 0, 0.17),
|
|
7076
|
-
0px 0px 3.1270833015441895px 0px rgba(0, 0, 0, 0.08),
|
|
7077
|
-
0px 7px 14px 0px rgba(0, 0, 0, 0.05);
|
|
7078
7381
|
--modal-shadow:
|
|
7079
7382
|
0px 100px 80px rgba(0, 0, 0, 0.07),
|
|
7080
7383
|
0px 41.7776px 33.4221px rgba(0, 0, 0, 0.0503198),
|
|
@@ -7088,6 +7391,7 @@
|
|
|
7088
7391
|
--color-slider-track: hsl(244, 23%, 39%);
|
|
7089
7392
|
--color-selection: #3530c4;
|
|
7090
7393
|
--color-icon-white: var(--color-gray-90);
|
|
7394
|
+
--text-secondary-color: #b8b7c6;
|
|
7091
7395
|
--color-primary: #a8a5ff;
|
|
7092
7396
|
--color-primary-darker: #b2aeff;
|
|
7093
7397
|
--color-primary-darkest: #beb9ff;
|
|
@@ -7144,6 +7448,7 @@
|
|
|
7144
7448
|
--zIndex-ui-top: 100;
|
|
7145
7449
|
--zIndex-ui-main-menu: 110;
|
|
7146
7450
|
--zIndex-ui-library: 120;
|
|
7451
|
+
--zIndex-ui-tta-chat: 130;
|
|
7147
7452
|
--zIndex-modal: 1000;
|
|
7148
7453
|
--zIndex-popup: 1001;
|
|
7149
7454
|
--zIndex-toast: 999999;
|
|
@@ -7620,6 +7925,24 @@ body.excalidraw-cursor-resize * {
|
|
|
7620
7925
|
.excalidraw .scroll-back-to-content:active {
|
|
7621
7926
|
border: 1px solid var(--button-active-border);
|
|
7622
7927
|
}
|
|
7928
|
+
.excalidraw .floating-status-stack {
|
|
7929
|
+
position: absolute;
|
|
7930
|
+
left: 50%;
|
|
7931
|
+
bottom: 30px;
|
|
7932
|
+
transform: translateX(-50%);
|
|
7933
|
+
display: flex;
|
|
7934
|
+
flex-direction: column;
|
|
7935
|
+
align-items: center;
|
|
7936
|
+
gap: 0.5rem;
|
|
7937
|
+
pointer-events: none;
|
|
7938
|
+
}
|
|
7939
|
+
.excalidraw .floating-status-stack .scroll-back-to-content {
|
|
7940
|
+
position: static;
|
|
7941
|
+
left: auto;
|
|
7942
|
+
bottom: auto;
|
|
7943
|
+
transform: none;
|
|
7944
|
+
pointer-events: var(--ui-pointerEvents);
|
|
7945
|
+
}
|
|
7623
7946
|
.excalidraw .help-icon {
|
|
7624
7947
|
display: flex;
|
|
7625
7948
|
justify-content: center;
|
|
@@ -7974,4 +8297,1952 @@ body.excalidraw-cursor-resize * {
|
|
|
7974
8297
|
style: normal;
|
|
7975
8298
|
display: swap;
|
|
7976
8299
|
}
|
|
8300
|
+
|
|
8301
|
+
/* TTA/TTADialog.scss */
|
|
8302
|
+
.excalidraw,
|
|
8303
|
+
.exc-style {
|
|
8304
|
+
--theme-filter: none;
|
|
8305
|
+
--button-destructive-bg-color: #ffe3e3;
|
|
8306
|
+
--button-destructive-color: #c92a2a;
|
|
8307
|
+
--button-gray-1: #e9ecef;
|
|
8308
|
+
--button-gray-2: #ced4da;
|
|
8309
|
+
--button-gray-3: #adb5bd;
|
|
8310
|
+
--mobile-action-button-bg: rgba(255, 255, 255, 0.35);
|
|
8311
|
+
--mobile-color-border: var(--default-border-color);
|
|
8312
|
+
--button-special-active-bg-color: #ebfbee;
|
|
8313
|
+
--dialog-border-color: var(--color-gray-20);
|
|
8314
|
+
--dropdown-icon: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" width="292.4" height="292.4" viewBox="0 0 292 292"><path d="M287 197L159 69c-4-3-8-5-13-5s-9 2-13 5L5 197c-3 4-5 8-5 13s2 9 5 13c4 4 8 5 13 5h256c5 0 9-1 13-5s5-8 5-13-1-9-5-13z"/></svg>');
|
|
8315
|
+
--focus-highlight-color: #a5d8ff;
|
|
8316
|
+
--icon-fill-color: var(--color-on-surface);
|
|
8317
|
+
--icon-green-fill-color: #2b8a3e;
|
|
8318
|
+
--default-bg-color: #fff;
|
|
8319
|
+
--input-bg-color: #fff;
|
|
8320
|
+
--input-border-color: #ced4da;
|
|
8321
|
+
--input-hover-bg-color: #f1f3f5;
|
|
8322
|
+
--input-label-color: #495057;
|
|
8323
|
+
--island-bg-color: #ffffff;
|
|
8324
|
+
--island-bg-color-alt: #fff;
|
|
8325
|
+
--keybinding-color: var(--color-gray-40);
|
|
8326
|
+
--link-color: #1c7ed6;
|
|
8327
|
+
--link-color-hover: #1971c2;
|
|
8328
|
+
--link-color-active: #a5d8ff;
|
|
8329
|
+
--overlay-bg-color: rgba(255, 255, 255, 0.88);
|
|
8330
|
+
--popup-bg-color: var(--island-bg-color);
|
|
8331
|
+
--popup-secondary-bg-color: #f1f3f5;
|
|
8332
|
+
--popup-text-color: #000;
|
|
8333
|
+
--popup-text-inverted-color: #fff;
|
|
8334
|
+
--select-highlight-color: #339af0;
|
|
8335
|
+
--shadow-island:
|
|
8336
|
+
0px 0px 1px 0px rgba(0, 0, 0, 0.17),
|
|
8337
|
+
0px 0px 3px 0px rgba(0, 0, 0, 0.08),
|
|
8338
|
+
0px 7px 14px 0px rgba(0, 0, 0, 0.05);
|
|
8339
|
+
--shadow-island-stronger:
|
|
8340
|
+
0px 0px 1px 0px rgba(0, 0, 0, 0.17),
|
|
8341
|
+
0px 0px 3px 0px rgba(0, 0, 0, 0.08),
|
|
8342
|
+
0px 7px 14px 0px rgb(0 0 0 / 18%);
|
|
8343
|
+
--button-hover-bg: var(--color-surface-high);
|
|
8344
|
+
--button-active-bg: var(--color-surface-high);
|
|
8345
|
+
--button-active-border: var(--color-brand-active);
|
|
8346
|
+
--default-border-color: var(--color-surface-high);
|
|
8347
|
+
--default-button-size: 2rem;
|
|
8348
|
+
--default-icon-size: 1rem;
|
|
8349
|
+
--lg-button-size: 2.25rem;
|
|
8350
|
+
--lg-icon-size: 1rem;
|
|
8351
|
+
--editor-container-padding: 1rem;
|
|
8352
|
+
--mobile-action-button-size: 2rem;
|
|
8353
|
+
--scrollbar-thumb: var(--button-gray-2);
|
|
8354
|
+
--scrollbar-thumb-hover: var(--button-gray-3);
|
|
8355
|
+
--color-slider-track: hsl(240, 100%, 90%);
|
|
8356
|
+
--color-slider-thumb: var(--color-gray-80);
|
|
8357
|
+
--modal-shadow:
|
|
8358
|
+
0px 100px 80px rgba(0, 0, 0, 0.07),
|
|
8359
|
+
0px 41.7776px 33.4221px rgba(0, 0, 0, 0.0503198),
|
|
8360
|
+
0px 22.3363px 17.869px rgba(0, 0, 0, 0.0417275),
|
|
8361
|
+
0px 12.5216px 10.0172px rgba(0, 0, 0, 0.035),
|
|
8362
|
+
0px 6.6501px 5.32008px rgba(0, 0, 0, 0.0282725),
|
|
8363
|
+
0px 2.76726px 2.21381px rgba(0, 0, 0, 0.0196802);
|
|
8364
|
+
--avatar-border-color: var(--color-gray-20);
|
|
8365
|
+
--sidebar-shadow:
|
|
8366
|
+
0px 100px 80px rgba(0, 0, 0, 0.07),
|
|
8367
|
+
0px 41.7776px 33.4221px rgba(0, 0, 0, 0.0503198),
|
|
8368
|
+
0px 22.3363px 17.869px rgba(0, 0, 0, 0.0417275),
|
|
8369
|
+
0px 12.5216px 10.0172px rgba(0, 0, 0, 0.035),
|
|
8370
|
+
0px 6.6501px 5.32008px rgba(0, 0, 0, 0.0282725),
|
|
8371
|
+
0px 2.76726px 2.21381px rgba(0, 0, 0, 0.0196802);
|
|
8372
|
+
--sidebar-border-color: var(--color-surface-high);
|
|
8373
|
+
--sidebar-bg-color: var(--island-bg-color);
|
|
8374
|
+
--library-dropdown-shadow:
|
|
8375
|
+
0px 15px 6px rgba(0, 0, 0, 0.01),
|
|
8376
|
+
0px 8px 5px rgba(0, 0, 0, 0.05),
|
|
8377
|
+
0px 4px 4px rgba(0, 0, 0, 0.09),
|
|
8378
|
+
0px 1px 2px rgba(0, 0, 0, 0.1),
|
|
8379
|
+
0px 0px 0px rgba(0, 0, 0, 0.1);
|
|
8380
|
+
--chat-msg-shadow: 0 1px 2px rgba(0, 0, 0, 0.1);
|
|
8381
|
+
--space-factor: 0.25rem;
|
|
8382
|
+
--text-primary-color: var(--color-on-surface);
|
|
8383
|
+
--text-secondary-color: #6f6f78;
|
|
8384
|
+
--color-selection: #6965db;
|
|
8385
|
+
--color-icon-white: #fff;
|
|
8386
|
+
--color-primary: #6965db;
|
|
8387
|
+
--color-primary-darker: #5b57d1;
|
|
8388
|
+
--color-primary-darkest: #4a47b1;
|
|
8389
|
+
--color-primary-light: #e3e2fe;
|
|
8390
|
+
--color-primary-light-darker: #d7d5ff;
|
|
8391
|
+
--color-primary-hover: #5753d0;
|
|
8392
|
+
--color-gray-10: #f5f5f5;
|
|
8393
|
+
--color-gray-20: #ebebeb;
|
|
8394
|
+
--color-gray-30: #d6d6d6;
|
|
8395
|
+
--color-gray-40: #b8b8b8;
|
|
8396
|
+
--color-gray-50: #999999;
|
|
8397
|
+
--color-gray-60: #7a7a7a;
|
|
8398
|
+
--color-gray-70: #5c5c5c;
|
|
8399
|
+
--color-gray-80: #3d3d3d;
|
|
8400
|
+
--color-gray-85: #242424;
|
|
8401
|
+
--color-gray-90: #1e1e1e;
|
|
8402
|
+
--color-gray-100: #121212;
|
|
8403
|
+
--color-disabled: var(--color-gray-40);
|
|
8404
|
+
--color-warning: #fceeca;
|
|
8405
|
+
--color-warning-dark: #f5c354;
|
|
8406
|
+
--color-warning-darker: #f3ab2c;
|
|
8407
|
+
--color-warning-darkest: #ec8b14;
|
|
8408
|
+
--color-text-warning: var(--text-primary-color);
|
|
8409
|
+
--color-danger: #db6965;
|
|
8410
|
+
--color-danger-dark: #db6965;
|
|
8411
|
+
--color-danger-darker: #d65550;
|
|
8412
|
+
--color-danger-darkest: #d1413c;
|
|
8413
|
+
--color-danger-text: black;
|
|
8414
|
+
--color-danger-background: #fff0f0;
|
|
8415
|
+
--color-danger-icon-background: #ffdad6;
|
|
8416
|
+
--color-danger-color: #700000;
|
|
8417
|
+
--color-danger-icon-color: #700000;
|
|
8418
|
+
--color-warning-background: var(--color-warning);
|
|
8419
|
+
--color-warning-icon-background: var(--color-warning-dark);
|
|
8420
|
+
--color-warning-color: var(--text-primary-color);
|
|
8421
|
+
--color-warning-icon-color: var(--text-primary-color);
|
|
8422
|
+
--color-muted: var(--color-gray-30);
|
|
8423
|
+
--color-muted-darker: var(--color-gray-60);
|
|
8424
|
+
--color-muted-darkest: var(--color-gray-100);
|
|
8425
|
+
--color-muted-background: var(--color-gray-80);
|
|
8426
|
+
--color-muted-background-darker: var(--color-gray-100);
|
|
8427
|
+
--color-promo: var(--color-primary);
|
|
8428
|
+
--color-success: #cafccc;
|
|
8429
|
+
--color-success-darker: #bafabc;
|
|
8430
|
+
--color-success-darkest: #a5eba8;
|
|
8431
|
+
--color-success-text: #268029;
|
|
8432
|
+
--color-success-contrast: #65bb6a;
|
|
8433
|
+
--color-success-contrast-hover: #6bcf70;
|
|
8434
|
+
--color-success-contrast-active: #6edf74;
|
|
8435
|
+
--color-logo-icon: var(--color-primary);
|
|
8436
|
+
--color-logo-text: #190064;
|
|
8437
|
+
--border-radius-md: 0.375rem;
|
|
8438
|
+
--border-radius-lg: 0.5rem;
|
|
8439
|
+
--color-surface-high: #f1f0ff;
|
|
8440
|
+
--color-surface-mid: #f6f6f9;
|
|
8441
|
+
--color-surface-low: #ececf4;
|
|
8442
|
+
--color-surface-lowest: #ffffff;
|
|
8443
|
+
--color-on-surface: #1b1b1f;
|
|
8444
|
+
--color-brand-hover: #5753d0;
|
|
8445
|
+
--color-on-primary-container: #030064;
|
|
8446
|
+
--color-surface-primary-container: #e0dfff;
|
|
8447
|
+
--color-brand-active: #4440bf;
|
|
8448
|
+
--color-border-outline: #767680;
|
|
8449
|
+
--color-border-outline-variant: #c5c5d0;
|
|
8450
|
+
--color-surface-primary-container: #e0dfff;
|
|
8451
|
+
--color-badge: #0b6513;
|
|
8452
|
+
--background-color-badge: #d3ffd2;
|
|
8453
|
+
}
|
|
8454
|
+
.excalidraw--mobile.excalidraw,
|
|
8455
|
+
.exc-style {
|
|
8456
|
+
--editor-container-padding: 0.75rem;
|
|
8457
|
+
}
|
|
8458
|
+
@media screen and (min-device-width: 1921px) {
|
|
8459
|
+
.excalidraw,
|
|
8460
|
+
.exc-style {
|
|
8461
|
+
--lg-button-size: 2.5rem;
|
|
8462
|
+
--lg-icon-size: 1.25rem;
|
|
8463
|
+
--default-button-size: 2.25rem;
|
|
8464
|
+
--default-icon-size: 1.25rem;
|
|
8465
|
+
}
|
|
8466
|
+
}
|
|
8467
|
+
.excalidraw.theme--dark.theme--dark-background-none,
|
|
8468
|
+
.dark .excalidraw.theme--dark-background-none,
|
|
8469
|
+
.exc-style.theme--dark.theme--dark-background-none,
|
|
8470
|
+
.dark .exc-style.theme--dark-background-none {
|
|
8471
|
+
background: none;
|
|
8472
|
+
}
|
|
8473
|
+
.excalidraw.theme--dark,
|
|
8474
|
+
.dark .excalidraw,
|
|
8475
|
+
.exc-style.theme--dark,
|
|
8476
|
+
.dark .exc-style {
|
|
8477
|
+
--theme-filter: invert(93%) hue-rotate(180deg);
|
|
8478
|
+
--button-destructive-bg-color: #5a0000;
|
|
8479
|
+
--button-destructive-color: #ffa8a8;
|
|
8480
|
+
--button-gray-1: #363636;
|
|
8481
|
+
--button-gray-2: #272727;
|
|
8482
|
+
--button-gray-3: #222;
|
|
8483
|
+
--mobile-action-button-bg: var(--island-bg-color);
|
|
8484
|
+
--mobile-color-border: rgba(255, 255, 255, 0.85);
|
|
8485
|
+
--button-special-active-bg-color: #204624;
|
|
8486
|
+
--dialog-border-color: var(--color-gray-80);
|
|
8487
|
+
--dropdown-icon: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" width="292.4" height="292.4" viewBox="0 0 292 292"><path fill="%23ced4da" d="M287 197L159 69c-4-3-8-5-13-5s-9 2-13 5L5 197c-3 4-5 8-5 13s2 9 5 13c4 4 8 5 13 5h256c5 0 9-1 13-5s5-8 5-13-1-9-5-13z"/></svg>');
|
|
8488
|
+
--focus-highlight-color: #228be6;
|
|
8489
|
+
--icon-green-fill-color: #69db7c;
|
|
8490
|
+
--default-bg-color: #121212;
|
|
8491
|
+
--input-bg-color: #121212;
|
|
8492
|
+
--input-border-color: #2e2e2e;
|
|
8493
|
+
--input-hover-bg-color: #181818;
|
|
8494
|
+
--input-label-color: #e9ecef;
|
|
8495
|
+
--island-bg-color: #232329;
|
|
8496
|
+
--island-bg-color-alt: hsl(240, 12%, 12%);
|
|
8497
|
+
--keybinding-color: var(--color-gray-60);
|
|
8498
|
+
--link-color: #4dabf7;
|
|
8499
|
+
--overlay-bg-color: rgba(52, 58, 64, 0.12);
|
|
8500
|
+
--popup-secondary-bg-color: #222;
|
|
8501
|
+
--popup-text-color: #ced4da;
|
|
8502
|
+
--popup-text-inverted-color: #2c2c2c;
|
|
8503
|
+
--select-highlight-color: #4dabf7;
|
|
8504
|
+
--modal-shadow:
|
|
8505
|
+
0px 100px 80px rgba(0, 0, 0, 0.07),
|
|
8506
|
+
0px 41.7776px 33.4221px rgba(0, 0, 0, 0.0503198),
|
|
8507
|
+
0px 22.3363px 17.869px rgba(0, 0, 0, 0.0417275),
|
|
8508
|
+
0px 12.5216px 10.0172px rgba(0, 0, 0, 0.035),
|
|
8509
|
+
0px 6.6501px 5.32008px rgba(0, 0, 0, 0.0282725),
|
|
8510
|
+
0px 2.76726px 2.21381px rgba(0, 0, 0, 0.0196802);
|
|
8511
|
+
--avatar-border-color: var(--color-gray-85);
|
|
8512
|
+
--scrollbar-thumb: #343a40;
|
|
8513
|
+
--scrollbar-thumb-hover: #495057;
|
|
8514
|
+
--color-slider-track: hsl(244, 23%, 39%);
|
|
8515
|
+
--color-selection: #3530c4;
|
|
8516
|
+
--color-icon-white: var(--color-gray-90);
|
|
8517
|
+
--text-secondary-color: #b8b7c6;
|
|
8518
|
+
--color-primary: #a8a5ff;
|
|
8519
|
+
--color-primary-darker: #b2aeff;
|
|
8520
|
+
--color-primary-darkest: #beb9ff;
|
|
8521
|
+
--color-primary-light: #4f4d6f;
|
|
8522
|
+
--color-primary-light-darker: #43415e;
|
|
8523
|
+
--color-primary-hover: #bbb8ff;
|
|
8524
|
+
--color-disabled: var(--color-gray-70);
|
|
8525
|
+
--color-text-warning: var(--color-gray-80);
|
|
8526
|
+
--color-danger: #ffa8a5;
|
|
8527
|
+
--color-danger-dark: #672120;
|
|
8528
|
+
--color-danger-darker: #8f2625;
|
|
8529
|
+
--color-danger-darkest: #ac2b29;
|
|
8530
|
+
--color-danger-text: #fbcbcc;
|
|
8531
|
+
--color-danger-background: #fbcbcc;
|
|
8532
|
+
--color-danger-icon-background: #672120;
|
|
8533
|
+
--color-danger-color: #261919;
|
|
8534
|
+
--color-danger-icon-color: #fbcbcc;
|
|
8535
|
+
--color-warning-background: var(--color-warning);
|
|
8536
|
+
--color-warning-icon-background: var(--color-warning-dark);
|
|
8537
|
+
--color-warning-color: var(--color-gray-80);
|
|
8538
|
+
--color-warning-icon-color: var(--color-gray-80);
|
|
8539
|
+
--color-muted: var(--color-gray-80);
|
|
8540
|
+
--color-muted-darker: var(--color-gray-60);
|
|
8541
|
+
--color-muted-darkest: var(--color-gray-20);
|
|
8542
|
+
--color-muted-background: var(--color-gray-40);
|
|
8543
|
+
--color-muted-background-darker: var(--color-gray-20);
|
|
8544
|
+
--color-logo-text: #e2dfff;
|
|
8545
|
+
--color-surface-high: #2e2d39;
|
|
8546
|
+
--color-surface-low: hsl(240, 8%, 15%);
|
|
8547
|
+
--color-surface-mid: hsl(240 6% 10%);
|
|
8548
|
+
--color-surface-lowest: hsl(0, 0%, 7%);
|
|
8549
|
+
--color-on-surface: #e3e3e8;
|
|
8550
|
+
--color-brand-hover: #bbb8ff;
|
|
8551
|
+
--color-on-primary-container: #e0dfff;
|
|
8552
|
+
--color-surface-primary-container: #403e6a;
|
|
8553
|
+
--color-brand-active: #d0ccff;
|
|
8554
|
+
--color-border-outline: #8e8d9c;
|
|
8555
|
+
--color-border-outline-variant: #46464f;
|
|
8556
|
+
--color-surface-primary-container: #403e6a;
|
|
8557
|
+
}
|
|
8558
|
+
:root {
|
|
8559
|
+
--zIndex-canvas: 1;
|
|
8560
|
+
--zIndex-interactiveCanvas: 2;
|
|
8561
|
+
--zIndex-svgLayer: 3;
|
|
8562
|
+
--zIndex-wysiwyg: 3;
|
|
8563
|
+
--zIndex-canvasButtons: 3;
|
|
8564
|
+
--zIndex-layerUI: 4;
|
|
8565
|
+
--zIndex-eyeDropperBackdrop: 5;
|
|
8566
|
+
--zIndex-eyeDropperPreview: 6;
|
|
8567
|
+
--zIndex-hyperlinkContainer: 7;
|
|
8568
|
+
--zIndex-ui-bottom: 60;
|
|
8569
|
+
--zIndex-ui-context-menu: 90;
|
|
8570
|
+
--zIndex-ui-styles-popup: 100;
|
|
8571
|
+
--zIndex-ui-top: 100;
|
|
8572
|
+
--zIndex-ui-main-menu: 110;
|
|
8573
|
+
--zIndex-ui-library: 120;
|
|
8574
|
+
--zIndex-ui-tta-chat: 130;
|
|
8575
|
+
--zIndex-modal: 1000;
|
|
8576
|
+
--zIndex-popup: 1001;
|
|
8577
|
+
--zIndex-toast: 999999;
|
|
8578
|
+
--sab: env(safe-area-inset-bottom);
|
|
8579
|
+
--sal: env(safe-area-inset-left);
|
|
8580
|
+
--sar: env(safe-area-inset-right);
|
|
8581
|
+
--sat: env(safe-area-inset-top);
|
|
8582
|
+
}
|
|
8583
|
+
body.excalidraw-cursor-resize,
|
|
8584
|
+
body.excalidraw-cursor-resize a:hover,
|
|
8585
|
+
body.excalidraw-cursor-resize * {
|
|
8586
|
+
cursor: ew-resize;
|
|
8587
|
+
}
|
|
8588
|
+
.exc-style,
|
|
8589
|
+
.excalidraw {
|
|
8590
|
+
color: var(--text-primary-color);
|
|
8591
|
+
--ui-font:
|
|
8592
|
+
Assistant,
|
|
8593
|
+
system-ui,
|
|
8594
|
+
BlinkMacSystemFont,
|
|
8595
|
+
-apple-system,
|
|
8596
|
+
Segoe UI,
|
|
8597
|
+
Roboto,
|
|
8598
|
+
Helvetica,
|
|
8599
|
+
Arial,
|
|
8600
|
+
sans-serif;
|
|
8601
|
+
font-family: var(--ui-font);
|
|
8602
|
+
position: relative;
|
|
8603
|
+
overflow: hidden;
|
|
8604
|
+
color: var(--text-primary-color);
|
|
8605
|
+
display: flex;
|
|
8606
|
+
top: 0;
|
|
8607
|
+
bottom: 0;
|
|
8608
|
+
left: 0;
|
|
8609
|
+
right: 0;
|
|
8610
|
+
height: 100%;
|
|
8611
|
+
width: 100%;
|
|
8612
|
+
user-select: none;
|
|
8613
|
+
}
|
|
8614
|
+
.exc-style button,
|
|
8615
|
+
.excalidraw button {
|
|
8616
|
+
font-size: 0.8333rem;
|
|
8617
|
+
}
|
|
8618
|
+
.exc-style button,
|
|
8619
|
+
.exc-style label,
|
|
8620
|
+
.excalidraw button,
|
|
8621
|
+
.excalidraw label {
|
|
8622
|
+
-webkit-tap-highlight-color: transparent;
|
|
8623
|
+
-webkit-touch-callout: none;
|
|
8624
|
+
user-select: none;
|
|
8625
|
+
}
|
|
8626
|
+
.exc-style button,
|
|
8627
|
+
.excalidraw button {
|
|
8628
|
+
cursor: pointer;
|
|
8629
|
+
user-select: none;
|
|
8630
|
+
}
|
|
8631
|
+
.exc-style:focus,
|
|
8632
|
+
.excalidraw:focus {
|
|
8633
|
+
outline: none;
|
|
8634
|
+
}
|
|
8635
|
+
.exc-style .excalidraw-link,
|
|
8636
|
+
.exc-style a,
|
|
8637
|
+
.excalidraw .excalidraw-link,
|
|
8638
|
+
.excalidraw a {
|
|
8639
|
+
font-weight: 500;
|
|
8640
|
+
text-decoration: none;
|
|
8641
|
+
color: var(--link-color);
|
|
8642
|
+
user-select: none;
|
|
8643
|
+
cursor: pointer;
|
|
8644
|
+
}
|
|
8645
|
+
.exc-style .excalidraw-link:hover,
|
|
8646
|
+
.exc-style a:hover,
|
|
8647
|
+
.excalidraw .excalidraw-link:hover,
|
|
8648
|
+
.excalidraw a:hover {
|
|
8649
|
+
text-decoration: underline;
|
|
8650
|
+
}
|
|
8651
|
+
.exc-style .excalidraw-link:active,
|
|
8652
|
+
.exc-style a:active,
|
|
8653
|
+
.excalidraw .excalidraw-link:active,
|
|
8654
|
+
.excalidraw a:active {
|
|
8655
|
+
text-decoration: none;
|
|
8656
|
+
}
|
|
8657
|
+
.excalidraw {
|
|
8658
|
+
position: relative;
|
|
8659
|
+
overflow: hidden;
|
|
8660
|
+
display: flex;
|
|
8661
|
+
top: 0;
|
|
8662
|
+
bottom: 0;
|
|
8663
|
+
left: 0;
|
|
8664
|
+
right: 0;
|
|
8665
|
+
height: 100%;
|
|
8666
|
+
width: 100%;
|
|
8667
|
+
user-select: none;
|
|
8668
|
+
}
|
|
8669
|
+
.excalidraw canvas {
|
|
8670
|
+
touch-action: none;
|
|
8671
|
+
image-rendering: pixelated;
|
|
8672
|
+
image-rendering: -moz-crisp-edges;
|
|
8673
|
+
z-index: var(--zIndex-canvas);
|
|
8674
|
+
}
|
|
8675
|
+
.excalidraw canvas.interactive {
|
|
8676
|
+
z-index: var(--zIndex-interactiveCanvas);
|
|
8677
|
+
filter: var(--theme-filter);
|
|
8678
|
+
}
|
|
8679
|
+
.excalidraw__canvas-wrapper,
|
|
8680
|
+
.excalidraw__canvas.static {
|
|
8681
|
+
pointer-events: none;
|
|
8682
|
+
}
|
|
8683
|
+
.excalidraw__canvas {
|
|
8684
|
+
position: absolute;
|
|
8685
|
+
}
|
|
8686
|
+
.excalidraw__embeddable {
|
|
8687
|
+
width: 100%;
|
|
8688
|
+
height: 100%;
|
|
8689
|
+
border: 0;
|
|
8690
|
+
}
|
|
8691
|
+
.excalidraw__embeddable-container {
|
|
8692
|
+
position: absolute;
|
|
8693
|
+
z-index: 2;
|
|
8694
|
+
transform-origin: top left;
|
|
8695
|
+
pointer-events: none;
|
|
8696
|
+
}
|
|
8697
|
+
.excalidraw .FixedSideContainer {
|
|
8698
|
+
padding-top: var(--sat, 0);
|
|
8699
|
+
padding-right: var(--sar, 0);
|
|
8700
|
+
padding-bottom: var(--sab, 0);
|
|
8701
|
+
padding-left: var(--sal, 0);
|
|
8702
|
+
}
|
|
8703
|
+
.excalidraw .panelRow {
|
|
8704
|
+
display: flex;
|
|
8705
|
+
justify-content: space-between;
|
|
8706
|
+
}
|
|
8707
|
+
.excalidraw .selected-shape-actions {
|
|
8708
|
+
display: flex;
|
|
8709
|
+
flex-direction: column;
|
|
8710
|
+
row-gap: 0.75rem;
|
|
8711
|
+
}
|
|
8712
|
+
.excalidraw .selected-shape-actions h3,
|
|
8713
|
+
.excalidraw .selected-shape-actions legend,
|
|
8714
|
+
.excalidraw .selected-shape-actions .control-label {
|
|
8715
|
+
margin: 0;
|
|
8716
|
+
margin-bottom: 0.25rem;
|
|
8717
|
+
font-size: 0.75rem;
|
|
8718
|
+
color: var(--text-primary-color);
|
|
8719
|
+
font-weight: 400;
|
|
8720
|
+
display: block;
|
|
8721
|
+
}
|
|
8722
|
+
.excalidraw .selected-shape-actions .control-label input {
|
|
8723
|
+
display: block;
|
|
8724
|
+
width: 100%;
|
|
8725
|
+
}
|
|
8726
|
+
.excalidraw .selected-shape-actions legend {
|
|
8727
|
+
padding: 0;
|
|
8728
|
+
}
|
|
8729
|
+
.excalidraw .selected-shape-actions .iconSelectList {
|
|
8730
|
+
flex-wrap: wrap;
|
|
8731
|
+
position: relative;
|
|
8732
|
+
}
|
|
8733
|
+
.excalidraw .selected-shape-actions .buttonList {
|
|
8734
|
+
flex-wrap: wrap;
|
|
8735
|
+
display: flex;
|
|
8736
|
+
column-gap: 0.5rem;
|
|
8737
|
+
row-gap: 0.5rem;
|
|
8738
|
+
}
|
|
8739
|
+
.excalidraw .selected-shape-actions .buttonList label {
|
|
8740
|
+
font-size: 0.75rem;
|
|
8741
|
+
}
|
|
8742
|
+
.excalidraw .selected-shape-actions .buttonList input[type=radio],
|
|
8743
|
+
.excalidraw .selected-shape-actions .buttonList input[type=button] {
|
|
8744
|
+
opacity: 0;
|
|
8745
|
+
position: absolute;
|
|
8746
|
+
pointer-events: none;
|
|
8747
|
+
}
|
|
8748
|
+
.excalidraw .selected-shape-actions .buttonList .iconRow {
|
|
8749
|
+
margin-top: 8px;
|
|
8750
|
+
}
|
|
8751
|
+
.excalidraw .selected-shape-actions fieldset {
|
|
8752
|
+
margin: 0;
|
|
8753
|
+
padding: 0;
|
|
8754
|
+
border: none;
|
|
8755
|
+
}
|
|
8756
|
+
.excalidraw .divider {
|
|
8757
|
+
width: 1px;
|
|
8758
|
+
background-color: #e9ecef;
|
|
8759
|
+
margin: 1px;
|
|
8760
|
+
}
|
|
8761
|
+
.excalidraw .welcome-screen-menu-item:focus-visible,
|
|
8762
|
+
.excalidraw .dropdown-menu-item:focus-visible,
|
|
8763
|
+
.excalidraw button:focus-visible,
|
|
8764
|
+
.excalidraw .buttonList label:focus-within,
|
|
8765
|
+
.excalidraw input:focus-visible {
|
|
8766
|
+
outline: transparent;
|
|
8767
|
+
box-shadow: 0 0 0 1px var(--color-brand-hover);
|
|
8768
|
+
}
|
|
8769
|
+
.excalidraw [data-radix-collection-item]:focus-visible {
|
|
8770
|
+
box-shadow: none !important;
|
|
8771
|
+
}
|
|
8772
|
+
.excalidraw .buttonList .ToolIcon__icon {
|
|
8773
|
+
all: unset !important;
|
|
8774
|
+
display: flex !important;
|
|
8775
|
+
}
|
|
8776
|
+
.excalidraw .buttonList button {
|
|
8777
|
+
background-color: transparent;
|
|
8778
|
+
}
|
|
8779
|
+
.excalidraw .buttonList label,
|
|
8780
|
+
.excalidraw .buttonList button,
|
|
8781
|
+
.excalidraw .buttonList .zIndexButton {
|
|
8782
|
+
display: flex;
|
|
8783
|
+
justify-content: center;
|
|
8784
|
+
align-items: center;
|
|
8785
|
+
padding: 0.625rem;
|
|
8786
|
+
width: var(--button-width, var(--default-button-size));
|
|
8787
|
+
height: var(--button-height, var(--default-button-size));
|
|
8788
|
+
box-sizing: border-box;
|
|
8789
|
+
border-width: 1px;
|
|
8790
|
+
border-style: solid;
|
|
8791
|
+
border-color: var(--button-border, var(--default-border-color));
|
|
8792
|
+
border-radius: var(--border-radius-lg);
|
|
8793
|
+
cursor: pointer;
|
|
8794
|
+
background-color: var(--button-bg, var(--island-bg-color));
|
|
8795
|
+
color: var(--button-color, var(--color-on-surface));
|
|
8796
|
+
font-family: var(--ui-font);
|
|
8797
|
+
}
|
|
8798
|
+
.excalidraw .buttonList label svg,
|
|
8799
|
+
.excalidraw .buttonList button svg,
|
|
8800
|
+
.excalidraw .buttonList .zIndexButton svg {
|
|
8801
|
+
width: var(--button-width, var(--lg-icon-size));
|
|
8802
|
+
height: var(--button-height, var(--lg-icon-size));
|
|
8803
|
+
}
|
|
8804
|
+
.excalidraw .buttonList label:hover,
|
|
8805
|
+
.excalidraw .buttonList button:hover,
|
|
8806
|
+
.excalidraw .buttonList .zIndexButton:hover {
|
|
8807
|
+
background-color: var(--button-hover-bg, var(--island-bg-color));
|
|
8808
|
+
border-color: var(--button-hover-border, var(--button-border, var(--default-border-color)));
|
|
8809
|
+
color: var(--button-hover-color, var(--button-color, var(--text-primary-color, inherit)));
|
|
8810
|
+
}
|
|
8811
|
+
.excalidraw .buttonList label:active,
|
|
8812
|
+
.excalidraw .buttonList button:active,
|
|
8813
|
+
.excalidraw .buttonList .zIndexButton:active {
|
|
8814
|
+
background-color: var(--button-active-bg, var(--island-bg-color));
|
|
8815
|
+
border-color: var(--button-active-border, var(--color-primary-darkest));
|
|
8816
|
+
}
|
|
8817
|
+
.excalidraw .buttonList label.active,
|
|
8818
|
+
.excalidraw .buttonList button.active,
|
|
8819
|
+
.excalidraw .buttonList .zIndexButton.active {
|
|
8820
|
+
background-color: var(--button-selected-bg, var(--color-surface-primary-container));
|
|
8821
|
+
border-color: var(--button-selected-border, var(--color-surface-primary-container));
|
|
8822
|
+
}
|
|
8823
|
+
.excalidraw .buttonList label.active:hover,
|
|
8824
|
+
.excalidraw .buttonList button.active:hover,
|
|
8825
|
+
.excalidraw .buttonList .zIndexButton.active:hover {
|
|
8826
|
+
background-color: var(--button-selected-hover-bg, var(--color-surface-primary-container));
|
|
8827
|
+
}
|
|
8828
|
+
.excalidraw .buttonList label.active svg,
|
|
8829
|
+
.excalidraw .buttonList button.active svg,
|
|
8830
|
+
.excalidraw .buttonList .zIndexButton.active svg {
|
|
8831
|
+
color: var(--button-color, var(--color-on-primary-container));
|
|
8832
|
+
}
|
|
8833
|
+
.excalidraw--mobile.excalidraw .buttonList label,
|
|
8834
|
+
.excalidraw .buttonList button,
|
|
8835
|
+
.excalidraw .buttonList .zIndexButton {
|
|
8836
|
+
width: var(--mobile-action-button-size, var(--default-button-size));
|
|
8837
|
+
height: var(--mobile-action-button-size, var(--default-button-size));
|
|
8838
|
+
}
|
|
8839
|
+
.excalidraw .buttonList label,
|
|
8840
|
+
.excalidraw .buttonList button,
|
|
8841
|
+
.excalidraw .buttonList .zIndexButton {
|
|
8842
|
+
padding: 0;
|
|
8843
|
+
}
|
|
8844
|
+
.excalidraw .buttonList label svg,
|
|
8845
|
+
.excalidraw .buttonList button svg,
|
|
8846
|
+
.excalidraw .buttonList .zIndexButton svg {
|
|
8847
|
+
width: var(--default-icon-size);
|
|
8848
|
+
height: var(--default-icon-size);
|
|
8849
|
+
}
|
|
8850
|
+
.excalidraw .App-top-bar {
|
|
8851
|
+
z-index: var(--zIndex-ui-top);
|
|
8852
|
+
display: flex;
|
|
8853
|
+
flex-direction: column;
|
|
8854
|
+
}
|
|
8855
|
+
.excalidraw .App-welcome-screen {
|
|
8856
|
+
z-index: var(--zIndex-layerUI);
|
|
8857
|
+
}
|
|
8858
|
+
.excalidraw .App-bottom-bar {
|
|
8859
|
+
position: absolute;
|
|
8860
|
+
width: calc(100% - 28px);
|
|
8861
|
+
max-width: 450px;
|
|
8862
|
+
bottom: 0;
|
|
8863
|
+
left: 50%;
|
|
8864
|
+
transform: translateX(-50%);
|
|
8865
|
+
--bar-padding: calc(4 * var(--space-factor));
|
|
8866
|
+
z-index: var(--zIndex-ui-bottom);
|
|
8867
|
+
display: flex;
|
|
8868
|
+
flex-direction: column;
|
|
8869
|
+
pointer-events: none;
|
|
8870
|
+
justify-content: center;
|
|
8871
|
+
}
|
|
8872
|
+
.excalidraw .App-bottom-bar > .Island {
|
|
8873
|
+
box-sizing: border-box;
|
|
8874
|
+
max-height: 100%;
|
|
8875
|
+
padding: 4px;
|
|
8876
|
+
display: flex;
|
|
8877
|
+
flex-direction: column;
|
|
8878
|
+
pointer-events: var(--ui-pointerEvents);
|
|
8879
|
+
}
|
|
8880
|
+
.excalidraw .App-toolbar {
|
|
8881
|
+
display: flex;
|
|
8882
|
+
justify-content: center;
|
|
8883
|
+
}
|
|
8884
|
+
.excalidraw .App-toolbar .eraser.ToolIcon:hover {
|
|
8885
|
+
--icon-fill-color: #fff;
|
|
8886
|
+
--keybinding-color: #fff;
|
|
8887
|
+
}
|
|
8888
|
+
.excalidraw .App-toolbar .eraser.active {
|
|
8889
|
+
background-color: var(--color-primary);
|
|
8890
|
+
}
|
|
8891
|
+
.excalidraw .excalidraw-ui-top-left,
|
|
8892
|
+
.excalidraw .excalidraw-ui-top-right {
|
|
8893
|
+
display: flex;
|
|
8894
|
+
align-items: center;
|
|
8895
|
+
gap: 0.5rem;
|
|
8896
|
+
}
|
|
8897
|
+
.excalidraw .App-toolbar-content {
|
|
8898
|
+
display: flex;
|
|
8899
|
+
flex-direction: column;
|
|
8900
|
+
pointer-events: none;
|
|
8901
|
+
}
|
|
8902
|
+
.excalidraw .App-toolbar-content > * {
|
|
8903
|
+
pointer-events: var(--ui-pointerEvents);
|
|
8904
|
+
}
|
|
8905
|
+
.excalidraw .App-mobile-menu {
|
|
8906
|
+
width: 100%;
|
|
8907
|
+
overflow-x: visible;
|
|
8908
|
+
overflow-y: auto;
|
|
8909
|
+
box-sizing: border-box;
|
|
8910
|
+
margin-bottom: var(--bar-padding);
|
|
8911
|
+
}
|
|
8912
|
+
.excalidraw .App-mobile-menu .selected-shape-actions {
|
|
8913
|
+
padding: 8px 8px 0 8px;
|
|
8914
|
+
}
|
|
8915
|
+
.excalidraw .App-menu {
|
|
8916
|
+
display: grid;
|
|
8917
|
+
color: var(--icon-fill-color);
|
|
8918
|
+
}
|
|
8919
|
+
.excalidraw .shapes-section {
|
|
8920
|
+
display: flex;
|
|
8921
|
+
justify-content: center;
|
|
8922
|
+
pointer-events: none !important;
|
|
8923
|
+
}
|
|
8924
|
+
.excalidraw .shapes-section > * {
|
|
8925
|
+
pointer-events: var(--ui-pointerEvents);
|
|
8926
|
+
}
|
|
8927
|
+
.excalidraw .App-menu_top {
|
|
8928
|
+
grid-template-columns: 1fr 2fr 1fr;
|
|
8929
|
+
grid-gap: 1rem;
|
|
8930
|
+
align-items: flex-start;
|
|
8931
|
+
cursor: default;
|
|
8932
|
+
pointer-events: none !important;
|
|
8933
|
+
}
|
|
8934
|
+
.excalidraw .App-menu_top > * {
|
|
8935
|
+
pointer-events: var(--ui-pointerEvents);
|
|
8936
|
+
}
|
|
8937
|
+
@media (min-width: 1536px) {
|
|
8938
|
+
.excalidraw .App-menu_top {
|
|
8939
|
+
grid-template-columns: 1fr 1fr 1fr;
|
|
8940
|
+
grid-gap: 3rem;
|
|
8941
|
+
}
|
|
8942
|
+
}
|
|
8943
|
+
.excalidraw .App-menu_top > *:first-child {
|
|
8944
|
+
justify-self: flex-start;
|
|
8945
|
+
}
|
|
8946
|
+
.excalidraw .selected-shape-actions-container {
|
|
8947
|
+
width: fit-content;
|
|
8948
|
+
}
|
|
8949
|
+
.excalidraw .selected-shape-actions-container--compact {
|
|
8950
|
+
min-width: 48px;
|
|
8951
|
+
}
|
|
8952
|
+
.excalidraw .App-menu_top > *:last-child {
|
|
8953
|
+
justify-self: flex-end;
|
|
8954
|
+
}
|
|
8955
|
+
.excalidraw .App-menu_bottom {
|
|
8956
|
+
position: absolute;
|
|
8957
|
+
bottom: 1rem;
|
|
8958
|
+
display: flex;
|
|
8959
|
+
justify-content: space-between;
|
|
8960
|
+
align-items: flex-start;
|
|
8961
|
+
cursor: default;
|
|
8962
|
+
pointer-events: none !important;
|
|
8963
|
+
box-sizing: border-box;
|
|
8964
|
+
padding: 0 1rem;
|
|
8965
|
+
}
|
|
8966
|
+
.excalidraw .App-menu_bottom--transition-left section {
|
|
8967
|
+
width: 185px;
|
|
8968
|
+
}
|
|
8969
|
+
.excalidraw .App-menu_bottom section {
|
|
8970
|
+
display: flex;
|
|
8971
|
+
}
|
|
8972
|
+
.excalidraw .App-menu_bottom > *:first-child {
|
|
8973
|
+
justify-self: flex-start;
|
|
8974
|
+
}
|
|
8975
|
+
.excalidraw .App-menu_bottom > *:last-child {
|
|
8976
|
+
justify-self: flex-end;
|
|
8977
|
+
}
|
|
8978
|
+
.excalidraw .App-menu_left {
|
|
8979
|
+
grid-template-rows: 1fr auto 1fr;
|
|
8980
|
+
height: 100%;
|
|
8981
|
+
}
|
|
8982
|
+
.excalidraw .App-menu_right {
|
|
8983
|
+
grid-template-rows: 1fr;
|
|
8984
|
+
height: 100%;
|
|
8985
|
+
}
|
|
8986
|
+
.excalidraw .App-menu__left {
|
|
8987
|
+
overflow-y: auto;
|
|
8988
|
+
padding: 0.75rem;
|
|
8989
|
+
width: 12.5rem;
|
|
8990
|
+
box-sizing: border-box;
|
|
8991
|
+
position: absolute;
|
|
8992
|
+
}
|
|
8993
|
+
.excalidraw .dropdown-select {
|
|
8994
|
+
height: 1.5rem;
|
|
8995
|
+
padding: 0;
|
|
8996
|
+
padding-inline-start: 0.5rem;
|
|
8997
|
+
padding-inline-end: 1.5rem;
|
|
8998
|
+
color: var(--icon-fill-color);
|
|
8999
|
+
background-color: var(--button-gray-1);
|
|
9000
|
+
border-radius: var(--space-factor);
|
|
9001
|
+
border: 1px solid var(--button-gray-2);
|
|
9002
|
+
font-size: 0.8rem;
|
|
9003
|
+
font-family: inherit;
|
|
9004
|
+
outline: none;
|
|
9005
|
+
appearance: none;
|
|
9006
|
+
background-image: var(--dropdown-icon);
|
|
9007
|
+
background-repeat: no-repeat;
|
|
9008
|
+
background-position: right 0.7rem top 50%, 0 0;
|
|
9009
|
+
background-size: 0.65em auto, 100%;
|
|
9010
|
+
}
|
|
9011
|
+
:root[dir=rtl] .excalidraw .dropdown-select {
|
|
9012
|
+
background-position: left 0.7rem top 50%, 0 0;
|
|
9013
|
+
}
|
|
9014
|
+
.excalidraw .dropdown-select:focus {
|
|
9015
|
+
box-shadow: 0 0 0 2px var(--focus-highlight-color);
|
|
9016
|
+
}
|
|
9017
|
+
.excalidraw .dropdown-select:hover {
|
|
9018
|
+
background-color: var(--button-gray-2);
|
|
9019
|
+
}
|
|
9020
|
+
.excalidraw .dropdown-select:active {
|
|
9021
|
+
background-color: var(--button-gray-2);
|
|
9022
|
+
}
|
|
9023
|
+
.excalidraw .dropdown-select__language {
|
|
9024
|
+
height: 2rem;
|
|
9025
|
+
background-color: var(--island-bg-color);
|
|
9026
|
+
border-color: var(--default-border-color) !important;
|
|
9027
|
+
cursor: pointer;
|
|
9028
|
+
}
|
|
9029
|
+
.excalidraw .dropdown-select__language:hover {
|
|
9030
|
+
background-color: var(--island-bg-color);
|
|
9031
|
+
}
|
|
9032
|
+
.excalidraw .scroll-back-to-content {
|
|
9033
|
+
border-radius: var(--border-radius-lg);
|
|
9034
|
+
background-color: var(--island-bg-color);
|
|
9035
|
+
color: var(--icon-fill-color);
|
|
9036
|
+
border: 1px solid var(--default-border-color);
|
|
9037
|
+
padding: 10px 20px;
|
|
9038
|
+
position: absolute;
|
|
9039
|
+
left: 50%;
|
|
9040
|
+
bottom: 30px;
|
|
9041
|
+
transform: translateX(-50%);
|
|
9042
|
+
pointer-events: var(--ui-pointerEvents);
|
|
9043
|
+
font-family: inherit;
|
|
9044
|
+
}
|
|
9045
|
+
.excalidraw .scroll-back-to-content:hover {
|
|
9046
|
+
background-color: var(--button-hover-bg);
|
|
9047
|
+
}
|
|
9048
|
+
.excalidraw .scroll-back-to-content:active {
|
|
9049
|
+
border: 1px solid var(--button-active-border);
|
|
9050
|
+
}
|
|
9051
|
+
.excalidraw .floating-status-stack {
|
|
9052
|
+
position: absolute;
|
|
9053
|
+
left: 50%;
|
|
9054
|
+
bottom: 30px;
|
|
9055
|
+
transform: translateX(-50%);
|
|
9056
|
+
display: flex;
|
|
9057
|
+
flex-direction: column;
|
|
9058
|
+
align-items: center;
|
|
9059
|
+
gap: 0.5rem;
|
|
9060
|
+
pointer-events: none;
|
|
9061
|
+
}
|
|
9062
|
+
.excalidraw .floating-status-stack .scroll-back-to-content {
|
|
9063
|
+
position: static;
|
|
9064
|
+
left: auto;
|
|
9065
|
+
bottom: auto;
|
|
9066
|
+
transform: none;
|
|
9067
|
+
pointer-events: var(--ui-pointerEvents);
|
|
9068
|
+
}
|
|
9069
|
+
.excalidraw .help-icon {
|
|
9070
|
+
display: flex;
|
|
9071
|
+
justify-content: center;
|
|
9072
|
+
align-items: center;
|
|
9073
|
+
padding: 0.625rem;
|
|
9074
|
+
width: var(--button-width, var(--default-button-size));
|
|
9075
|
+
height: var(--button-height, var(--default-button-size));
|
|
9076
|
+
box-sizing: border-box;
|
|
9077
|
+
border-width: 1px;
|
|
9078
|
+
border-style: solid;
|
|
9079
|
+
border-color: var(--button-border, var(--default-border-color));
|
|
9080
|
+
border-radius: var(--border-radius-lg);
|
|
9081
|
+
cursor: pointer;
|
|
9082
|
+
background-color: var(--button-bg, var(--island-bg-color));
|
|
9083
|
+
color: var(--button-color, var(--color-on-surface));
|
|
9084
|
+
font-family: var(--ui-font);
|
|
9085
|
+
border: none;
|
|
9086
|
+
box-shadow: 0 0 0 1px var(--color-surface-lowest);
|
|
9087
|
+
background-color: var(--color-surface-low);
|
|
9088
|
+
width: var(--lg-button-size);
|
|
9089
|
+
height: var(--lg-button-size);
|
|
9090
|
+
}
|
|
9091
|
+
.excalidraw .help-icon svg {
|
|
9092
|
+
width: var(--button-width, var(--lg-icon-size));
|
|
9093
|
+
height: var(--button-height, var(--lg-icon-size));
|
|
9094
|
+
}
|
|
9095
|
+
.excalidraw .help-icon:hover {
|
|
9096
|
+
background-color: var(--button-hover-bg, var(--island-bg-color));
|
|
9097
|
+
border-color: var(--button-hover-border, var(--button-border, var(--default-border-color)));
|
|
9098
|
+
color: var(--button-hover-color, var(--button-color, var(--text-primary-color, inherit)));
|
|
9099
|
+
}
|
|
9100
|
+
.excalidraw .help-icon:active {
|
|
9101
|
+
background-color: var(--button-active-bg, var(--island-bg-color));
|
|
9102
|
+
border-color: var(--button-active-border, var(--color-primary-darkest));
|
|
9103
|
+
}
|
|
9104
|
+
.excalidraw .help-icon.active {
|
|
9105
|
+
background-color: var(--button-selected-bg, var(--color-surface-primary-container));
|
|
9106
|
+
border-color: var(--button-selected-border, var(--color-surface-primary-container));
|
|
9107
|
+
}
|
|
9108
|
+
.excalidraw .help-icon.active:hover {
|
|
9109
|
+
background-color: var(--button-selected-hover-bg, var(--color-surface-primary-container));
|
|
9110
|
+
}
|
|
9111
|
+
.excalidraw .help-icon.active svg {
|
|
9112
|
+
color: var(--button-color, var(--color-on-primary-container));
|
|
9113
|
+
}
|
|
9114
|
+
.excalidraw--mobile.excalidraw .help-icon {
|
|
9115
|
+
width: var(--mobile-action-button-size, var(--default-button-size));
|
|
9116
|
+
height: var(--mobile-action-button-size, var(--default-button-size));
|
|
9117
|
+
}
|
|
9118
|
+
.excalidraw .help-icon:active {
|
|
9119
|
+
box-shadow: 0 0 0 1px var(--color-brand-active);
|
|
9120
|
+
}
|
|
9121
|
+
.excalidraw--mobile.excalidraw .help-icon {
|
|
9122
|
+
width: var(--mobile-action-button-size, 2rem);
|
|
9123
|
+
height: var(--mobile-action-button-size, 2rem);
|
|
9124
|
+
}
|
|
9125
|
+
.excalidraw .help-icon svg {
|
|
9126
|
+
width: var(--lg-icon-size);
|
|
9127
|
+
height: var(--lg-icon-size);
|
|
9128
|
+
}
|
|
9129
|
+
.excalidraw .reset-zoom-button {
|
|
9130
|
+
font-family: var(--ui-font);
|
|
9131
|
+
}
|
|
9132
|
+
.excalidraw .finalize-button {
|
|
9133
|
+
display: grid;
|
|
9134
|
+
grid-auto-flow: column;
|
|
9135
|
+
gap: 0.4em;
|
|
9136
|
+
margin-top: auto;
|
|
9137
|
+
margin-bottom: auto;
|
|
9138
|
+
margin-inline-start: 0.6em;
|
|
9139
|
+
}
|
|
9140
|
+
.excalidraw .undo-redo-buttons,
|
|
9141
|
+
.excalidraw .eraser-buttons {
|
|
9142
|
+
display: grid;
|
|
9143
|
+
grid-auto-flow: column;
|
|
9144
|
+
margin-top: auto;
|
|
9145
|
+
margin-bottom: auto;
|
|
9146
|
+
margin-inline-start: 0.6em;
|
|
9147
|
+
}
|
|
9148
|
+
.excalidraw--mobile.excalidraw aside {
|
|
9149
|
+
display: none;
|
|
9150
|
+
}
|
|
9151
|
+
.excalidraw--mobile.excalidraw .scroll-back-to-content {
|
|
9152
|
+
bottom: calc(100px + var(--sab, 0));
|
|
9153
|
+
z-index: -1;
|
|
9154
|
+
}
|
|
9155
|
+
:root[dir=rtl] .excalidraw .rtl-mirror {
|
|
9156
|
+
transform: scaleX(-1);
|
|
9157
|
+
}
|
|
9158
|
+
.excalidraw .zen-mode-visibility {
|
|
9159
|
+
visibility: visible;
|
|
9160
|
+
opacity: 1;
|
|
9161
|
+
height: auto;
|
|
9162
|
+
width: auto;
|
|
9163
|
+
transition: opacity 0.5s;
|
|
9164
|
+
}
|
|
9165
|
+
.excalidraw .zen-mode-visibility.zen-mode-visibility--hidden {
|
|
9166
|
+
visibility: hidden;
|
|
9167
|
+
opacity: 0;
|
|
9168
|
+
height: 0;
|
|
9169
|
+
width: 0;
|
|
9170
|
+
transition: opacity 0.5s;
|
|
9171
|
+
}
|
|
9172
|
+
.excalidraw .disable-pointerEvents {
|
|
9173
|
+
pointer-events: none !important;
|
|
9174
|
+
}
|
|
9175
|
+
.excalidraw.excalidraw--view-mode .App-menu {
|
|
9176
|
+
display: flex;
|
|
9177
|
+
justify-content: space-between;
|
|
9178
|
+
}
|
|
9179
|
+
.excalidraw input.is-redacted {
|
|
9180
|
+
-webkit-text-security: disc;
|
|
9181
|
+
}
|
|
9182
|
+
.excalidraw input[type=text],
|
|
9183
|
+
.excalidraw textarea:not(.excalidraw-wysiwyg) {
|
|
9184
|
+
color: var(--text-primary-color);
|
|
9185
|
+
border: 1.5px solid var(--input-border-color);
|
|
9186
|
+
padding: 0.75rem;
|
|
9187
|
+
white-space: nowrap;
|
|
9188
|
+
border-radius: var(--space-factor);
|
|
9189
|
+
background-color: var(--input-bg-color);
|
|
9190
|
+
}
|
|
9191
|
+
.excalidraw input[type=text]:not(:focus):hover,
|
|
9192
|
+
.excalidraw textarea:not(.excalidraw-wysiwyg):not(:focus):hover {
|
|
9193
|
+
border-color: var(--color-brand-hover);
|
|
9194
|
+
}
|
|
9195
|
+
.excalidraw input[type=text]:focus,
|
|
9196
|
+
.excalidraw textarea:not(.excalidraw-wysiwyg):focus {
|
|
9197
|
+
outline: none;
|
|
9198
|
+
border-color: var(--color-brand-hover);
|
|
9199
|
+
}
|
|
9200
|
+
@media print {
|
|
9201
|
+
.excalidraw .App-bottom-bar,
|
|
9202
|
+
.excalidraw .FixedSideContainer,
|
|
9203
|
+
.excalidraw .layer-ui__wrapper {
|
|
9204
|
+
display: none;
|
|
9205
|
+
}
|
|
9206
|
+
}
|
|
9207
|
+
.excalidraw ::-webkit-scrollbar {
|
|
9208
|
+
width: 4px;
|
|
9209
|
+
height: 3px;
|
|
9210
|
+
}
|
|
9211
|
+
.excalidraw select::-webkit-scrollbar {
|
|
9212
|
+
width: 10px;
|
|
9213
|
+
}
|
|
9214
|
+
.excalidraw ::-webkit-scrollbar-thumb {
|
|
9215
|
+
background: var(--scrollbar-thumb);
|
|
9216
|
+
border-radius: 10px;
|
|
9217
|
+
}
|
|
9218
|
+
.excalidraw ::-webkit-scrollbar-thumb:hover {
|
|
9219
|
+
background: var(--scrollbar-thumb-hover);
|
|
9220
|
+
}
|
|
9221
|
+
.excalidraw ::-webkit-scrollbar-thumb:active {
|
|
9222
|
+
background: var(--scrollbar-thumb);
|
|
9223
|
+
}
|
|
9224
|
+
.excalidraw .mobile-misc-tools-container {
|
|
9225
|
+
position: absolute;
|
|
9226
|
+
top: calc(5rem - var(--editor-container-padding));
|
|
9227
|
+
right: calc(var(--editor-container-padding) * -1);
|
|
9228
|
+
display: flex;
|
|
9229
|
+
flex-direction: column;
|
|
9230
|
+
border: 1px solid var(--sidebar-border-color);
|
|
9231
|
+
border-top-left-radius: var(--border-radius-lg);
|
|
9232
|
+
border-bottom-left-radius: var(--border-radius-lg);
|
|
9233
|
+
border-right: 0;
|
|
9234
|
+
overflow: hidden;
|
|
9235
|
+
background-color: var(--island-bg-color);
|
|
9236
|
+
}
|
|
9237
|
+
.excalidraw .mobile-misc-tools-container .ToolIcon__icon {
|
|
9238
|
+
width: 2rem;
|
|
9239
|
+
height: 2rem;
|
|
9240
|
+
border-radius: 0;
|
|
9241
|
+
}
|
|
9242
|
+
.excalidraw .mobile-misc-tools-container .default-sidebar-trigger {
|
|
9243
|
+
border: 0;
|
|
9244
|
+
}
|
|
9245
|
+
.excalidraw .mobile-misc-tools-container-left {
|
|
9246
|
+
position: fixed;
|
|
9247
|
+
top: 5rem;
|
|
9248
|
+
left: 0;
|
|
9249
|
+
display: flex;
|
|
9250
|
+
flex-direction: column;
|
|
9251
|
+
border: 1px solid var(--sidebar-border-color);
|
|
9252
|
+
border-top-right-radius: var(--border-radius-lg);
|
|
9253
|
+
border-bottom-right-radius: var(--border-radius-lg);
|
|
9254
|
+
border-left: 0;
|
|
9255
|
+
background-color: var(--island-bg-color);
|
|
9256
|
+
}
|
|
9257
|
+
.excalidraw .mobile-misc-tools-container-left .ToolIcon__icon {
|
|
9258
|
+
border-radius: 0;
|
|
9259
|
+
}
|
|
9260
|
+
.excalidraw .mobile-misc-tools-container-left .library-button {
|
|
9261
|
+
border: 0;
|
|
9262
|
+
}
|
|
9263
|
+
.excalidraw .App-toolbar--mobile {
|
|
9264
|
+
overflow: visible;
|
|
9265
|
+
max-width: 98vw;
|
|
9266
|
+
}
|
|
9267
|
+
.excalidraw .App-toolbar--mobile .ToolIcon__keybinding {
|
|
9268
|
+
display: none;
|
|
9269
|
+
}
|
|
9270
|
+
.excalidraw .UserList-Wrapper {
|
|
9271
|
+
margin: 0;
|
|
9272
|
+
padding: 0;
|
|
9273
|
+
border: none;
|
|
9274
|
+
text-align: left;
|
|
9275
|
+
}
|
|
9276
|
+
.excalidraw .UserList-Wrapper legend {
|
|
9277
|
+
display: block;
|
|
9278
|
+
font-size: 0.75rem;
|
|
9279
|
+
font-weight: 400;
|
|
9280
|
+
margin: 0 0 0.25rem;
|
|
9281
|
+
padding: 0;
|
|
9282
|
+
}
|
|
9283
|
+
.excalidraw .main-menu {
|
|
9284
|
+
z-index: var(--zIndex-ui-main-menu);
|
|
9285
|
+
}
|
|
9286
|
+
.excalidraw .main-menu-trigger {
|
|
9287
|
+
border: none;
|
|
9288
|
+
box-shadow: 0 0 0 1px var(--color-surface-lowest);
|
|
9289
|
+
background-color: var(--color-surface-low);
|
|
9290
|
+
}
|
|
9291
|
+
.excalidraw .main-menu-trigger:active {
|
|
9292
|
+
box-shadow: 0 0 0 1px var(--color-brand-active);
|
|
9293
|
+
}
|
|
9294
|
+
.excalidraw--mobile.excalidraw .main-menu-trigger {
|
|
9295
|
+
width: var(--mobile-action-button-size, 2rem);
|
|
9296
|
+
height: var(--mobile-action-button-size, 2rem);
|
|
9297
|
+
}
|
|
9298
|
+
.excalidraw .App-mobile-menu,
|
|
9299
|
+
.excalidraw .App-menu__left {
|
|
9300
|
+
--button-border: transparent;
|
|
9301
|
+
--button-bg: var(--color-surface-mid);
|
|
9302
|
+
}
|
|
9303
|
+
.excalidraw.theme--dark.excalidraw .App-mobile-menu,
|
|
9304
|
+
.excalidraw.theme--dark.excalidraw .App-menu__left {
|
|
9305
|
+
--button-hover-bg: #363541;
|
|
9306
|
+
--button-bg: var(--color-surface-high);
|
|
9307
|
+
}
|
|
9308
|
+
.excalidraw .App-menu__left .buttonList {
|
|
9309
|
+
padding: 0.25rem 0;
|
|
9310
|
+
}
|
|
9311
|
+
.excalidraw .excalidraw__paragraph {
|
|
9312
|
+
margin: 1rem 0;
|
|
9313
|
+
}
|
|
9314
|
+
.excalidraw .Modal__content .excalidraw__paragraph:first-child {
|
|
9315
|
+
margin-top: 0;
|
|
9316
|
+
}
|
|
9317
|
+
.excalidraw .Modal__content .excalidraw__paragraph + .excalidraw__paragraph {
|
|
9318
|
+
margin-top: 0rem;
|
|
9319
|
+
}
|
|
9320
|
+
.excalidraw .link-button {
|
|
9321
|
+
display: flex;
|
|
9322
|
+
text-decoration: none !important;
|
|
9323
|
+
}
|
|
9324
|
+
.ErrorSplash.excalidraw {
|
|
9325
|
+
min-height: 100vh;
|
|
9326
|
+
padding: 20px 0;
|
|
9327
|
+
overflow: auto;
|
|
9328
|
+
display: flex;
|
|
9329
|
+
align-items: center;
|
|
9330
|
+
justify-content: center;
|
|
9331
|
+
user-select: text;
|
|
9332
|
+
}
|
|
9333
|
+
.ErrorSplash.excalidraw .ErrorSplash-messageContainer {
|
|
9334
|
+
display: flex;
|
|
9335
|
+
flex-direction: column;
|
|
9336
|
+
align-items: center;
|
|
9337
|
+
justify-content: center;
|
|
9338
|
+
padding: 40px;
|
|
9339
|
+
background-color: #ffe3e3;
|
|
9340
|
+
border: 3px solid #c92a2a;
|
|
9341
|
+
}
|
|
9342
|
+
.ErrorSplash.excalidraw .ErrorSplash-paragraph {
|
|
9343
|
+
margin: 15px 0;
|
|
9344
|
+
max-width: 600px;
|
|
9345
|
+
}
|
|
9346
|
+
.ErrorSplash.excalidraw .ErrorSplash-paragraph.align-center {
|
|
9347
|
+
text-align: center;
|
|
9348
|
+
}
|
|
9349
|
+
.ErrorSplash.excalidraw .bigger,
|
|
9350
|
+
.ErrorSplash.excalidraw .bigger button {
|
|
9351
|
+
font-size: 1.1em;
|
|
9352
|
+
}
|
|
9353
|
+
.ErrorSplash.excalidraw .smaller,
|
|
9354
|
+
.ErrorSplash.excalidraw .smaller button {
|
|
9355
|
+
font-size: 0.9em;
|
|
9356
|
+
}
|
|
9357
|
+
.ErrorSplash.excalidraw .ErrorSplash-details {
|
|
9358
|
+
display: flex;
|
|
9359
|
+
flex-direction: column;
|
|
9360
|
+
align-items: flex-start;
|
|
9361
|
+
}
|
|
9362
|
+
.ErrorSplash.excalidraw .ErrorSplash-details textarea {
|
|
9363
|
+
width: 100%;
|
|
9364
|
+
margin: 10px 0;
|
|
9365
|
+
font-family: "Cascadia";
|
|
9366
|
+
font-size: 0.8em;
|
|
9367
|
+
}
|
|
9368
|
+
.excalidraw__embeddable-container .excalidraw__embeddable-container__inner {
|
|
9369
|
+
overflow: hidden;
|
|
9370
|
+
display: flex;
|
|
9371
|
+
align-items: center;
|
|
9372
|
+
justify-content: center;
|
|
9373
|
+
border-radius: var(--embeddable-radius);
|
|
9374
|
+
}
|
|
9375
|
+
.excalidraw__embeddable-container .excalidraw__embeddable__outer {
|
|
9376
|
+
width: 100%;
|
|
9377
|
+
height: 100%;
|
|
9378
|
+
}
|
|
9379
|
+
.excalidraw__embeddable-container .excalidraw__embeddable__outer > * {
|
|
9380
|
+
border-radius: var(--embeddable-radius);
|
|
9381
|
+
}
|
|
9382
|
+
.excalidraw__embeddable-container .excalidraw__embeddable-hint {
|
|
9383
|
+
position: absolute;
|
|
9384
|
+
z-index: 1;
|
|
9385
|
+
background: rgba(0, 0, 0, 0.5);
|
|
9386
|
+
padding: 1rem 1.6rem;
|
|
9387
|
+
border-radius: 12px;
|
|
9388
|
+
color: #fff;
|
|
9389
|
+
font-weight: 700;
|
|
9390
|
+
letter-spacing: 0.6px;
|
|
9391
|
+
font-family: "Assistant";
|
|
9392
|
+
}
|
|
9393
|
+
.tta-floating-launcher {
|
|
9394
|
+
position: fixed;
|
|
9395
|
+
bottom: 4.5rem;
|
|
9396
|
+
right: 1rem;
|
|
9397
|
+
display: flex;
|
|
9398
|
+
flex-direction: column;
|
|
9399
|
+
align-items: flex-end;
|
|
9400
|
+
gap: 0.75rem;
|
|
9401
|
+
pointer-events: none;
|
|
9402
|
+
z-index: var(--zIndex-ui-tta-chat);
|
|
9403
|
+
}
|
|
9404
|
+
@media (max-width: 768px) {
|
|
9405
|
+
.tta-floating-launcher {
|
|
9406
|
+
display: none;
|
|
9407
|
+
}
|
|
9408
|
+
}
|
|
9409
|
+
.tta-floating-inline {
|
|
9410
|
+
display: inline-flex;
|
|
9411
|
+
align-items: center;
|
|
9412
|
+
pointer-events: auto;
|
|
9413
|
+
}
|
|
9414
|
+
@media (max-width: 768px) {
|
|
9415
|
+
.tta-floating-inline {
|
|
9416
|
+
display: none;
|
|
9417
|
+
}
|
|
9418
|
+
}
|
|
9419
|
+
.tta-floating-inline .tta-floating-button {
|
|
9420
|
+
box-shadow: none;
|
|
9421
|
+
}
|
|
9422
|
+
.tta-floating-button {
|
|
9423
|
+
pointer-events: auto;
|
|
9424
|
+
border: none;
|
|
9425
|
+
border-radius: var(--border-radius-lg);
|
|
9426
|
+
padding: 0.65rem 1.25rem;
|
|
9427
|
+
display: inline-flex;
|
|
9428
|
+
align-items: center;
|
|
9429
|
+
gap: 0.5rem;
|
|
9430
|
+
font-weight: 600;
|
|
9431
|
+
background-color: var(--color-primary);
|
|
9432
|
+
color: var(--color-icon-white);
|
|
9433
|
+
box-shadow: 0px 14px 30px rgba(0, 0, 0, 0.2);
|
|
9434
|
+
cursor: pointer;
|
|
9435
|
+
transition: transform 0.15s ease, box-shadow 0.15s ease;
|
|
9436
|
+
}
|
|
9437
|
+
.tta-floating-button:hover {
|
|
9438
|
+
background: var(--color-primary-darker);
|
|
9439
|
+
}
|
|
9440
|
+
.tta-floating-button--active {
|
|
9441
|
+
background: var(--color-primary-darker);
|
|
9442
|
+
}
|
|
9443
|
+
.tta-floating-button__icon {
|
|
9444
|
+
display: flex;
|
|
9445
|
+
align-items: center;
|
|
9446
|
+
justify-content: center;
|
|
9447
|
+
line-height: 0;
|
|
9448
|
+
width: 1rem;
|
|
9449
|
+
height: 1rem;
|
|
9450
|
+
}
|
|
9451
|
+
.tta-panel__surface {
|
|
9452
|
+
pointer-events: auto;
|
|
9453
|
+
background: var(--default-bg-color, #fff);
|
|
9454
|
+
border-radius: var(--border-radius-lg);
|
|
9455
|
+
width: min(400px, 100vw - 2.5rem);
|
|
9456
|
+
height: min(720px, 100vh - 10rem);
|
|
9457
|
+
box-shadow: var(--shadow-island);
|
|
9458
|
+
position: relative;
|
|
9459
|
+
overflow: hidden;
|
|
9460
|
+
}
|
|
9461
|
+
.tta-panel__header {
|
|
9462
|
+
display: flex;
|
|
9463
|
+
align-items: center;
|
|
9464
|
+
justify-content: space-between;
|
|
9465
|
+
gap: 0.5rem;
|
|
9466
|
+
padding: 0.75rem;
|
|
9467
|
+
border-bottom: 1px solid var(--sidebar-border-color);
|
|
9468
|
+
}
|
|
9469
|
+
.tta-panel__title {
|
|
9470
|
+
font-size: 1rem;
|
|
9471
|
+
font-weight: 600;
|
|
9472
|
+
color: var(--color-primary);
|
|
9473
|
+
}
|
|
9474
|
+
.tta-panel__header-actions {
|
|
9475
|
+
display: flex;
|
|
9476
|
+
align-items: center;
|
|
9477
|
+
gap: 0.75rem;
|
|
9478
|
+
margin-left: auto;
|
|
9479
|
+
}
|
|
9480
|
+
.tta-panel__icon-button {
|
|
9481
|
+
border: 1px solid transparent;
|
|
9482
|
+
background: transparent;
|
|
9483
|
+
color: var(--text-primary-color);
|
|
9484
|
+
padding: 0rem;
|
|
9485
|
+
display: inline-flex;
|
|
9486
|
+
align-items: center;
|
|
9487
|
+
justify-content: center;
|
|
9488
|
+
cursor: pointer;
|
|
9489
|
+
transition: background 0.15s ease, border-color 0.15s ease;
|
|
9490
|
+
}
|
|
9491
|
+
.tta-panel__icon-button svg {
|
|
9492
|
+
width: 1rem;
|
|
9493
|
+
height: 1rem;
|
|
9494
|
+
}
|
|
9495
|
+
.tta-panel__icon-button:hover {
|
|
9496
|
+
color: var(--color-primary);
|
|
9497
|
+
}
|
|
9498
|
+
.tta-panel__new-chat-icon {
|
|
9499
|
+
display: inline-flex;
|
|
9500
|
+
align-items: center;
|
|
9501
|
+
justify-content: center;
|
|
9502
|
+
}
|
|
9503
|
+
.tta-panel__new-chat-text {
|
|
9504
|
+
white-space: nowrap;
|
|
9505
|
+
}
|
|
9506
|
+
.tta-panel__icon-button--active {
|
|
9507
|
+
background: transparent;
|
|
9508
|
+
border-color: transparent;
|
|
9509
|
+
color: var(--color-primary);
|
|
9510
|
+
}
|
|
9511
|
+
.tta-panel__icon-button--active svg {
|
|
9512
|
+
fill: currentColor;
|
|
9513
|
+
}
|
|
9514
|
+
.tta-panel__icon-button--active:hover {
|
|
9515
|
+
background: var(--color-primary-light);
|
|
9516
|
+
}
|
|
9517
|
+
.tta-panel__body {
|
|
9518
|
+
flex: 1;
|
|
9519
|
+
display: flex;
|
|
9520
|
+
flex-direction: column;
|
|
9521
|
+
height: 100%;
|
|
9522
|
+
min-height: 0;
|
|
9523
|
+
overflow: hidden;
|
|
9524
|
+
}
|
|
9525
|
+
.tta-chat-panel {
|
|
9526
|
+
display: flex;
|
|
9527
|
+
flex-direction: column;
|
|
9528
|
+
height: 100%;
|
|
9529
|
+
width: 100%;
|
|
9530
|
+
font-family: "Assistant", var(--ui-font, system-ui, sans-serif);
|
|
9531
|
+
}
|
|
9532
|
+
.tta-chat-panel--floating {
|
|
9533
|
+
position: relative;
|
|
9534
|
+
box-shadow: var(--shadow-island);
|
|
9535
|
+
background-color: var(--island-bg-color);
|
|
9536
|
+
}
|
|
9537
|
+
.tta-chat-container {
|
|
9538
|
+
display: flex;
|
|
9539
|
+
flex-direction: column;
|
|
9540
|
+
gap: 0.5rem;
|
|
9541
|
+
flex: 1;
|
|
9542
|
+
min-height: 0;
|
|
9543
|
+
overflow: hidden;
|
|
9544
|
+
}
|
|
9545
|
+
.tta-chat-list {
|
|
9546
|
+
flex: 1;
|
|
9547
|
+
background-color: transparent;
|
|
9548
|
+
border-radius: var(--border-radius-md);
|
|
9549
|
+
padding: 0.75rem;
|
|
9550
|
+
overflow-y: auto;
|
|
9551
|
+
display: flex;
|
|
9552
|
+
flex-direction: column;
|
|
9553
|
+
gap: 0.75rem;
|
|
9554
|
+
}
|
|
9555
|
+
.tta-chat-empty-state {
|
|
9556
|
+
display: flex;
|
|
9557
|
+
flex: 1;
|
|
9558
|
+
flex-direction: column;
|
|
9559
|
+
gap: 1.1rem;
|
|
9560
|
+
padding: 1rem;
|
|
9561
|
+
}
|
|
9562
|
+
.tta-chat-empty-middle {
|
|
9563
|
+
flex: 1;
|
|
9564
|
+
display: flex;
|
|
9565
|
+
align-items: center;
|
|
9566
|
+
}
|
|
9567
|
+
.tta-chat-empty-intro {
|
|
9568
|
+
width: 100%;
|
|
9569
|
+
display: grid;
|
|
9570
|
+
gap: 0.55rem;
|
|
9571
|
+
}
|
|
9572
|
+
.tta-chat-empty-top {
|
|
9573
|
+
width: 100%;
|
|
9574
|
+
}
|
|
9575
|
+
.tta-chat-empty-resume-card {
|
|
9576
|
+
width: 100%;
|
|
9577
|
+
border: 1px solid var(--sidebar-border-color);
|
|
9578
|
+
background-color: transparent;
|
|
9579
|
+
border-radius: var(--border-radius-lg);
|
|
9580
|
+
padding: 0.65rem;
|
|
9581
|
+
color: inherit;
|
|
9582
|
+
display: grid;
|
|
9583
|
+
grid-template-columns: 88px 1fr;
|
|
9584
|
+
gap: 0.75rem;
|
|
9585
|
+
align-items: center;
|
|
9586
|
+
cursor: pointer;
|
|
9587
|
+
transition: border-color 0.2s ease, transform 0.2s ease;
|
|
9588
|
+
}
|
|
9589
|
+
.tta-chat-empty-resume-card:hover {
|
|
9590
|
+
border-color: var(--color-primary);
|
|
9591
|
+
transform: translateY(-0.5px);
|
|
9592
|
+
}
|
|
9593
|
+
.tta-chat-empty-resume-card:focus-visible {
|
|
9594
|
+
outline: none;
|
|
9595
|
+
box-shadow: 0 0 0 2px rgba(105, 101, 219, 0.35);
|
|
9596
|
+
}
|
|
9597
|
+
.tta-chat-empty-resume-card__preview {
|
|
9598
|
+
width: 88px;
|
|
9599
|
+
height: 62px;
|
|
9600
|
+
border-radius: var(--border-radius-lg);
|
|
9601
|
+
overflow: hidden;
|
|
9602
|
+
border: 1px solid var(--sidebar-border-color);
|
|
9603
|
+
background: var(--sidebar-bg-color);
|
|
9604
|
+
}
|
|
9605
|
+
.tta-chat-empty-resume-card__preview img {
|
|
9606
|
+
width: 100%;
|
|
9607
|
+
height: 100%;
|
|
9608
|
+
object-fit: cover;
|
|
9609
|
+
display: block;
|
|
9610
|
+
}
|
|
9611
|
+
.tta-chat-empty-resume-card__placeholder {
|
|
9612
|
+
width: 100%;
|
|
9613
|
+
height: 100%;
|
|
9614
|
+
background:
|
|
9615
|
+
linear-gradient(
|
|
9616
|
+
135deg,
|
|
9617
|
+
var(--button-gray-1),
|
|
9618
|
+
var(--button-gray-2, var(--sidebar-border-color)));
|
|
9619
|
+
}
|
|
9620
|
+
.tta-chat-empty-resume-card__content {
|
|
9621
|
+
min-width: 0;
|
|
9622
|
+
text-align: left;
|
|
9623
|
+
}
|
|
9624
|
+
.tta-chat-empty-resume-card__label {
|
|
9625
|
+
font-size: 0.7rem;
|
|
9626
|
+
font-weight: 600;
|
|
9627
|
+
color: var(--color-primary);
|
|
9628
|
+
text-transform: uppercase;
|
|
9629
|
+
letter-spacing: 0.03em;
|
|
9630
|
+
}
|
|
9631
|
+
.tta-chat-empty-resume-card__title {
|
|
9632
|
+
margin-top: 0.1rem;
|
|
9633
|
+
font-size: 0.85rem;
|
|
9634
|
+
font-weight: 600;
|
|
9635
|
+
color: var(--text-primary-color);
|
|
9636
|
+
white-space: nowrap;
|
|
9637
|
+
overflow: hidden;
|
|
9638
|
+
text-overflow: ellipsis;
|
|
9639
|
+
}
|
|
9640
|
+
.tta-chat-empty-resume-card__meta {
|
|
9641
|
+
margin-top: 0.15rem;
|
|
9642
|
+
font-size: 0.7rem;
|
|
9643
|
+
color: var(--text-secondary-color);
|
|
9644
|
+
}
|
|
9645
|
+
.tta-chat-empty-how-it-works {
|
|
9646
|
+
width: 100%;
|
|
9647
|
+
max-width: 100%;
|
|
9648
|
+
box-sizing: border-box;
|
|
9649
|
+
background: var(--sidebar-bg-color);
|
|
9650
|
+
padding: 0.7rem 0.75rem;
|
|
9651
|
+
}
|
|
9652
|
+
.tta-chat-empty-how-it-works__title {
|
|
9653
|
+
font-size: 0.8rem;
|
|
9654
|
+
font-weight: 600;
|
|
9655
|
+
color: var(--text-primary-color);
|
|
9656
|
+
}
|
|
9657
|
+
.tta-chat-empty-how-it-works__steps {
|
|
9658
|
+
margin: 0.45rem 0 0;
|
|
9659
|
+
padding-left: 1rem;
|
|
9660
|
+
display: grid;
|
|
9661
|
+
gap: 0.3rem;
|
|
9662
|
+
font-size: 0.75rem;
|
|
9663
|
+
color: var(--text-secondary-color);
|
|
9664
|
+
}
|
|
9665
|
+
.tta-chat-empty-tagline {
|
|
9666
|
+
font-size: 0.9rem;
|
|
9667
|
+
padding: 0 4rem;
|
|
9668
|
+
color: var(--text-primary-color);
|
|
9669
|
+
line-height: 1.4;
|
|
9670
|
+
text-align: center;
|
|
9671
|
+
}
|
|
9672
|
+
.tta-chat-empty-storage-notice {
|
|
9673
|
+
font-size: 0.75rem;
|
|
9674
|
+
padding: 0 2rem;
|
|
9675
|
+
color: var(--text-secondary-color);
|
|
9676
|
+
line-height: 1.4;
|
|
9677
|
+
text-align: center;
|
|
9678
|
+
}
|
|
9679
|
+
.tta-chat-empty-storage-notice__more {
|
|
9680
|
+
border: 0;
|
|
9681
|
+
background: transparent;
|
|
9682
|
+
color: inherit !important;
|
|
9683
|
+
cursor: pointer;
|
|
9684
|
+
font: inherit !important;
|
|
9685
|
+
margin: 0;
|
|
9686
|
+
padding: 0;
|
|
9687
|
+
text-decoration-line: underline;
|
|
9688
|
+
text-decoration-style: dashed;
|
|
9689
|
+
text-decoration-color: #bbb;
|
|
9690
|
+
text-decoration-thickness: from-font;
|
|
9691
|
+
text-underline-offset: 0.2em;
|
|
9692
|
+
}
|
|
9693
|
+
.excalidraw.theme--dark .tta-chat-empty-storage-notice__more {
|
|
9694
|
+
text-decoration-color: #555;
|
|
9695
|
+
}
|
|
9696
|
+
.tta-chat-empty-storage-notice__more:hover {
|
|
9697
|
+
color: var(--text-primary-color);
|
|
9698
|
+
}
|
|
9699
|
+
.tta-chat-empty-storage-notice__more:focus-visible {
|
|
9700
|
+
outline: none;
|
|
9701
|
+
box-shadow: 0 1px 0 0 currentColor;
|
|
9702
|
+
}
|
|
9703
|
+
.tta-chat-empty-storage-dialog {
|
|
9704
|
+
color: var(--text-secondary-color);
|
|
9705
|
+
font-size: 0.875rem;
|
|
9706
|
+
line-height: 1.5;
|
|
9707
|
+
}
|
|
9708
|
+
.tta-chat-empty-storage-dialog p {
|
|
9709
|
+
margin: 0;
|
|
9710
|
+
}
|
|
9711
|
+
.tta-panel__support-banner {
|
|
9712
|
+
display: flex;
|
|
9713
|
+
align-items: center;
|
|
9714
|
+
gap: 0.5rem;
|
|
9715
|
+
min-height: 2.4rem;
|
|
9716
|
+
padding: 0.65rem 0.75rem;
|
|
9717
|
+
border-top: 1px solid var(--sidebar-border-color);
|
|
9718
|
+
background: var(--sidebar-bg-color);
|
|
9719
|
+
font-size: 0.75rem;
|
|
9720
|
+
}
|
|
9721
|
+
.tta-panel__support-banner-text {
|
|
9722
|
+
color: var(--text-secondary-color);
|
|
9723
|
+
flex: 1;
|
|
9724
|
+
min-width: 0;
|
|
9725
|
+
}
|
|
9726
|
+
.tta-panel__support-banner-links {
|
|
9727
|
+
display: flex;
|
|
9728
|
+
align-items: center;
|
|
9729
|
+
gap: 0.4rem;
|
|
9730
|
+
white-space: nowrap;
|
|
9731
|
+
}
|
|
9732
|
+
.tta-panel__support-banner-links a {
|
|
9733
|
+
color: var(--color-primary);
|
|
9734
|
+
text-decoration: underline;
|
|
9735
|
+
}
|
|
9736
|
+
.tta-panel__support-banner-dismiss {
|
|
9737
|
+
border: none;
|
|
9738
|
+
background: transparent;
|
|
9739
|
+
color: var(--text-secondary-color);
|
|
9740
|
+
display: inline-flex;
|
|
9741
|
+
align-items: center;
|
|
9742
|
+
justify-content: center;
|
|
9743
|
+
margin-left: 0.8rem;
|
|
9744
|
+
padding: 0;
|
|
9745
|
+
cursor: pointer;
|
|
9746
|
+
}
|
|
9747
|
+
.tta-panel__support-banner-dismiss svg {
|
|
9748
|
+
width: 0.9rem;
|
|
9749
|
+
height: 0.9rem;
|
|
9750
|
+
}
|
|
9751
|
+
.tta-panel__support-banner-dismiss:hover {
|
|
9752
|
+
color: var(--text-primary-color);
|
|
9753
|
+
}
|
|
9754
|
+
.tta-panel__footer {
|
|
9755
|
+
padding: 0 0.75rem 0.75rem;
|
|
9756
|
+
}
|
|
9757
|
+
.tta-preview-modal {
|
|
9758
|
+
display: flex;
|
|
9759
|
+
flex-direction: column;
|
|
9760
|
+
gap: 1rem;
|
|
9761
|
+
}
|
|
9762
|
+
.tta-preview-modal__header {
|
|
9763
|
+
display: flex;
|
|
9764
|
+
align-items: center;
|
|
9765
|
+
justify-content: space-between;
|
|
9766
|
+
padding: 0 0.85rem;
|
|
9767
|
+
}
|
|
9768
|
+
.tta-preview-modal__title {
|
|
9769
|
+
font-size: 1.25rem;
|
|
9770
|
+
font-weight: 600;
|
|
9771
|
+
}
|
|
9772
|
+
.tta-preview-modal__body {
|
|
9773
|
+
max-height: 70vh;
|
|
9774
|
+
overflow: auto;
|
|
9775
|
+
padding: 0.5rem;
|
|
9776
|
+
background: var(--sidebar-bg-color);
|
|
9777
|
+
}
|
|
9778
|
+
.tta-preview-modal img {
|
|
9779
|
+
width: 100%;
|
|
9780
|
+
height: auto;
|
|
9781
|
+
}
|
|
9782
|
+
.tta-preview-modal__close {
|
|
9783
|
+
border: none;
|
|
9784
|
+
background: transparent;
|
|
9785
|
+
cursor: pointer;
|
|
9786
|
+
display: inline-flex;
|
|
9787
|
+
align-items: center;
|
|
9788
|
+
justify-content: center;
|
|
9789
|
+
color: inherit;
|
|
9790
|
+
padding: 0.25rem;
|
|
9791
|
+
}
|
|
9792
|
+
.tta-history {
|
|
9793
|
+
position: absolute;
|
|
9794
|
+
inset: 0;
|
|
9795
|
+
z-index: 20;
|
|
9796
|
+
border-radius: inherit;
|
|
9797
|
+
background-color: var(--island-bg-color);
|
|
9798
|
+
padding: 0.75rem 0.75rem 0.75rem 1rem;
|
|
9799
|
+
display: flex;
|
|
9800
|
+
flex-direction: column;
|
|
9801
|
+
gap: 0.75rem;
|
|
9802
|
+
color: var(--text-primary-color);
|
|
9803
|
+
}
|
|
9804
|
+
.tta-history__header {
|
|
9805
|
+
display: flex;
|
|
9806
|
+
align-items: center;
|
|
9807
|
+
justify-content: space-between;
|
|
9808
|
+
gap: 0.5rem;
|
|
9809
|
+
}
|
|
9810
|
+
.tta-history__title {
|
|
9811
|
+
font-size: 1rem;
|
|
9812
|
+
font-weight: 600;
|
|
9813
|
+
}
|
|
9814
|
+
.tta-history__back-button {
|
|
9815
|
+
border: none;
|
|
9816
|
+
background: transparent;
|
|
9817
|
+
color: var(--text-primary-color);
|
|
9818
|
+
display: inline-flex;
|
|
9819
|
+
align-items: center;
|
|
9820
|
+
justify-content: center;
|
|
9821
|
+
cursor: pointer;
|
|
9822
|
+
border-radius: var(--border-radius-lg);
|
|
9823
|
+
height: 2.25rem;
|
|
9824
|
+
}
|
|
9825
|
+
.tta-history__back-button:hover {
|
|
9826
|
+
background-color: var(--button-hover-bg);
|
|
9827
|
+
}
|
|
9828
|
+
.tta-history__controls {
|
|
9829
|
+
display: flex;
|
|
9830
|
+
flex-direction: column;
|
|
9831
|
+
gap: 0.5rem;
|
|
9832
|
+
}
|
|
9833
|
+
.tta-history__search {
|
|
9834
|
+
border-radius: var(--border-radius-lg);
|
|
9835
|
+
padding: 0.85rem 0.6rem;
|
|
9836
|
+
background: rgba(99, 102, 241, 0.05);
|
|
9837
|
+
color: var(--text-primary-color);
|
|
9838
|
+
display: flex;
|
|
9839
|
+
align-items: center;
|
|
9840
|
+
gap: 0.4rem;
|
|
9841
|
+
}
|
|
9842
|
+
.tta-history__search input {
|
|
9843
|
+
flex: 1;
|
|
9844
|
+
border: none;
|
|
9845
|
+
background: transparent;
|
|
9846
|
+
font-size: 0.9rem;
|
|
9847
|
+
color: inherit;
|
|
9848
|
+
outline: none;
|
|
9849
|
+
}
|
|
9850
|
+
.tta-history__search input:focus,
|
|
9851
|
+
.tta-history__search input:focus-visible,
|
|
9852
|
+
.tta-history__search input:active {
|
|
9853
|
+
outline: none !important;
|
|
9854
|
+
border: none !important;
|
|
9855
|
+
box-shadow: none !important;
|
|
9856
|
+
}
|
|
9857
|
+
.tta-history__search-icon {
|
|
9858
|
+
font-size: 0.9rem;
|
|
9859
|
+
width: 0.875rem;
|
|
9860
|
+
height: 0.875rem;
|
|
9861
|
+
opacity: 0.7;
|
|
9862
|
+
}
|
|
9863
|
+
.tta-history__empty {
|
|
9864
|
+
color: var(--fg-muted);
|
|
9865
|
+
}
|
|
9866
|
+
.tta-history__list {
|
|
9867
|
+
flex: 1;
|
|
9868
|
+
overflow-y: auto;
|
|
9869
|
+
display: flex;
|
|
9870
|
+
flex-direction: column;
|
|
9871
|
+
gap: 0.5rem;
|
|
9872
|
+
margin-right: -0.75rem;
|
|
9873
|
+
padding-right: 0.75rem;
|
|
9874
|
+
}
|
|
9875
|
+
.tta-history__item {
|
|
9876
|
+
padding: 0.75rem;
|
|
9877
|
+
border-radius: var(--border-radius-lg);
|
|
9878
|
+
border: 1px solid var(--sidebar-border-color);
|
|
9879
|
+
background-color: transparent;
|
|
9880
|
+
color: var(--text-primary-color);
|
|
9881
|
+
display: flex;
|
|
9882
|
+
flex-direction: column;
|
|
9883
|
+
gap: 0.75rem;
|
|
9884
|
+
height: auto;
|
|
9885
|
+
position: relative;
|
|
9886
|
+
}
|
|
9887
|
+
.excalidraw.theme--light .tta-history__item {
|
|
9888
|
+
border-color: rgba(0, 0, 0, 0.06);
|
|
9889
|
+
}
|
|
9890
|
+
.tta-history__item:hover {
|
|
9891
|
+
background-color: rgba(99, 102, 241, 0.05);
|
|
9892
|
+
cursor: pointer;
|
|
9893
|
+
}
|
|
9894
|
+
.tta-history__item:hover .tta-history__actions {
|
|
9895
|
+
display: flex;
|
|
9896
|
+
}
|
|
9897
|
+
.tta-history__details {
|
|
9898
|
+
display: flex;
|
|
9899
|
+
flex-direction: column;
|
|
9900
|
+
width: 100%;
|
|
9901
|
+
}
|
|
9902
|
+
.tta-history__header-row {
|
|
9903
|
+
display: flex;
|
|
9904
|
+
align-items: center;
|
|
9905
|
+
justify-content: space-between;
|
|
9906
|
+
gap: 0.5rem;
|
|
9907
|
+
height: 2.25rem;
|
|
9908
|
+
}
|
|
9909
|
+
.tta-history__actions {
|
|
9910
|
+
display: none;
|
|
9911
|
+
align-items: center;
|
|
9912
|
+
gap: 0.35rem;
|
|
9913
|
+
}
|
|
9914
|
+
.tta-history__action-button--delete:hover {
|
|
9915
|
+
color: var(--color-danger);
|
|
9916
|
+
}
|
|
9917
|
+
.tta-history__edit-actions {
|
|
9918
|
+
display: flex;
|
|
9919
|
+
align-items: center;
|
|
9920
|
+
gap: 0.35rem;
|
|
9921
|
+
}
|
|
9922
|
+
.tta-history__edit-actions .tta-panel__icon-button--cancel:hover {
|
|
9923
|
+
color: var(--color-danger);
|
|
9924
|
+
}
|
|
9925
|
+
.tta-history__item-title-edit {
|
|
9926
|
+
display: flex;
|
|
9927
|
+
align-items: center;
|
|
9928
|
+
gap: 0.5rem;
|
|
9929
|
+
width: 100%;
|
|
9930
|
+
height: 100%;
|
|
9931
|
+
}
|
|
9932
|
+
.tta-history__rename-input {
|
|
9933
|
+
flex: 1;
|
|
9934
|
+
font-size: 0.95rem;
|
|
9935
|
+
padding: 0 0.25rem !important;
|
|
9936
|
+
height: 1.75rem;
|
|
9937
|
+
background: transparent !important;
|
|
9938
|
+
color: var(--text-primary-color);
|
|
9939
|
+
min-width: 0;
|
|
9940
|
+
}
|
|
9941
|
+
.tta-history__rename-input:focus,
|
|
9942
|
+
.tta-history__rename-input:focus-visible,
|
|
9943
|
+
.tta-history__rename-input:active {
|
|
9944
|
+
background: transparent !important;
|
|
9945
|
+
border-width: 1px;
|
|
9946
|
+
box-shadow: none !important;
|
|
9947
|
+
}
|
|
9948
|
+
.tta-history__item-title {
|
|
9949
|
+
flex: 1;
|
|
9950
|
+
white-space: nowrap;
|
|
9951
|
+
overflow: hidden;
|
|
9952
|
+
text-overflow: ellipsis;
|
|
9953
|
+
}
|
|
9954
|
+
.tta-history__thumb {
|
|
9955
|
+
width: 100%;
|
|
9956
|
+
height: 12rem;
|
|
9957
|
+
overflow: hidden;
|
|
9958
|
+
display: flex;
|
|
9959
|
+
align-items: center;
|
|
9960
|
+
justify-content: center;
|
|
9961
|
+
border-bottom: solid 1px var(--sidebar-border-color);
|
|
9962
|
+
padding-bottom: 0.75rem;
|
|
9963
|
+
}
|
|
9964
|
+
.tta-history__thumb img {
|
|
9965
|
+
width: 100%;
|
|
9966
|
+
height: 100%;
|
|
9967
|
+
object-fit: contain;
|
|
9968
|
+
padding: 0.5rem;
|
|
9969
|
+
}
|
|
9970
|
+
|
|
9971
|
+
/* TTA/TTAWarningMessage.scss */
|
|
9972
|
+
.tta-warning-message {
|
|
9973
|
+
width: min(100%, 21rem);
|
|
9974
|
+
margin: 0.5rem auto 0.75rem;
|
|
9975
|
+
padding: 0.625rem 1rem;
|
|
9976
|
+
border: 1px solid var(--color-warning-dark);
|
|
9977
|
+
border-radius: 8px;
|
|
9978
|
+
background: var(--color-warning);
|
|
9979
|
+
color: var(--color-warning-color);
|
|
9980
|
+
font-size: 0.8125rem;
|
|
9981
|
+
line-height: 1.35;
|
|
9982
|
+
}
|
|
9983
|
+
|
|
9984
|
+
/* TTA/TTAComposer.scss */
|
|
9985
|
+
.tta-composer {
|
|
9986
|
+
max-width: 48rem;
|
|
9987
|
+
margin: 0 auto;
|
|
9988
|
+
border-top: 1px solid var(--sidebar-border-color);
|
|
9989
|
+
padding-top: 1rem;
|
|
9990
|
+
}
|
|
9991
|
+
.tta-composer__container {
|
|
9992
|
+
--tta-composer-shadow: 0px 18px 35px rgba(15, 23, 42, 0.12);
|
|
9993
|
+
position: relative;
|
|
9994
|
+
display: flex;
|
|
9995
|
+
flex-direction: column;
|
|
9996
|
+
background: var(--island-bg-color);
|
|
9997
|
+
border-radius: 12px;
|
|
9998
|
+
transition: border-color 0.3s ease, box-shadow 0.3s ease;
|
|
9999
|
+
}
|
|
10000
|
+
.tta-composer__container:hover {
|
|
10001
|
+
border-color: var(--color-primary-light-darker);
|
|
10002
|
+
}
|
|
10003
|
+
.tta-composer__container:focus-within {
|
|
10004
|
+
border-color: #6965db;
|
|
10005
|
+
}
|
|
10006
|
+
.tta-composer__textarea-wrapper {
|
|
10007
|
+
position: relative;
|
|
10008
|
+
padding: 0 0 0.5rem;
|
|
10009
|
+
display: flex;
|
|
10010
|
+
}
|
|
10011
|
+
.tta-composer__textarea {
|
|
10012
|
+
flex: 1;
|
|
10013
|
+
resize: none;
|
|
10014
|
+
border: none !important;
|
|
10015
|
+
background: var(--island-bg-color) !important;
|
|
10016
|
+
color: var(--text-primary-color);
|
|
10017
|
+
font-family: inherit;
|
|
10018
|
+
font-size: 1rem;
|
|
10019
|
+
line-height: 1.5;
|
|
10020
|
+
padding: 0 !important;
|
|
10021
|
+
max-height: 240px;
|
|
10022
|
+
overflow-y: auto;
|
|
10023
|
+
white-space: pre-wrap !important;
|
|
10024
|
+
word-break: break-word !important;
|
|
10025
|
+
overflow-wrap: anywhere;
|
|
10026
|
+
scrollbar-width: none;
|
|
10027
|
+
scrollbar-color: transparent transparent;
|
|
10028
|
+
}
|
|
10029
|
+
.tta-composer__textarea::-webkit-scrollbar {
|
|
10030
|
+
width: 0;
|
|
10031
|
+
height: 0;
|
|
10032
|
+
}
|
|
10033
|
+
.tta-composer__textarea::placeholder {
|
|
10034
|
+
color: var(--color-muted-darker);
|
|
10035
|
+
}
|
|
10036
|
+
.tta-composer__textarea:focus {
|
|
10037
|
+
outline: none;
|
|
10038
|
+
}
|
|
10039
|
+
.tta-composer__textarea:is(:hover, :focus-visible, :active) {
|
|
10040
|
+
scrollbar-width: thin;
|
|
10041
|
+
scrollbar-color: rgba(105, 101, 219, 0.18) transparent;
|
|
10042
|
+
}
|
|
10043
|
+
.tta-composer__textarea:is(:hover, :focus-visible, :active)::-webkit-scrollbar {
|
|
10044
|
+
width: 0.35rem;
|
|
10045
|
+
height: 0.35rem;
|
|
10046
|
+
}
|
|
10047
|
+
.tta-composer__textarea:is(:hover, :focus-visible, :active)::-webkit-scrollbar-thumb {
|
|
10048
|
+
background-color: var(--island-bg-color);
|
|
10049
|
+
border-radius: 999px;
|
|
10050
|
+
}
|
|
10051
|
+
.tta-composer__toolbar {
|
|
10052
|
+
display: flex;
|
|
10053
|
+
align-items: center;
|
|
10054
|
+
justify-content: space-between;
|
|
10055
|
+
padding: 0 0 0.75rem;
|
|
10056
|
+
}
|
|
10057
|
+
.tta-composer__toolbar-section {
|
|
10058
|
+
display: flex;
|
|
10059
|
+
align-items: center;
|
|
10060
|
+
gap: 0.75rem;
|
|
10061
|
+
flex: 1;
|
|
10062
|
+
}
|
|
10063
|
+
.tta-composer__toolbar-section:last-child {
|
|
10064
|
+
justify-content: flex-end;
|
|
10065
|
+
}
|
|
10066
|
+
.tta-composer__icon-button {
|
|
10067
|
+
border: none;
|
|
10068
|
+
background: transparent;
|
|
10069
|
+
padding: 0.5rem;
|
|
10070
|
+
border-radius: 8px;
|
|
10071
|
+
color: var(--color-muted-darker);
|
|
10072
|
+
display: inline-flex;
|
|
10073
|
+
align-items: center;
|
|
10074
|
+
justify-content: center;
|
|
10075
|
+
cursor: pointer;
|
|
10076
|
+
transition:
|
|
10077
|
+
color 0.2s ease,
|
|
10078
|
+
background 0.2s ease,
|
|
10079
|
+
box-shadow 0.2s ease;
|
|
10080
|
+
}
|
|
10081
|
+
.tta-composer__icon-button:hover {
|
|
10082
|
+
color: var(--color-primary);
|
|
10083
|
+
background: var(--color-primary-light);
|
|
10084
|
+
}
|
|
10085
|
+
.tta-composer__icon-button:focus-visible {
|
|
10086
|
+
outline: none;
|
|
10087
|
+
box-shadow: 0 0 0 2px var(--color-primary-light-darker);
|
|
10088
|
+
}
|
|
10089
|
+
.tta-composer__image-icon {
|
|
10090
|
+
width: 1.25rem;
|
|
10091
|
+
height: 1.25rem;
|
|
10092
|
+
display: inline-flex;
|
|
10093
|
+
align-items: center;
|
|
10094
|
+
justify-content: center;
|
|
10095
|
+
transform: translateX(-1px);
|
|
10096
|
+
}
|
|
10097
|
+
.tta-composer__plus-icon {
|
|
10098
|
+
width: 1.25rem;
|
|
10099
|
+
height: 1.25rem;
|
|
10100
|
+
}
|
|
10101
|
+
.tta-composer__audio-btn {
|
|
10102
|
+
display: none;
|
|
10103
|
+
}
|
|
10104
|
+
.tta-composer__audio-btn svg {
|
|
10105
|
+
width: 1rem;
|
|
10106
|
+
height: 1rem;
|
|
10107
|
+
}
|
|
10108
|
+
.tta-composer__char-count {
|
|
10109
|
+
display: none;
|
|
10110
|
+
font-size: 0.75rem;
|
|
10111
|
+
color: var(--color-muted);
|
|
10112
|
+
font-weight: 500;
|
|
10113
|
+
}
|
|
10114
|
+
@media (min-width: 640px) {
|
|
10115
|
+
.tta-composer__char-count {
|
|
10116
|
+
display: inline-block;
|
|
10117
|
+
}
|
|
10118
|
+
}
|
|
10119
|
+
.tta-composer__send-btn {
|
|
10120
|
+
border: none;
|
|
10121
|
+
display: inline-flex;
|
|
10122
|
+
align-items: center;
|
|
10123
|
+
justify-content: center;
|
|
10124
|
+
width: 2.25rem;
|
|
10125
|
+
height: 2.25rem;
|
|
10126
|
+
border-radius: 8px;
|
|
10127
|
+
background-color: var(--sidebar-border-color);
|
|
10128
|
+
color: var(--color-muted-darker, #999);
|
|
10129
|
+
transition:
|
|
10130
|
+
transform 0.2s ease,
|
|
10131
|
+
background 0.2s ease,
|
|
10132
|
+
color 0.2s ease,
|
|
10133
|
+
box-shadow 0.2s ease;
|
|
10134
|
+
}
|
|
10135
|
+
.tta-composer__send-btn:disabled {
|
|
10136
|
+
cursor: not-allowed;
|
|
10137
|
+
color: var(--color-muted-darker, #999);
|
|
10138
|
+
}
|
|
10139
|
+
.tta-composer__send-btn:disabled .tta-composer__send-icon {
|
|
10140
|
+
color: var(--color-muted-darker, #999);
|
|
10141
|
+
}
|
|
10142
|
+
.tta-composer__send-btn--active {
|
|
10143
|
+
background-color: var(--color-primary);
|
|
10144
|
+
color: var(--color-icon-white);
|
|
10145
|
+
cursor: pointer;
|
|
10146
|
+
}
|
|
10147
|
+
.tta-composer__send-btn--active:hover {
|
|
10148
|
+
transform: scale(1.05) translateY(-1px);
|
|
10149
|
+
background-color: var(--color-primary-darker);
|
|
10150
|
+
}
|
|
10151
|
+
.tta-composer__send-btn--active:active {
|
|
10152
|
+
transform: scale(0.95);
|
|
10153
|
+
}
|
|
10154
|
+
.tta-composer__send-icon {
|
|
10155
|
+
width: 1.1rem;
|
|
10156
|
+
height: 1.1rem;
|
|
10157
|
+
transition: margin-left 0.2s ease;
|
|
10158
|
+
}
|
|
10159
|
+
.tta-composer__send-icon--active {
|
|
10160
|
+
}
|
|
10161
|
+
.tta-composer__stop-btn {
|
|
10162
|
+
border: none;
|
|
10163
|
+
display: inline-flex;
|
|
10164
|
+
align-items: center;
|
|
10165
|
+
justify-content: center;
|
|
10166
|
+
width: 2.25rem;
|
|
10167
|
+
height: 2.25rem;
|
|
10168
|
+
border-radius: 8px;
|
|
10169
|
+
background-color: var(--text-primary-color);
|
|
10170
|
+
color: var(--color-icon-white);
|
|
10171
|
+
cursor: pointer;
|
|
10172
|
+
transition: transform 0.2s ease, background 0.2s ease;
|
|
10173
|
+
}
|
|
10174
|
+
.tta-composer__stop-btn:hover {
|
|
10175
|
+
transform: scale(1.05);
|
|
10176
|
+
opacity: 0.9;
|
|
10177
|
+
}
|
|
10178
|
+
.tta-composer__stop-btn:active {
|
|
10179
|
+
transform: scale(0.95);
|
|
10180
|
+
}
|
|
10181
|
+
.tta-composer__stop-icon {
|
|
10182
|
+
width: 1rem;
|
|
10183
|
+
height: 1rem;
|
|
10184
|
+
}
|
|
10185
|
+
.tta-composer__container:focus-within .tta-composer__focus-glow {
|
|
10186
|
+
opacity: 1;
|
|
10187
|
+
}
|
|
10188
|
+
.tta-composer__disclaimer {
|
|
10189
|
+
margin-top: 0.75rem;
|
|
10190
|
+
text-align: center;
|
|
10191
|
+
font-size: 0.75rem;
|
|
10192
|
+
color: var(--color-muted-darker);
|
|
10193
|
+
}
|
|
10194
|
+
.tta-composer__preview {
|
|
10195
|
+
padding: 0.5rem 1rem;
|
|
10196
|
+
display: flex;
|
|
10197
|
+
gap: 0.5rem;
|
|
10198
|
+
overflow-x: auto;
|
|
10199
|
+
scrollbar-width: none;
|
|
10200
|
+
}
|
|
10201
|
+
.tta-composer__preview-image-container {
|
|
10202
|
+
position: relative;
|
|
10203
|
+
width: 60px;
|
|
10204
|
+
height: 60px;
|
|
10205
|
+
border-radius: 8px;
|
|
10206
|
+
overflow: hidden;
|
|
10207
|
+
border: 1px solid var(--sidebar-border-color);
|
|
10208
|
+
background: var(--default-bg-color);
|
|
10209
|
+
flex-shrink: 0;
|
|
10210
|
+
}
|
|
10211
|
+
.tta-composer__preview-image-container:hover .tta-composer__preview-close {
|
|
10212
|
+
opacity: 1;
|
|
10213
|
+
}
|
|
10214
|
+
.tta-composer__preview-image-container:focus-visible {
|
|
10215
|
+
outline: 2px solid var(--color-primary);
|
|
10216
|
+
outline-offset: 2px;
|
|
10217
|
+
}
|
|
10218
|
+
.tta-composer__preview-image {
|
|
10219
|
+
width: 100%;
|
|
10220
|
+
height: 100%;
|
|
10221
|
+
object-fit: cover;
|
|
10222
|
+
}
|
|
10223
|
+
.tta-composer__preview-close {
|
|
10224
|
+
position: absolute;
|
|
10225
|
+
top: 2px;
|
|
10226
|
+
right: 2px;
|
|
10227
|
+
width: 16px;
|
|
10228
|
+
height: 16px;
|
|
10229
|
+
border-radius: 50%;
|
|
10230
|
+
background: rgba(0, 0, 0, 0.6);
|
|
10231
|
+
color: #fff;
|
|
10232
|
+
border: none;
|
|
10233
|
+
cursor: pointer;
|
|
10234
|
+
display: flex;
|
|
10235
|
+
align-items: center;
|
|
10236
|
+
justify-content: center;
|
|
10237
|
+
padding: 2px;
|
|
10238
|
+
opacity: 0;
|
|
10239
|
+
transition: opacity 0.2s ease, background 0.2s ease;
|
|
10240
|
+
}
|
|
10241
|
+
.tta-composer__preview-close:hover {
|
|
10242
|
+
background: rgba(0, 0, 0, 0.8);
|
|
10243
|
+
}
|
|
10244
|
+
.tta-composer__preview-close svg {
|
|
10245
|
+
width: 100%;
|
|
10246
|
+
height: 100%;
|
|
10247
|
+
}
|
|
7977
10248
|
/*# sourceMappingURL=index.css.map */
|