tetrons 2.3.98 → 2.3.100

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.
Files changed (114) hide show
  1. package/dist/app/HomeClient.d.ts +1 -0
  2. package/dist/app/layout.d.ts +7 -0
  3. package/dist/app/page.d.ts +1 -0
  4. package/dist/app/view/page.d.ts +1 -0
  5. package/dist/chunk-EO6RXFIC.mjs +79 -0
  6. package/dist/components/Editor/AIModal.d.ts +8 -0
  7. package/dist/components/Editor/Editor.d.ts +3 -0
  8. package/dist/components/Editor/LinkPreviewPopup.d.ts +14 -0
  9. package/dist/components/Editor/TetronsEditor.d.ts +8 -0
  10. package/dist/components/Editor/config/versionConfig.d.ts +3 -0
  11. package/dist/components/Editor/toolbar/BasicToolbar.d.ts +12 -0
  12. package/dist/components/Editor/toolbar/CodeEditor.d.ts +13 -0
  13. package/dist/components/Editor/toolbar/Converter.d.ts +3 -0
  14. package/dist/components/Editor/toolbar/FaqSection.d.ts +2 -0
  15. package/dist/components/Editor/toolbar/FindReplaceModal.d.ts +9 -0
  16. package/dist/components/Editor/toolbar/HelpModal.d.ts +8 -0
  17. package/dist/components/Editor/toolbar/ImageToTextModal.d.ts +7 -0
  18. package/dist/components/Editor/toolbar/MathEquation.d.ts +10 -0
  19. package/dist/components/Editor/toolbar/SecondRow.d.ts +18 -0
  20. package/dist/components/Editor/toolbar/ShareEmailModal.d.ts +5 -0
  21. package/dist/components/Editor/toolbar/ShareLinkModal.d.ts +7 -0
  22. package/dist/components/Editor/toolbar/Tabs.d.ts +6 -0
  23. package/dist/components/Editor/toolbar/ThirdRow.d.ts +9 -0
  24. package/dist/components/Editor/toolbar/TopMenu.d.ts +24 -0
  25. package/dist/components/Editor/toolbar/Translator.d.ts +3 -0
  26. package/dist/components/Editor/toolbar/UserGuideSection.d.ts +2 -0
  27. package/dist/components/Editor/toolbar/VersionDiffModal.d.ts +6 -0
  28. package/dist/components/Editor/toolbar/VersionHistoryModal.d.ts +12 -0
  29. package/dist/components/Editor/toolbar/VersionInfoSection.d.ts +2 -0
  30. package/dist/components/Editor/toolbar/VersionRollbackModal.d.ts +6 -0
  31. package/dist/components/Editor/toolbar/VirtualKeyboard.d.ts +11 -0
  32. package/dist/components/Editor/toolbar/VoiceModal.d.ts +7 -0
  33. package/dist/components/Editor/toolbar/extensions/Audio.d.ts +2 -0
  34. package/dist/components/Editor/toolbar/extensions/BetterListItem.d.ts +1 -0
  35. package/dist/components/Editor/toolbar/extensions/Comment.d.ts +17 -0
  36. package/dist/components/Editor/toolbar/extensions/Embed.d.ts +7 -0
  37. package/dist/components/Editor/toolbar/extensions/FontFamily.d.ts +10 -0
  38. package/dist/components/Editor/toolbar/extensions/FontSize.d.ts +10 -0
  39. package/dist/components/Editor/toolbar/extensions/FontStyleCommands.d.ts +2 -0
  40. package/dist/components/Editor/toolbar/extensions/LineHeightExtension.d.ts +2 -0
  41. package/dist/components/Editor/toolbar/extensions/MathBlock.d.ts +12 -0
  42. package/dist/components/Editor/toolbar/extensions/MathBlockView.d.ts +3 -0
  43. package/dist/components/Editor/toolbar/extensions/MathNode.d.ts +10 -0
  44. package/dist/components/Editor/toolbar/extensions/ResizableEmbed.d.ts +9 -0
  45. package/dist/components/Editor/toolbar/extensions/ResizableImage.d.ts +2 -0
  46. package/dist/components/Editor/toolbar/extensions/ResizableVideo.d.ts +2 -0
  47. package/dist/components/Editor/toolbar/extensions/WordCount.d.ts +2 -0
  48. package/dist/components/Editor/toolbar/groups/AlignGroup.d.ts +8 -0
  49. package/dist/components/Editor/toolbar/groups/ClipboardGroup.d.ts +8 -0
  50. package/dist/components/Editor/toolbar/groups/ColorGroup.d.ts +8 -0
  51. package/dist/components/Editor/toolbar/groups/FileGroup.d.ts +12 -0
  52. package/dist/components/Editor/toolbar/groups/InsertGroup.d.ts +6 -0
  53. package/dist/components/Editor/toolbar/groups/ListGroup.d.ts +8 -0
  54. package/dist/components/Editor/toolbar/groups/PlatinumGroup.d.ts +19 -0
  55. package/dist/components/Editor/toolbar/groups/PreviewModal.d.ts +8 -0
  56. package/dist/components/Editor/toolbar/groups/TextFormattingGroup.d.ts +8 -0
  57. package/dist/components/Editor/toolbar/groups/UtilityGroup.d.ts +10 -0
  58. package/dist/components/Editor/toolbar/useFileActions.d.ts +6 -0
  59. package/dist/components/Editor/toolbar/useUtilityActions.d.ts +8 -0
  60. package/dist/components/Editor/types/TetronsEditorProps.d.ts +100 -0
  61. package/dist/components/Editor/types/ValidationResponse.d.ts +10 -0
  62. package/dist/components/ui/Button.d.ts +12 -0
  63. package/dist/components/ui/ConfirmModal.d.ts +10 -0
  64. package/dist/components/ui/Dropdown.d.ts +14 -0
  65. package/dist/index.css +4888 -0
  66. package/dist/index.d.ts +6 -16
  67. package/dist/index.mjs +14802 -14936
  68. package/dist/lib/indianKeyboardLayouts.d.ts +1 -0
  69. package/dist/lib/languages.d.ts +1 -0
  70. package/dist/server/dictionary.d.ts +1 -0
  71. package/dist/tiptap/extensions/SpellCheck.d.ts +2 -0
  72. package/dist/types/VersionEntry.d.ts +6 -0
  73. package/dist/typescript-A2I22B6E.mjs +210768 -0
  74. package/package.json +88 -109
  75. package/dist/app/api/ai-action/route.cjs +0 -61
  76. package/dist/app/api/ai-action/route.d.mts +0 -9
  77. package/dist/app/api/ai-action/route.d.ts +0 -9
  78. package/dist/app/api/ai-action/route.mjs +0 -36
  79. package/dist/app/api/execute/route.cjs +0 -55
  80. package/dist/app/api/execute/route.d.mts +0 -8
  81. package/dist/app/api/execute/route.d.ts +0 -8
  82. package/dist/app/api/execute/route.mjs +0 -30
  83. package/dist/app/api/export/route.cjs +0 -33
  84. package/dist/app/api/export/route.d.mts +0 -3
  85. package/dist/app/api/export/route.d.ts +0 -3
  86. package/dist/app/api/export/route.mjs +0 -8
  87. package/dist/app/api/register/route.cjs +0 -120
  88. package/dist/app/api/register/route.d.mts +0 -10
  89. package/dist/app/api/register/route.d.ts +0 -10
  90. package/dist/app/api/register/route.mjs +0 -85
  91. package/dist/app/api/save/route.cjs +0 -53
  92. package/dist/app/api/save/route.d.mts +0 -9
  93. package/dist/app/api/save/route.d.ts +0 -9
  94. package/dist/app/api/save/route.mjs +0 -18
  95. package/dist/app/api/transcribe/route.cjs +0 -72
  96. package/dist/app/api/transcribe/route.d.mts +0 -10
  97. package/dist/app/api/transcribe/route.d.ts +0 -10
  98. package/dist/app/api/transcribe/route.mjs +0 -46
  99. package/dist/app/api/validate/route.cjs +0 -143
  100. package/dist/app/api/validate/route.d.mts +0 -13
  101. package/dist/app/api/validate/route.d.ts +0 -13
  102. package/dist/app/api/validate/route.mjs +0 -107
  103. package/dist/components/UI/Dropdown.tsx +0 -0
  104. package/dist/components/tetrons/EditorContent.tsx +0 -272
  105. package/dist/components/tetrons/ResizableImageComponent.tsx +0 -112
  106. package/dist/components/tetrons/ResizableVideoComponent.tsx +0 -56
  107. package/dist/dictionaries/index.aff +0 -205
  108. package/dist/dictionaries/index.dic +0 -49569
  109. package/dist/index.cjs +0 -17652
  110. package/dist/index.d.mts +0 -16
  111. package/dist/styles/tetrons.css +0 -981
  112. package/public/dictionaries/index.aff +0 -205
  113. package/public/dictionaries/index.dic +0 -49569
  114. /package/dist/components/{UI/Button.tsx → Editor/config/featureConfig.d.ts} +0 -0
@@ -1,981 +0,0 @@
1
- .editor-container {
2
- display: flex;
3
- flex-direction: column;
4
- height: 100%;
5
- }
6
-
7
- .editor-toolbar {
8
- padding: 0.5rem;
9
- border-bottom: 1px solid #d1d5db;
10
- background-color: #f9fafb;
11
- display: flex;
12
- flex-wrap: wrap;
13
- align-items: center;
14
- gap: 0.75rem;
15
- }
16
-
17
- .editor-save-btn {
18
- padding: 0.25rem 0.75rem;
19
- background-color: #2563eb;
20
- color: white;
21
- border-radius: 0.375rem;
22
- transition: background-color 0.2s;
23
- }
24
-
25
- .editor-save-btn:hover {
26
- background-color: #1d4ed8;
27
- }
28
-
29
- .editor-save-btn:disabled {
30
- opacity: 0.5;
31
- cursor: not-allowed;
32
- }
33
-
34
- .editor-version-btn {
35
- padding: 0.25rem 0.5rem;
36
- border: 1px solid #d1d5db;
37
- color: #374151;
38
- border-radius: 0.375rem;
39
- font-size: 0.875rem;
40
- white-space: nowrap;
41
- transition: all 0.2s;
42
- background: none;
43
- }
44
-
45
- .editor-version-btn:hover {
46
- border-color: #4b5563;
47
- }
48
-
49
- .editor-version-btn.active {
50
- border-color: #2563eb;
51
- color: #2563eb;
52
- font-weight: 600;
53
- }
54
-
55
- .editor-content-wrapper {
56
- flex-grow: 1;
57
- padding: 1.5rem;
58
- background-color: white;
59
- border: 1px solid #d1d5db;
60
- border-radius: 0.5rem;
61
- box-shadow: 0 1px 2px rgba(0, 0, 0, 0.05);
62
- overflow: auto;
63
- position: relative;
64
- min-height: 0;
65
- }
66
-
67
- .editor-loading {
68
- color: #6b7280;
69
- font-size: 0.875rem;
70
- text-align: center;
71
- padding: 1rem;
72
- }
73
-
74
- .editor-content-wrapper .ProseMirror {
75
- outline: none;
76
- min-height: 300px;
77
- font-size: 1rem;
78
- line-height: 1.75;
79
- }
80
-
81
- .editor-content-wrapper .ProseMirror[data-placeholder]:empty::before {
82
- content: attr(data-placeholder);
83
- color: #9ca3af;
84
- float: left;
85
- height: 0;
86
- pointer-events: none;
87
- }
88
-
89
- .ProseMirror pre {
90
- background: #f3f4f6;
91
- padding: 1rem;
92
- border-radius: 0.375rem;
93
- font-family: monospace;
94
- font-size: 0.875rem;
95
- overflow-x: auto;
96
- }
97
-
98
- .editor-versions-wrapper {
99
- display: flex;
100
- align-items: center;
101
- gap: 0.5rem;
102
- overflow-x: auto;
103
- max-width: 100%;
104
- }
105
-
106
- .editor-no-versions {
107
- color: #6b7280;
108
- font-size: 0.875rem;
109
- }
110
-
111
- ul,
112
- ol {
113
- padding-left: 1.5rem;
114
- margin: 0.5rem 0;
115
- list-style-position: outside;
116
- }
117
-
118
- li {
119
- margin: 0.25rem 0;
120
- line-height: 1.5;
121
- }
122
-
123
- .editor-content-wrapper ul,
124
- .editor-content-wrapper ol {
125
- list-style: revert;
126
- }
127
-
128
- .tetrons-toolbar {
129
- display: flex;
130
- flex-wrap: wrap;
131
- align-items: center;
132
- gap: 1rem;
133
- padding: 0.75rem;
134
- border-bottom: 1px solid #e5e7eb;
135
- background-color: white;
136
- box-shadow: 0 1px 2px rgba(0, 0, 0, 0.05);
137
- position: relative;
138
- z-index: 10;
139
- }
140
-
141
- .tetrons-toolbar .group {
142
- display: flex;
143
- align-items: center;
144
- gap: 0.5rem;
145
- border-right: 1px solid #e5e7eb;
146
- padding-right: 0.75rem;
147
- }
148
-
149
- .tetrons-toolbar input[type="checkbox"] {
150
- width: 1rem;
151
- height: 1rem;
152
- }
153
-
154
- .tetrons-toolbar label {
155
- font-size: 0.875rem;
156
- -webkit-user-select: none;
157
- user-select: none;
158
- }
159
-
160
- .misc-group {
161
- display: flex;
162
- gap: 0.25rem;
163
- align-items: center;
164
- border-right: 1px solid #e5e7eb;
165
- padding-right: 0.75rem;
166
- }
167
-
168
- .list-align-group {
169
- display: flex;
170
- gap: 0.25rem;
171
- border-right: 1px solid #e5e7eb;
172
- padding-right: 0.75rem;
173
- align-items: center;
174
- }
175
-
176
- .insert-group {
177
- display: flex;
178
- gap: 0.25rem;
179
- border-right: 1px solid #e5e7eb;
180
- padding-right: 0.75rem;
181
- position: relative;
182
- align-items: center;
183
- }
184
-
185
- .table-grid-popup {
186
- position: absolute;
187
- top: 2.5rem;
188
- left: 0;
189
- background-color: white;
190
- border: 1px solid #d1d5db;
191
- border-radius: 0.25rem;
192
- box-shadow: 0 2px 6px rgba(0, 0, 0, 0.1);
193
- padding: 0.5rem;
194
- z-index: 20;
195
- }
196
-
197
- .table-grid {
198
- display: grid;
199
- grid-template-columns: repeat(10, 1fr);
200
- gap: 1px;
201
- }
202
-
203
- .table-grid-cell {
204
- width: 1.25rem;
205
- height: 1.25rem;
206
- border: 1px solid #d1d5db;
207
- background-color: #f3f4f6;
208
- cursor: pointer;
209
- }
210
-
211
- .table-grid-cell.selected {
212
- background-color: #3b82f6;
213
- }
214
-
215
- .table-grid-label {
216
- margin-top: 0.5rem;
217
- font-size: 0.75rem;
218
- text-align: center;
219
- color: #6b7280;
220
- }
221
-
222
- .hidden-input {
223
- display: none;
224
- }
225
-
226
- .emoji-picker {
227
- position: absolute;
228
- top: 2.5rem;
229
- left: 0;
230
- z-index: 50;
231
- }
232
-
233
- .font-style-group {
234
- display: flex;
235
- gap: 0.25rem;
236
- border-right: 1px solid #e5e7eb;
237
- padding-right: 0.75rem;
238
- align-items: center;
239
- }
240
-
241
- .font-style-group select {
242
- font-size: 0.875rem;
243
- border: 1px solid #d1d5db;
244
- border-radius: 0.25rem;
245
- padding: 0.125rem 0.25rem;
246
- margin-right: 0.5rem;
247
- }
248
-
249
- .color-label {
250
- position: relative;
251
- width: 2rem;
252
- height: 2rem;
253
- display: flex;
254
- justify-content: center;
255
- align-items: center;
256
- cursor: pointer;
257
- }
258
-
259
- .color-indicator {
260
- content: "";
261
- position: absolute;
262
- bottom: 2px;
263
- left: 50%;
264
- transform: translateX(-50%);
265
- width: 12px;
266
- height: 4px;
267
- background-color: var(--indicator-color, #000000);
268
- border-radius: 2px;
269
- pointer-events: none;
270
- }
271
-
272
- .color-label input[type="color"] {
273
- position: absolute;
274
- inset: 0;
275
- opacity: 0;
276
- cursor: pointer;
277
- }
278
-
279
- .file-group {
280
- display: flex;
281
- align-items: center;
282
- gap: 0.25rem;
283
- border-right: 1px solid #e5e7eb;
284
- padding-right: 0.75rem;
285
- }
286
-
287
- .file-group input[type="file"] {
288
- display: none;
289
- }
290
-
291
- .clipboard-group {
292
- display: flex;
293
- gap: 0.25rem;
294
- border-right: 1px solid #e5e7eb;
295
- padding-right: 0.75rem;
296
- }
297
-
298
- .action-group {
299
- position: relative;
300
- display: flex;
301
- align-items: center;
302
- gap: 0.25rem;
303
- }
304
-
305
- .export-button {
306
- display: flex;
307
- align-items: center;
308
- gap: 0.25rem;
309
- padding: 0.25rem 0.5rem;
310
- border-radius: 0.25rem;
311
- background: transparent;
312
- cursor: pointer;
313
- }
314
-
315
- .export-button:hover {
316
- background-color: #f3f4f6;
317
- }
318
-
319
- .export-button:focus {
320
- outline: none;
321
- }
322
-
323
- .export-dropdown {
324
- position: absolute;
325
- z-index: 10;
326
- margin-top: 0.5rem;
327
- width: 10rem;
328
- background-color: #fff;
329
- border: 1px solid #e5e7eb;
330
- border-radius: 0.25rem;
331
- box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
332
- }
333
-
334
- .export-dropdown button {
335
- width: 100%;
336
- text-align: left;
337
- padding: 0.5rem 1rem;
338
- background: none;
339
- border: none;
340
- font-size: 0.875rem;
341
- cursor: pointer;
342
- }
343
-
344
- .export-dropdown button:hover {
345
- background-color: #f3f4f6;
346
- }
347
-
348
- .toolbar-button {
349
- padding: 0.5rem;
350
- border: none;
351
- background-color: transparent;
352
- border-radius: 0.375rem;
353
- cursor: pointer;
354
- display: flex;
355
- align-items: center;
356
- justify-content: center;
357
- transition: background-color 0.2s ease;
358
- }
359
-
360
- .toolbar-button:hover {
361
- background-color: #e5e7eb;
362
- }
363
-
364
- .toolbar-button.active {
365
- background-color: #d1d5db;
366
- }
367
-
368
- .toolbar-button:disabled {
369
- opacity: 0.5;
370
- cursor: not-allowed;
371
- }
372
-
373
- .tableWrapper {
374
- overflow-x: auto;
375
- margin: 1rem 0;
376
- }
377
-
378
- .tableWrapper table {
379
- width: 100%;
380
- border-collapse: collapse;
381
- }
382
-
383
- .tableWrapper th,
384
- .tableWrapper td {
385
- border: 1px solid #d1d5db;
386
- padding: 0.5rem;
387
- text-align: left;
388
- }
389
-
390
- .icon-btn {
391
- padding: 0.5rem;
392
- background: transparent;
393
- border: none;
394
- cursor: pointer;
395
- }
396
-
397
- .stop-btn {
398
- background-color: #dc2626;
399
- color: white;
400
- margin-right: 20px;
401
- }
402
-
403
- .stop-btn:hover {
404
- background-color: #b91c1c;
405
- }
406
-
407
- .voice-modal {
408
- position: fixed;
409
- inset: 0;
410
- background: rgba(0, 0, 0, 0.5);
411
- z-index: 9999;
412
- display: flex;
413
- align-items: center;
414
- justify-content: center;
415
- }
416
-
417
- .voice-modal-content {
418
- background: white;
419
- padding: 2rem;
420
- border-radius: 12px;
421
- text-align: center;
422
- box-shadow: 0 0 20px rgba(0, 0, 0, 0.2);
423
- }
424
-
425
- .ai-button {
426
- padding: 8px 16px;
427
- background: linear-gradient(to right, #7f00ff, #4f46e5);
428
- color: white;
429
- font-weight: bold;
430
- border: none;
431
- border-radius: 6px;
432
- box-shadow: 0 2px 6px rgba(0, 0, 0, 0.2);
433
- cursor: pointer;
434
- transition:
435
- background 0.3s ease,
436
- transform 0.2s ease;
437
- }
438
-
439
- .ai-button:hover {
440
- background: linear-gradient(to right, #6b00d6, #4338ca);
441
- transform: translateY(-1px);
442
- }
443
-
444
- .ai-button:active {
445
- transform: scale(0.97);
446
- }
447
-
448
- .prompt-container {
449
- margin-top: 0.5rem;
450
- display: flex;
451
- flex-direction: column;
452
- gap: 0.5rem;
453
- }
454
-
455
- .prompt-textarea {
456
- width: 100%;
457
- padding: 8px;
458
- font-size: 14px;
459
- border-radius: 4px;
460
- border: 1px solid #ccc;
461
- resize: vertical;
462
- }
463
-
464
- .prompt-actions {
465
- display: flex;
466
- gap: 0.5rem;
467
- }
468
-
469
- .prompt-submit-btn {
470
- padding: 6px 12px;
471
- background-color: #4f46e5;
472
- color: #fff;
473
- border-radius: 4px;
474
- border: none;
475
- cursor: pointer;
476
- transition: background-color 0.2s ease;
477
- }
478
-
479
- .prompt-submit-btn:disabled {
480
- cursor: not-allowed;
481
- opacity: 0.6;
482
- }
483
-
484
- .prompt-cancel-btn {
485
- padding: 6px 12px;
486
- background-color: #e5e7eb;
487
- color: #000;
488
- border-radius: 4px;
489
- border: none;
490
- cursor: pointer;
491
- }
492
-
493
- .ai-error-message {
494
- color: red;
495
- font-size: 13px;
496
- margin-top: 0.5rem;
497
- }
498
-
499
- .ai-modal-backdrop {
500
- position: fixed;
501
- inset: 0;
502
- z-index: 9999;
503
- display: flex;
504
- align-items: center;
505
- justify-content: center;
506
- background-color: rgba(0, 0, 0, 0.4);
507
- -webkit-backdrop-filter: blur(4px);
508
- backdrop-filter: blur(4px);
509
- }
510
-
511
- .ai-modal-content {
512
- background-color: #ffffff;
513
- border-radius: 16px;
514
- box-shadow: 0 10px 30px rgba(0, 0, 0, 0.15);
515
- padding: 1.5rem;
516
- width: 90%;
517
- max-width: 28rem;
518
- }
519
-
520
- .ai-modal-title {
521
- font-size: 1.125rem;
522
- font-weight: 600;
523
- margin-bottom: 0.5rem;
524
- }
525
-
526
- .ai-modal-textarea {
527
- width: 100%;
528
- border: 1px solid #ccc;
529
- border-radius: 0.5rem;
530
- padding: 0.5rem;
531
- font-size: 0.875rem;
532
- min-height: 100px;
533
- resize: none;
534
- }
535
-
536
- .ai-modal-preview {
537
- margin-top: 1rem;
538
- font-size: 1.2rem;
539
- }
540
-
541
- .ai-modal-preview-output {
542
- margin-top: 0.5rem;
543
- }
544
-
545
- .ai-modal-error {
546
- font-size: 0.875rem;
547
- color: red;
548
- margin-top: 0.5rem;
549
- }
550
-
551
- .ai-modal-actions {
552
- display: flex;
553
- justify-content: flex-end;
554
- gap: 0.5rem;
555
- margin-top: 1rem;
556
- }
557
-
558
- .ai-cancel-btn {
559
- font-size: 0.875rem;
560
- padding: 0.5rem 1rem;
561
- background-color: #e5e7eb;
562
- color: #000;
563
- border: none;
564
- border-radius: 0.375rem;
565
- cursor: pointer;
566
- transition: background-color 0.2s ease;
567
- }
568
-
569
- .ai-cancel-btn:hover {
570
- background-color: #d1d5db;
571
- }
572
-
573
- .ai-submit-btn {
574
- font-size: 0.875rem;
575
- padding: 0.5rem 1rem;
576
- background-color: #2563eb;
577
- color: white;
578
- border: none;
579
- border-radius: 0.375rem;
580
- cursor: pointer;
581
- transition: background-color 0.2s ease;
582
- }
583
-
584
- .ai-submit-btn:hover {
585
- background-color: #1d4ed8;
586
- }
587
-
588
- .ai-submit-btn:disabled {
589
- opacity: 0.5;
590
- cursor: not-allowed;
591
- }
592
-
593
- .code-modal-overlay {
594
- position: fixed;
595
- top: 0;
596
- left: 0;
597
- width: 100%;
598
- height: 100%;
599
- background: rgba(0, 0, 0, 0.6);
600
- display: flex;
601
- justify-content: center;
602
- align-items: center;
603
- z-index: 9999;
604
- }
605
-
606
- .code-modal-content {
607
- background: white;
608
- width: 90%;
609
- max-width: 800px;
610
- border-radius: 8px;
611
- padding: 20px;
612
- box-shadow: 0 0 10px #00000033;
613
- display: flex;
614
- flex-direction: column;
615
- }
616
-
617
- .code-modal-header {
618
- display: flex;
619
- justify-content: space-between;
620
- align-items: center;
621
- margin-bottom: 1rem;
622
- }
623
-
624
- .code-close-btn {
625
- font-size: 24px;
626
- border: none;
627
- background: transparent;
628
- cursor: pointer;
629
- }
630
-
631
- .code-modal-controls {
632
- display: flex;
633
- align-items: center;
634
- gap: 10px;
635
- margin-bottom: 10px;
636
- }
637
-
638
- .code-modal-controls select,
639
- .code-modal-controls button {
640
- padding: 6px 12px;
641
- font-size: 14px;
642
- }
643
-
644
- .code-output {
645
- background: #f2f2f2;
646
- padding: 12px;
647
- border-radius: 4px;
648
- margin-top: 15px;
649
- height: 150px;
650
- overflow-y: auto;
651
- white-space: pre-wrap;
652
- }
653
-
654
- .addon-btn {
655
- padding: 8px 16px;
656
- background: linear-gradient(to right, #7f00ff, #4f46e5);
657
- color: white;
658
- font-weight: bold;
659
- border: none;
660
- border-radius: 6px;
661
- box-shadow: 0 2px 6px rgba(0, 0, 0, 0.2);
662
- cursor: pointer;
663
- transition:
664
- background 0.3s ease,
665
- transform 0.2s ease;
666
- }
667
-
668
- .addon-btn:hover {
669
- background: linear-gradient(to right, #6b00d6, #4338ca);
670
- transform: translateY(-1px);
671
- }
672
-
673
- .addon-btn:active {
674
- transform: scale(0.97);
675
- }
676
-
677
- .run-code {
678
- margin-left: auto;
679
- background-color: black;
680
- color: white;
681
- padding: 6px 16px;
682
- border: none;
683
- border-radius: 4px;
684
- cursor: pointer;
685
- font-size: 14px;
686
- }
687
-
688
- .run-code:disabled {
689
- opacity: 0.6;
690
- cursor: not-allowed;
691
- }
692
-
693
- .code-submit-buttons-container {
694
- display: flex;
695
- justify-content: space-between;
696
- gap: 10px;
697
- }
698
-
699
- .code-submit-buttons {
700
- background-color: black;
701
- color: white;
702
- padding: 16px;
703
- border: none;
704
- border-radius: 4px;
705
- cursor: pointer;
706
- font-size: 14px;
707
- }
708
-
709
- .code-submit-buttons:disabled {
710
- opacity: 0.6;
711
- cursor: not-allowed;
712
- }
713
-
714
- .container {
715
- display: flex;
716
- flex-direction: column;
717
- gap: 1.25rem;
718
- max-width: 700px;
719
- margin: 0 auto;
720
- padding: 1rem;
721
- }
722
-
723
- .field {
724
- display: flex;
725
- flex-direction: column;
726
- gap: 0.5rem;
727
- }
728
-
729
- .label {
730
- font-weight: 600;
731
- color: #222;
732
- font-size: 0.95rem;
733
- }
734
-
735
- .select,
736
- .textarea {
737
- width: 100%;
738
- padding: 0.75rem;
739
- font-size: 1rem;
740
- border: 1px solid #ccc;
741
- border-radius: 8px;
742
- transition:
743
- border-color 0.2s ease,
744
- box-shadow 0.2s ease;
745
- }
746
-
747
- .textarea {
748
- min-height: 120px;
749
- resize: vertical;
750
- }
751
-
752
- .select:focus,
753
- .textarea:focus {
754
- outline: none;
755
- border-color: #0070f3;
756
- box-shadow: 0 0 0 2px rgba(0, 112, 243, 0.2);
757
- }
758
-
759
- .button {
760
- padding: 0.7rem 1.4rem;
761
- font-size: 1rem;
762
- border: none;
763
- border-radius: 8px;
764
- background: #0070f3;
765
- color: #fff;
766
- cursor: pointer;
767
- font-weight: 500;
768
- align-self: flex-start;
769
- transition: background 0.2s ease;
770
- }
771
-
772
- .button:hover {
773
- background: #0059c1;
774
- }
775
-
776
- .textareaWrapper {
777
- display: flex;
778
- align-items: center;
779
- gap: 0.5rem;
780
- }
781
-
782
- .iconButton {
783
- background: transparent;
784
- border: none;
785
- cursor: pointer;
786
- font-size: 1.3rem;
787
- color: #444;
788
- transition:
789
- color 0.2s ease,
790
- transform 0.2s ease;
791
- }
792
-
793
- .iconButton:hover {
794
- color: #0070f3;
795
- transform: scale(1.1);
796
- }
797
-
798
- .outputWrapper {
799
- display: flex;
800
- align-items: center;
801
- gap: 0.75rem;
802
- margin-top: 0.5rem;
803
- }
804
-
805
- .output {
806
- flex: 1;
807
- padding: 1rem;
808
- border: 1px solid #ddd;
809
- border-radius: 8px;
810
- background: #f9f9f9;
811
- min-height: 60px;
812
- font-size: 1rem;
813
- line-height: 1.4;
814
- color: #222;
815
- }
816
-
817
- .tabHeader {
818
- display: flex;
819
- justify-content: center;
820
- align-items: stretch;
821
- margin-bottom: 1rem;
822
- border-bottom: 2px solid #ddd;
823
- }
824
-
825
- .tabButton {
826
- flex: 1;
827
- text-align: center;
828
- padding: 0.75rem 1rem;
829
- font-size: 1rem;
830
- font-weight: 500;
831
- background: var(--background);
832
- color: var(--foreground);
833
- border: none;
834
- border-bottom: 3px solid transparent;
835
- cursor: pointer;
836
- transition: all 0.2s ease-in-out;
837
- }
838
-
839
- .tabButton:hover {
840
- background: rgba(0, 0, 0, 0.05);
841
- }
842
-
843
- .active {
844
- border-bottom: 3px solid var(--primary);
845
- color: var(--primary);
846
- font-weight: 600;
847
- }
848
-
849
- .tabContent {
850
- padding: 1.5rem;
851
- border: 1px solid #ddd;
852
- border-radius: 0 0 10px 10px;
853
- background: var(--background);
854
- box-shadow: 0 2px 6px rgba(0, 0, 0, 0.05);
855
- }
856
-
857
- .container {
858
- display: flex;
859
- flex-direction: column;
860
- gap: 1.25rem;
861
- max-width: 700px;
862
- margin: 0 auto;
863
- padding: 1rem;
864
- }
865
-
866
- .field {
867
- display: flex;
868
- flex-direction: column;
869
- gap: 0.5rem;
870
- }
871
-
872
- .label {
873
- font-weight: 600;
874
- color: #222;
875
- font-size: 0.95rem;
876
- }
877
-
878
- .select,
879
- .textarea {
880
- width: 100%;
881
- padding: 0.75rem;
882
- font-size: 1rem;
883
- border: 1px solid #ccc;
884
- border-radius: 8px;
885
- transition:
886
- border-color 0.2s ease,
887
- box-shadow 0.2s ease;
888
- }
889
-
890
- .textarea {
891
- min-height: 120px;
892
- resize: vertical;
893
- }
894
-
895
- .select:focus,
896
- .textarea:focus {
897
- outline: none;
898
- border-color: #0070f3;
899
- box-shadow: 0 0 0 2px rgba(0, 112, 243, 0.2);
900
- }
901
-
902
- .button {
903
- padding: 0.7rem 1.4rem;
904
- font-size: 1rem;
905
- border: none;
906
- border-radius: 8px;
907
- background: #0070f3;
908
- color: #fff;
909
- cursor: pointer;
910
- font-weight: 500;
911
- align-self: flex-start;
912
- transition: background 0.2s ease;
913
- }
914
-
915
- .button:hover {
916
- background: #0059c1;
917
- }
918
-
919
- .textareaWrapper {
920
- display: flex;
921
- align-items: center;
922
- gap: 0.5rem;
923
- }
924
-
925
- .iconButton {
926
- background: transparent;
927
- border: none;
928
- cursor: pointer;
929
- font-size: 1.3rem;
930
- color: #444;
931
- transition:
932
- color 0.2s ease,
933
- transform 0.2s ease;
934
- }
935
-
936
- .iconButton:hover {
937
- color: #0070f3;
938
- transform: scale(1.1);
939
- }
940
-
941
- .outputWrapper {
942
- display: flex;
943
- align-items: center;
944
- gap: 0.75rem;
945
- margin-top: 0.5rem;
946
- }
947
-
948
- .output {
949
- flex: 1;
950
- padding: 1rem;
951
- border: 1px solid #ddd;
952
- border-radius: 8px;
953
- background: #f9f9f9;
954
- min-height: 60px;
955
- font-size: 1rem;
956
- line-height: 1.4;
957
- color: #222;
958
- }
959
-
960
- .lang-button {
961
- padding: 8px 16px;
962
- margin-left: 0.75rem;
963
- background: linear-gradient(to right, #10b981, #059669);
964
- color: white;
965
- font-weight: bold;
966
- border: none;
967
- border-radius: 6px;
968
- cursor: pointer;
969
- transition:
970
- background 0.3s ease,
971
- transform 0.2s ease;
972
- }
973
-
974
- .lang-button:hover {
975
- background: linear-gradient(to right, #059669, #047857);
976
- transform: translateY(-1px);
977
- }
978
-
979
- .lang-button:active {
980
- transform: scale(0.97);
981
- }