@thangph2146/lexical-editor 0.0.7 → 0.0.11

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 (23) hide show
  1. package/README.md +8 -0
  2. package/dist/editor-x/editor.cjs +26 -24
  3. package/dist/editor-x/editor.cjs.map +1 -1
  4. package/dist/editor-x/editor.css +120 -105
  5. package/dist/editor-x/editor.css.map +1 -1
  6. package/dist/editor-x/editor.js +26 -24
  7. package/dist/editor-x/editor.js.map +1 -1
  8. package/dist/index.cjs +26 -24
  9. package/dist/index.cjs.map +1 -1
  10. package/dist/index.css +120 -105
  11. package/dist/index.css.map +1 -1
  12. package/dist/index.js +26 -24
  13. package/dist/index.js.map +1 -1
  14. package/package.json +87 -86
  15. package/src/editor-ui/content-editable.tsx +30 -42
  16. package/src/editor-x/plugins.tsx +3 -1
  17. package/src/plugins/floating-text-format-plugin.tsx +716 -702
  18. package/src/plugins/layout-plugin.tsx +1 -5
  19. package/src/themes/_variables.scss +26 -26
  20. package/src/themes/core/_typography.scss +26 -12
  21. package/src/themes/plugins/_color-picker.scss +103 -104
  22. package/src/themes/plugins/_menus-and-pickers.scss +2 -0
  23. package/src/themes/ui-components/_typography.scss +1 -1
package/dist/index.css CHANGED
@@ -390,7 +390,7 @@
390
390
  background-color: var(--muted);
391
391
  }
392
392
  .editor-bg-accent {
393
- background-color: var(--accent, #f1f5f9);
393
+ background-color: var(--accent, #f1f3f5);
394
394
  }
395
395
  .editor-bg-transparent {
396
396
  background-color: transparent;
@@ -722,7 +722,7 @@
722
722
  }
723
723
  .editor-text-xs-muted {
724
724
  font-size: 0.75rem;
725
- color: var(--muted-foreground, #64748b);
725
+ color: var(--muted-foreground, #6c757d);
726
726
  }
727
727
  .editor-text-sm {
728
728
  font-size: 0.875rem;
@@ -744,7 +744,7 @@
744
744
  monospace;
745
745
  }
746
746
  .editor-text-muted-foreground {
747
- color: var(--muted-foreground, #64748b);
747
+ color: var(--muted-foreground, #6c757d);
748
748
  }
749
749
  .editor-text-foreground-50 {
750
750
  color: color-mix(in srgb, var(--foreground), transparent 50%);
@@ -831,10 +831,10 @@
831
831
  flex-shrink: 0;
832
832
  }
833
833
  .editor-typography-p {
834
- line-height: 1.75;
834
+ line-height: var(--lh-body-normal, 1.5);
835
835
  }
836
836
  .editor-typography-p:not(:first-child) {
837
- margin-top: 24px;
837
+ margin-top: calc(var(--sp-3, 1.2rem) * 2);
838
838
  }
839
839
  .editor-typography-p-small {
840
840
  font-size: 0.875rem;
@@ -896,9 +896,9 @@
896
896
  }
897
897
  .editor-toolbar-item--outline:hover,
898
898
  .editor-toggle-group-item--outline:hover {
899
- background-color: var(--accent, #f1f5f9);
900
- border-color: var(--accent, #f1f5f9);
901
- color: var(--accent-foreground, #0f172a) !important;
899
+ background-color: var(--accent, #f1f3f5);
900
+ border-color: var(--accent, #f1f3f5);
901
+ color: var(--accent-foreground, #212529) !important;
902
902
  }
903
903
  .editor-toolbar-item:hover,
904
904
  .editor-toggle-group-item:hover {
@@ -909,9 +909,9 @@
909
909
  .editor-toolbar-item[data-state=active],
910
910
  .editor-toggle-group-item[data-state=on],
911
911
  .editor-toggle-group-item[data-state=active] {
912
- background-color: var(--accent, #f1f5f9);
913
- color: var(--accent-foreground, #0f172a) !important;
914
- border-color: var(--accent, #f1f5f9);
912
+ background-color: var(--accent, #f1f3f5);
913
+ color: var(--accent-foreground, #212529) !important;
914
+ border-color: var(--accent, #f1f3f5);
915
915
  }
916
916
  .editor-toolbar-item[data-state=on]:hover,
917
917
  .editor-toolbar-item[data-state=active]:hover,
@@ -919,8 +919,8 @@
919
919
  .editor-toggle-group-item[data-state=active]:hover {
920
920
  transform: translateY(-1px);
921
921
  box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06) !important;
922
- background-color: color-mix(in srgb, var(--accent, #f1f5f9), black 10%);
923
- border-color: var(--accent, #f1f5f9);
922
+ background-color: color-mix(in srgb, var(--accent, #f1f3f5), black 10%);
923
+ border-color: var(--accent, #f1f3f5);
924
924
  }
925
925
  .editor-toolbar-item:disabled,
926
926
  .editor-toggle-group-item:disabled {
@@ -1059,9 +1059,9 @@
1059
1059
  }
1060
1060
  .editor-btn[data-state=on],
1061
1061
  .editor-btn[data-state=active] {
1062
- background-color: var(--accent, #f1f5f9);
1063
- color: var(--accent-foreground, #0f172a) !important;
1064
- border-color: var(--accent, #f1f5f9);
1062
+ background-color: var(--accent, #f1f3f5);
1063
+ color: var(--accent-foreground, #212529) !important;
1064
+ border-color: var(--accent, #f1f3f5);
1065
1065
  }
1066
1066
  .editor-btn--default {
1067
1067
  background-color: var(--primary);
@@ -1206,7 +1206,7 @@
1206
1206
  }
1207
1207
  .editor-input:hover:not(:disabled):not([readonly]) {
1208
1208
  background-color: color-mix(in srgb, var(--background), black 3%);
1209
- border-color: var(--accent, #f1f5f9);
1209
+ border-color: var(--accent, #f1f3f5);
1210
1210
  transform: translateY(-1px);
1211
1211
  box-shadow: 0 2px 4px -1px rgba(0, 0, 0, 0.1);
1212
1212
  }
@@ -1355,7 +1355,7 @@
1355
1355
  .editor-dialog-header__title {
1356
1356
  font-size: 1.125rem;
1357
1357
  font-weight: 600;
1358
- line-height: 1.25;
1358
+ line-height: var(--lh-tight, 1.25);
1359
1359
  margin: 0;
1360
1360
  }
1361
1361
  .editor-dialog-header__description {
@@ -1457,12 +1457,12 @@
1457
1457
  outline: none;
1458
1458
  }
1459
1459
  .editor-select-item:hover {
1460
- background-color: var(--accent, #f1f5f9);
1461
- color: var(--accent-foreground, #0f172a);
1460
+ background-color: var(--accent, #f1f3f5);
1461
+ color: var(--accent-foreground, #212529);
1462
1462
  }
1463
1463
  .editor-select-item[data-selected=true] {
1464
- background-color: var(--accent, #f1f5f9);
1465
- color: var(--accent-foreground, #0f172a);
1464
+ background-color: var(--accent, #f1f3f5);
1465
+ color: var(--accent-foreground, #212529);
1466
1466
  }
1467
1467
  .editor-select-item__check {
1468
1468
  position: absolute;
@@ -1515,8 +1515,8 @@
1515
1515
  filter: brightness(0.95);
1516
1516
  }
1517
1517
  .editor-toggle:hover {
1518
- background-color: var(--accent, #f1f5f9);
1519
- color: var(--accent-foreground, #0f172a);
1518
+ background-color: var(--accent, #f1f3f5);
1519
+ color: var(--accent-foreground, #212529);
1520
1520
  }
1521
1521
  .editor-toggle:focus-visible {
1522
1522
  outline: none;
@@ -1527,26 +1527,26 @@
1527
1527
  opacity: 0.5;
1528
1528
  }
1529
1529
  .editor-toggle[data-state=on] {
1530
- background-color: var(--accent, #f1f5f9);
1531
- color: var(--accent-foreground, #0f172a) !important;
1530
+ background-color: var(--accent, #f1f3f5);
1531
+ color: var(--accent-foreground, #212529) !important;
1532
1532
  }
1533
1533
  .editor-toggle[data-state=on]:hover {
1534
1534
  transform: translateY(-1px);
1535
1535
  box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06) !important;
1536
- background-color: color-mix(in srgb, var(--accent, #f1f5f9), black 10%);
1537
- border-color: var(--accent, #f1f5f9);
1536
+ background-color: color-mix(in srgb, var(--accent, #f1f3f5), black 10%);
1537
+ border-color: var(--accent, #f1f3f5);
1538
1538
  }
1539
1539
  .editor-toggle--outline {
1540
1540
  border-color: var(--input);
1541
1541
  box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.05) !important;
1542
1542
  }
1543
1543
  .editor-toggle--outline:hover {
1544
- background-color: color-mix(in srgb, var(--accent, #f1f5f9), black 5%);
1545
- color: var(--accent-foreground, #0f172a);
1544
+ background-color: color-mix(in srgb, var(--accent, #f1f3f5), black 5%);
1545
+ color: var(--accent-foreground, #212529);
1546
1546
  }
1547
1547
  .editor-toggle--ghost:hover {
1548
- background-color: color-mix(in srgb, var(--accent, #f1f5f9), black 5%);
1549
- color: var(--accent-foreground, #0f172a);
1548
+ background-color: color-mix(in srgb, var(--accent, #f1f3f5), black 5%);
1549
+ color: var(--accent-foreground, #212529);
1550
1550
  }
1551
1551
  .editor-toggle--size-default {
1552
1552
  height: 36px;
@@ -1773,8 +1773,8 @@
1773
1773
  .editor-floating-text-format .editor-toggle-group-item:hover,
1774
1774
  .editor-floating-text-format .editor-btn:hover,
1775
1775
  .editor-floating-text-format .editor-toolbar-item:hover {
1776
- background-color: var(--accent, #f1f5f9);
1777
- color: var(--accent-foreground, #0f172a);
1776
+ background-color: var(--accent, #f1f3f5);
1777
+ color: var(--accent-foreground, #212529);
1778
1778
  }
1779
1779
  .editor-floating-text-format .editor-toggle-group-item[data-state=on],
1780
1780
  .editor-floating-text-format .editor-toggle-group-item[data-state=active],
@@ -1785,8 +1785,8 @@
1785
1785
  .editor-floating-text-format .editor-toolbar-item[data-state=on],
1786
1786
  .editor-floating-text-format .editor-toolbar-item[data-state=active],
1787
1787
  .editor-floating-text-format .editor-toolbar-item--active {
1788
- background-color: var(--accent, #f1f5f9);
1789
- color: var(--accent-foreground, #0f172a) !important;
1788
+ background-color: var(--accent, #f1f3f5);
1789
+ color: var(--accent-foreground, #212529) !important;
1790
1790
  font-weight: 700;
1791
1791
  }
1792
1792
  .editor-floating-text-format .editor-floating-group,
@@ -1832,9 +1832,8 @@
1832
1832
  .editor-color-picker-content {
1833
1833
  display: flex !important;
1834
1834
  flex-direction: column !important;
1835
- width: 380px;
1835
+ min-width: 380px;
1836
1836
  gap: 16px;
1837
- padding: 16px;
1838
1837
  }
1839
1838
  .editor-color-picker-area {
1840
1839
  position: relative;
@@ -1928,7 +1927,7 @@
1928
1927
  line-height: 1.375;
1929
1928
  }
1930
1929
  .editor-color-value-text {
1931
- color: var(--muted-foreground, #64748b);
1930
+ color: var(--muted-foreground, #6c757d);
1932
1931
  font-family:
1933
1932
  "JetBrains Mono",
1934
1933
  ui-monospace,
@@ -1996,8 +1995,8 @@
1996
1995
  background: transparent;
1997
1996
  }
1998
1997
  .editor-folder-tree-trigger:hover {
1999
- background-color: var(--accent, #f1f5f9);
2000
- color: var(--accent-foreground, #0f172a);
1998
+ background-color: var(--accent, #f1f3f5);
1999
+ color: var(--accent-foreground, #212529);
2001
2000
  }
2002
2001
  .editor-tree-content {
2003
2002
  margin-left: 16px;
@@ -2018,7 +2017,7 @@
2018
2017
  transition: background-color 200ms cubic-bezier(0.4, 0, 0.2, 1);
2019
2018
  }
2020
2019
  .editor-image-resizer-handle:hover {
2021
- background-color: var(--accent, #f1f5f9);
2020
+ background-color: var(--accent, #f1f3f5);
2022
2021
  }
2023
2022
  .editor-image-resizer-handle--n {
2024
2023
  top: -5px;
@@ -2093,9 +2092,9 @@
2093
2092
  .editor-mentions-item[data-selected=true],
2094
2093
  .editor-mentions-item[data-state=active],
2095
2094
  .editor-mentions-item[data-state=on] {
2096
- background-color: var(--accent, #f1f5f9);
2097
- color: var(--accent-foreground, #0f172a);
2098
- border-color: var(--border, #d1d5db);
2095
+ background-color: var(--accent, #f1f3f5);
2096
+ color: var(--accent-foreground, #212529);
2097
+ border-color: var(--border, #dee2e6);
2099
2098
  }
2100
2099
  .editor-mentions-item:active {
2101
2100
  transform: translateY(0) scale(0.98);
@@ -2134,7 +2133,7 @@
2134
2133
  will-change: transform;
2135
2134
  }
2136
2135
  .editor-draggable-menu:hover {
2137
- background-color: var(--accent, #f1f5f9);
2136
+ background-color: var(--accent, #f1f3f5);
2138
2137
  }
2139
2138
  .editor-draggable-menu:active {
2140
2139
  cursor: grabbing;
@@ -2250,9 +2249,9 @@
2250
2249
  .editor-command-item[data-selected=true],
2251
2250
  .editor-command-item[data-state=active],
2252
2251
  .editor-command-item[data-state=on] {
2253
- background-color: var(--accent, #f1f5f9);
2254
- color: var(--accent-foreground, #0f172a);
2255
- border-color: var(--border, #d1d5db);
2252
+ background-color: var(--accent, #f1f3f5);
2253
+ color: var(--accent-foreground, #212529);
2254
+ border-color: var(--border, #dee2e6);
2256
2255
  }
2257
2256
  .editor-command-item:active {
2258
2257
  transform: translateY(0) scale(0.98);
@@ -2303,9 +2302,9 @@
2303
2302
  .editor-context-menu-item[data-selected=true],
2304
2303
  .editor-context-menu-item[data-state=active],
2305
2304
  .editor-context-menu-item[data-state=on] {
2306
- background-color: var(--accent, #f1f5f9);
2307
- color: var(--accent-foreground, #0f172a);
2308
- border-color: var(--border, #d1d5db);
2305
+ background-color: var(--accent, #f1f3f5);
2306
+ color: var(--accent-foreground, #212529);
2307
+ border-color: var(--border, #dee2e6);
2309
2308
  }
2310
2309
  .editor-context-menu-item:active {
2311
2310
  transform: translateY(0) scale(0.98);
@@ -2334,6 +2333,8 @@
2334
2333
  overflow-x: auto;
2335
2334
  flex-wrap: nowrap;
2336
2335
  border-top: 1px solid var(--border);
2336
+ border-bottom-left-radius: 8px;
2337
+ border-bottom-right-radius: 8px;
2337
2338
  padding: 6px 12px;
2338
2339
  background-color: color-mix(in srgb, var(--background), transparent 50%);
2339
2340
  }
@@ -2375,7 +2376,7 @@
2375
2376
  transition: all 200ms cubic-bezier(0.4, 0, 0.2, 1);
2376
2377
  }
2377
2378
  .editor-root-container.editor-root-container--shadow:focus-within {
2378
- box-shadow: 0 0 0 1px var(--border, #d1d5db), 0 0 0 3px var(--ring, rgba(59, 130, 246, 0.5));
2379
+ box-shadow: 0 0 0 1px var(--border, #dee2e6), 0 0 0 3px var(--ring, rgba(59, 130, 246, 0.5));
2379
2380
  }
2380
2381
  *,
2381
2382
  *::before,
@@ -2402,8 +2403,8 @@
2402
2403
  "Helvetica Neue",
2403
2404
  Arial,
2404
2405
  sans-serif !important;
2405
- font-size: 16px;
2406
- color: var(--foreground, #1f2937) !important;
2406
+ font-size: var(--fs-body, 1rem);
2407
+ color: var(--foreground, #212529) !important;
2407
2408
  background-color: var(--background, transparent) !important;
2408
2409
  position: relative !important;
2409
2410
  width: 100% !important;
@@ -2506,64 +2507,78 @@
2506
2507
  display: none !important;
2507
2508
  }
2508
2509
  .lexical-editor-root .editor-paragraph {
2509
- font-size: 16px !important;
2510
- line-height: 1.75 !important;
2511
- margin-top: 12px !important;
2512
- margin-bottom: 12px !important;
2510
+ font-family: var(--font-family-base, var(--font-inter), Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, Segoe UI, Roboto, Helvetica Neue, Arial, sans-serif) !important;
2511
+ font-size: var(--fs-body, 1rem) !important;
2512
+ line-height: var(--lh-body-normal, 1.5) !important;
2513
+ color: var(--gray-900, #212529) !important;
2514
+ margin-top: var(--sp-3, 1.2rem) !important;
2515
+ margin-bottom: var(--sp-3, 1.2rem) !important;
2513
2516
  }
2514
2517
  .lexical-editor-root .editor-paragraph:first-child {
2515
2518
  margin-top: 0 !important;
2516
2519
  }
2517
2520
  .lexical-editor-root .editor-h1 {
2518
- font-size: 36px;
2519
- line-height: 1.25 !important;
2521
+ font-family: var(--font-family-heading, var(--font-inter), Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, Segoe UI, Roboto, Helvetica Neue, Arial, sans-serif) !important;
2522
+ color: var(--gray-900, #212529) !important;
2523
+ font-size: var(--fs-page-title, 3.6rem);
2524
+ line-height: var(--lh-heading-tight, 1.25) !important;
2520
2525
  font-weight: 700 !important;
2521
2526
  letter-spacing: -0.025em;
2522
- margin-top: 36px !important;
2523
- margin-bottom: 18px !important;
2527
+ margin-top: calc(var(--sp-5, 2.4rem) * 1.5) !important;
2528
+ margin-bottom: calc(var(--sp-3, 1.2rem) * 1.5) !important;
2524
2529
  }
2525
2530
  .lexical-editor-root .editor-h2 {
2526
- font-size: 30px;
2527
- line-height: 1.25 !important;
2531
+ font-family: var(--font-family-heading, var(--font-inter), Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, Segoe UI, Roboto, Helvetica Neue, Arial, sans-serif) !important;
2532
+ color: var(--gray-900, #212529) !important;
2533
+ font-size: var(--fs-heading-xl, 3rem);
2534
+ line-height: var(--lh-heading-tight, 1.25) !important;
2528
2535
  font-weight: 600 !important;
2529
- margin-top: 30px !important;
2530
- margin-bottom: 15px !important;
2536
+ margin-top: calc(var(--sp-5, 2.4rem) * 1.25) !important;
2537
+ margin-bottom: calc(var(--sp-3, 1.2rem) * 1.25) !important;
2531
2538
  border-bottom: 1px solid var(--border);
2532
2539
  padding-bottom: 4px;
2533
2540
  }
2534
2541
  .lexical-editor-root .editor-h3 {
2535
- font-size: 24px;
2536
- line-height: 1.25 !important;
2542
+ font-family: var(--font-family-heading, var(--font-inter), Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, Segoe UI, Roboto, Helvetica Neue, Arial, sans-serif) !important;
2543
+ color: var(--gray-800, #343a40) !important;
2544
+ font-size: var(--fs-heading-m, 2.4rem);
2545
+ line-height: var(--lh-heading-tight, 1.25) !important;
2537
2546
  font-weight: 600 !important;
2538
- margin-top: 24px !important;
2539
- margin-bottom: 12px !important;
2547
+ margin-top: var(--sp-5, 2.4rem) !important;
2548
+ margin-bottom: var(--sp-3, 1.2rem) !important;
2540
2549
  }
2541
2550
  .lexical-editor-root .editor-h4 {
2542
- font-size: 20px;
2543
- line-height: 1.25 !important;
2551
+ font-family: var(--font-family-heading, var(--font-inter), Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, Segoe UI, Roboto, Helvetica Neue, Arial, sans-serif) !important;
2552
+ color: var(--gray-800, #343a40) !important;
2553
+ font-size: var(--fs-body, 1.6rem);
2554
+ line-height: var(--lh-heading-tight, 1.25) !important;
2544
2555
  font-weight: 600 !important;
2545
- margin-top: 18px !important;
2546
- margin-bottom: 9px !important;
2556
+ margin-top: calc(var(--sp-5, 2.4rem) * 0.75) !important;
2557
+ margin-bottom: calc(var(--sp-3, 1.2rem) * 0.75) !important;
2547
2558
  }
2548
2559
  .lexical-editor-root .editor-h5 {
2549
- font-size: 18px;
2550
- line-height: 1.25 !important;
2560
+ font-family: var(--font-family-heading, var(--font-inter), Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, Segoe UI, Roboto, Helvetica Neue, Arial, sans-serif) !important;
2561
+ color: var(--gray-700, #495057) !important;
2562
+ font-size: var(--fs-body-sm, 1.4rem);
2563
+ line-height: var(--lh-heading-tight, 1.25) !important;
2551
2564
  font-weight: 600 !important;
2552
- margin-top: 12px !important;
2553
- margin-bottom: 6px !important;
2565
+ margin-top: calc(var(--sp-5, 2.4rem) * 0.5) !important;
2566
+ margin-bottom: calc(var(--sp-3, 1.2rem) * 0.5) !important;
2554
2567
  }
2555
2568
  .lexical-editor-root .editor-h6 {
2556
- font-size: 16px;
2557
- line-height: 1.25 !important;
2569
+ font-family: var(--font-family-heading, var(--font-inter), Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, Segoe UI, Roboto, Helvetica Neue, Arial, sans-serif) !important;
2570
+ color: var(--gray-700, #495057) !important;
2571
+ font-size: var(--fs-caption, 1.3rem);
2572
+ line-height: var(--lh-heading-tight, 1.25) !important;
2558
2573
  font-weight: 600 !important;
2559
- margin-top: 12px !important;
2560
- margin-bottom: 6px !important;
2574
+ margin-top: calc(var(--sp-5, 2.4rem) * 0.5) !important;
2575
+ margin-bottom: calc(var(--sp-3, 1.2rem) * 0.5) !important;
2561
2576
  }
2562
2577
  .lexical-editor-root .editor-quote {
2563
2578
  margin: 24px 0 !important;
2564
2579
  padding: 16px 16px 16px 24px;
2565
2580
  border-left: 4px solid var(--border);
2566
- font-size: 18px;
2581
+ font-size: var(--fs-body, 1.6rem);
2567
2582
  color: var(--muted-foreground);
2568
2583
  font-style: italic;
2569
2584
  background-color: var(--muted);
@@ -2677,7 +2692,7 @@
2677
2692
  margin-top: 3px;
2678
2693
  cursor: pointer;
2679
2694
  display: block;
2680
- border: 2px solid var(--list-marker-color, #3b82f6) !important;
2695
+ border: 2px solid var(--list-marker-color, var(--primary, #3b82f6)) !important;
2681
2696
  border-radius: 4px;
2682
2697
  box-sizing: border-box;
2683
2698
  transition: all 150ms cubic-bezier(0.4, 0, 0.2, 1);
@@ -2687,11 +2702,11 @@
2687
2702
  }
2688
2703
  .lexical-editor-root .editor-checklist .editor-listitem-checked {
2689
2704
  text-decoration: line-through;
2690
- color: var(--muted-foreground, #64748b);
2705
+ color: var(--muted-foreground, #6c757d);
2691
2706
  }
2692
2707
  .lexical-editor-root .editor-checklist .editor-listitem-checked::before {
2693
- background-color: var(--list-marker-color, #3b82f6) !important;
2694
- border-color: var(--list-marker-color, #3b82f6) !important;
2708
+ background-color: var(--list-marker-color, var(--primary, #3b82f6)) !important;
2709
+ border-color: var(--list-marker-color, var(--primary, #3b82f6)) !important;
2695
2710
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 14 14'%3E%3Cpath fill='none' stroke='white' stroke-width='2' stroke-linecap='round' stroke-linejoin='round' d='M3 7.5L5.5 10L11 4.5'/%3E%3C/svg%3E");
2696
2711
  }
2697
2712
  .lexical-editor-root .editor-checklist .editor-listitem-checked::after {
@@ -2920,8 +2935,8 @@
2920
2935
  list-style-type: disc !important;
2921
2936
  }
2922
2937
  .lexical-editor-root .editor-code {
2923
- background-color: var(--muted, #f3f4f6);
2924
- color: var(--muted-foreground, #1f2937);
2938
+ background-color: var(--muted, #f1f3f5);
2939
+ color: var(--muted-foreground, #212529);
2925
2940
  font-family:
2926
2941
  "JetBrains Mono",
2927
2942
  ui-monospace,
@@ -2934,7 +2949,7 @@
2934
2949
  monospace;
2935
2950
  display: block;
2936
2951
  padding: 16px 16px 16px 64px;
2937
- line-height: 1.75;
2952
+ line-height: var(--lh-body-normal, 1.5);
2938
2953
  font-size: 14px;
2939
2954
  margin: 24px 0 !important;
2940
2955
  overflow-x: auto;
@@ -2961,8 +2976,8 @@
2961
2976
  user-select: none;
2962
2977
  }
2963
2978
  .lexical-editor-root .editor-text-code {
2964
- background-color: var(--muted, #f3f4f6);
2965
- color: var(--foreground, #1f2937);
2979
+ background-color: var(--muted, #f1f3f5);
2980
+ color: var(--foreground, #212529);
2966
2981
  padding: 2px 6px;
2967
2982
  font-family:
2968
2983
  "JetBrains Mono",
@@ -2976,7 +2991,7 @@
2976
2991
  monospace;
2977
2992
  font-size: 14px;
2978
2993
  border-radius: var(--radius, 8px);
2979
- border: 1px solid var(--border, #d1d5db);
2994
+ border: 1px solid var(--border, #dee2e6);
2980
2995
  font-weight: 500;
2981
2996
  }
2982
2997
  .lexical-editor-root .editor-hashtag {
@@ -2992,7 +3007,7 @@
2992
3007
  table-layout: fixed;
2993
3008
  margin: 16px 0;
2994
3009
  border-radius: var(--radius, 8px);
2995
- border: 1px solid var(--border, #d1d5db);
3010
+ border: 1px solid var(--border, #dee2e6);
2996
3011
  }
2997
3012
  .lexical-editor-root .editor-table .editor-table-cell,
2998
3013
  .lexical-editor-root .editor-table .editor-table-cell-header {
@@ -3006,7 +3021,7 @@
3006
3021
  .lexical-editor-root .editor-table .editor-table-cell-header {
3007
3022
  background-color: var(--muted, #f9fafb);
3008
3023
  font-weight: 600;
3009
- color: var(--foreground, #1f2937);
3024
+ color: var(--foreground, #212529);
3010
3025
  }
3011
3026
  .lexical-editor-root .editor-table .editor-table-cell-selected {
3012
3027
  background-color: rgba(var(--primary, #3b82f6), 0.3) !important;
@@ -3034,13 +3049,13 @@
3034
3049
  height: 20px;
3035
3050
  }
3036
3051
  .lexical-editor-root .editor-table .editor-table-cell-action-button {
3037
- background-color: var(--muted, #f3f4f6);
3052
+ background-color: var(--muted, #f1f3f5);
3038
3053
  display: block;
3039
3054
  border: 0;
3040
3055
  border-radius: 9999px;
3041
3056
  width: 20px;
3042
3057
  height: 20px;
3043
- color: var(--foreground, #1f2937);
3058
+ color: var(--foreground, #212529);
3044
3059
  cursor: pointer;
3045
3060
  transition: all 150ms cubic-bezier(0.4, 0, 0.2, 1);
3046
3061
  }
@@ -3075,15 +3090,15 @@
3075
3090
  left: 0;
3076
3091
  width: 100%;
3077
3092
  height: 4px;
3078
- background-color: var(--muted, #f3f4f6);
3093
+ background-color: var(--muted, #f1f3f5);
3079
3094
  }
3080
3095
  .lexical-editor-root .editor-table .editor-table-row-striping {
3081
3096
  margin: 0;
3082
- border-top: 1px solid var(--border, #d1d5db);
3097
+ border-top: 1px solid var(--border, #dee2e6);
3083
3098
  padding: 0;
3084
3099
  }
3085
3100
  .lexical-editor-root .editor-table .editor-table-row-striping:nth-child(even) {
3086
- background-color: var(--muted, #f3f4f6);
3101
+ background-color: var(--muted, #f1f3f5);
3087
3102
  }
3088
3103
  .lexical-editor-root .editor-table .editor-table-selected {
3089
3104
  outline: 2px solid var(--primary, #3b82f6);
@@ -3116,7 +3131,7 @@
3116
3131
  pointer-events: none;
3117
3132
  }
3118
3133
  .lexical-editor-root .editor-link {
3119
- color: #3b82f6;
3134
+ color: var(--primary, #3b82f6);
3120
3135
  text-decoration: none;
3121
3136
  }
3122
3137
  .lexical-editor-root .editor-link:hover {
@@ -3195,7 +3210,7 @@
3195
3210
  margin-top: 8px;
3196
3211
  }
3197
3212
  .lexical-editor-root .editor-image-caption.editable {
3198
- border: 1px solid var(--border, #d1d5db);
3213
+ border: 1px solid var(--border, #dee2e6);
3199
3214
  border-radius: var(--radius, 8px);
3200
3215
  background-color: rgba(255, 255, 255, 0.9);
3201
3216
  }
@@ -3233,7 +3248,7 @@
3233
3248
  content: "";
3234
3249
  display: block;
3235
3250
  height: 2px;
3236
- background-color: var(--border, #d1d5db);
3251
+ background-color: var(--border, #dee2e6);
3237
3252
  line-height: 2px;
3238
3253
  }
3239
3254
  .lexical-editor-root .editor-hr.selected {
@@ -3247,6 +3262,6 @@
3247
3262
  outline: 2px solid var(--primary, #3b82f6);
3248
3263
  }
3249
3264
  .lexical-editor-root .editor-autocomplete {
3250
- color: var(--muted-foreground, #64748b);
3265
+ color: var(--muted-foreground, #6c757d);
3251
3266
  }
3252
3267
  /*# sourceMappingURL=index.css.map */