overtype 2.3.0 → 2.3.1

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/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "overtype",
3
- "version": "2.3.0",
3
+ "version": "2.3.1",
4
4
  "description": "A lightweight markdown editor library with perfect WYSIWYG alignment using an invisible textarea overlay",
5
5
  "main": "dist/overtype.cjs",
6
6
  "module": "dist/overtype.esm.js",
package/src/styles.js CHANGED
@@ -722,17 +722,17 @@ export function generateStyles(options = {}) {
722
722
 
723
723
  .overtype-container[data-mode="preview"] .overtype-wrapper .overtype-preview h1 {
724
724
  font-size: 2em !important;
725
- color: var(--preview-h1, #222) !important;
725
+ color: var(--preview-h1, var(--preview-h1-default)) !important;
726
726
  }
727
727
 
728
728
  .overtype-container[data-mode="preview"] .overtype-wrapper .overtype-preview h2 {
729
729
  font-size: 1.5em !important;
730
- color: var(--preview-h2, #333) !important;
730
+ color: var(--preview-h2, var(--preview-h2-default)) !important;
731
731
  }
732
732
 
733
733
  .overtype-container[data-mode="preview"] .overtype-wrapper .overtype-preview h3 {
734
734
  font-size: 1.17em !important;
735
- color: var(--preview-h3, #444) !important;
735
+ color: var(--preview-h3, var(--preview-h3-default)) !important;
736
736
  }
737
737
 
738
738
  /* Lists - restore list styling in preview mode */
@@ -782,14 +782,14 @@ export function generateStyles(options = {}) {
782
782
  .overtype-container[data-mode="preview"] .overtype-wrapper .overtype-preview a {
783
783
  pointer-events: auto !important;
784
784
  cursor: pointer !important;
785
- color: var(--preview-link, #0066cc) !important;
785
+ color: var(--preview-link, var(--preview-link-default)) !important;
786
786
  text-decoration: underline !important;
787
787
  }
788
788
 
789
789
  /* Code blocks - proper pre/code styling in preview mode */
790
790
  .overtype-container[data-mode="preview"] .overtype-wrapper .overtype-preview pre.code-block {
791
- background: var(--preview-code-bg, rgba(135, 131, 120, 0.15)) !important;
792
- color: var(--preview-code, #333) !important;
791
+ background: var(--preview-code-bg, var(--preview-code-bg-default)) !important;
792
+ color: var(--preview-code, var(--preview-code-default)) !important;
793
793
  padding: 1.2em !important;
794
794
  border-radius: 3px !important;
795
795
  overflow-x: auto !important;
@@ -818,8 +818,8 @@ export function generateStyles(options = {}) {
818
818
  /* Blockquotes - enhanced styling in preview mode */
819
819
  .overtype-container[data-mode="preview"] .overtype-wrapper .overtype-preview .blockquote {
820
820
  display: block !important;
821
- border-left: 4px solid var(--preview-blockquote, #666) !important;
822
- color: var(--preview-blockquote, #666) !important;
821
+ border-left: 4px solid var(--preview-blockquote, var(--preview-blockquote-default)) !important;
822
+ color: var(--preview-blockquote, var(--preview-blockquote-default)) !important;
823
823
  padding-left: 1em !important;
824
824
  margin: 1em 0 !important;
825
825
  font-style: italic !important;
@@ -830,16 +830,16 @@ export function generateStyles(options = {}) {
830
830
  font-family: Georgia, 'Times New Roman', serif !important;
831
831
  font-size: 16px !important;
832
832
  line-height: 1.8 !important;
833
- color: var(--preview-text, #333) !important;
834
- background: var(--preview-bg, transparent) !important;
833
+ color: var(--preview-text, var(--preview-text-default)) !important;
834
+ background: var(--preview-bg, var(--preview-bg-default)) !important;
835
835
  }
836
836
 
837
837
  /* Inline code in preview mode - keep monospace */
838
838
  .overtype-container[data-mode="preview"] .overtype-wrapper .overtype-preview code {
839
839
  font-family: ${fontFamily} !important;
840
840
  font-size: 0.9em !important;
841
- background: var(--preview-code-bg, rgba(135, 131, 120, 0.15)) !important;
842
- color: var(--preview-code, #333) !important;
841
+ background: var(--preview-code-bg, var(--preview-code-bg-default)) !important;
842
+ color: var(--preview-code, var(--preview-code-default)) !important;
843
843
  padding: 0.2em 0.4em !important;
844
844
  border-radius: 3px !important;
845
845
  }
@@ -847,18 +847,18 @@ export function generateStyles(options = {}) {
847
847
  /* Strong and em elements in preview mode */
848
848
  .overtype-container[data-mode="preview"] .overtype-wrapper .overtype-preview strong {
849
849
  font-weight: 700 !important;
850
- color: var(--preview-strong, inherit) !important;
850
+ color: var(--preview-strong, var(--preview-strong-default)) !important;
851
851
  }
852
852
 
853
853
  .overtype-container[data-mode="preview"] .overtype-wrapper .overtype-preview em {
854
854
  font-style: italic !important;
855
- color: var(--preview-em, inherit) !important;
855
+ color: var(--preview-em, var(--preview-em-default)) !important;
856
856
  }
857
857
 
858
858
  /* HR in preview mode */
859
859
  .overtype-container[data-mode="preview"] .overtype-wrapper .overtype-preview .hr-marker {
860
860
  display: block !important;
861
- border-top: 2px solid var(--preview-hr, #ddd) !important;
861
+ border-top: 2px solid var(--preview-hr, var(--preview-hr-default)) !important;
862
862
  text-indent: -9999px !important;
863
863
  height: 2px !important;
864
864
  }
package/src/themes.js CHANGED
@@ -42,17 +42,17 @@ export const solar = {
42
42
  placeholder: '#999999', // Gray - placeholder text
43
43
  },
44
44
  previewColors: {
45
- text: '#1a1a1a',
46
- h1: '#1a1a1a',
47
- h2: '#2a2a2a',
48
- h3: '#3a3a3a',
45
+ text: '#0d3b66',
46
+ h1: 'inherit',
47
+ h2: 'inherit',
48
+ h3: 'inherit',
49
49
  strong: 'inherit',
50
50
  em: 'inherit',
51
- link: '#0066cc',
52
- code: '#1a1a1a',
53
- codeBg: 'rgba(135, 131, 120, 0.15)',
54
- blockquote: '#555',
55
- hr: '#ddd',
51
+ link: '#0d3b66',
52
+ code: '#0d3b66',
53
+ codeBg: 'rgba(244, 211, 94, 0.4)',
54
+ blockquote: '#5a7a9b',
55
+ hr: '#5a7a9b',
56
56
  bg: 'transparent',
57
57
  }
58
58
  };
@@ -97,16 +97,16 @@ export const cave = {
97
97
  },
98
98
  previewColors: {
99
99
  text: '#c5dde8',
100
- h1: '#e0e0e0',
101
- h2: '#d0d0d0',
102
- h3: '#c0c0c0',
100
+ h1: 'inherit',
101
+ h2: 'inherit',
102
+ h3: 'inherit',
103
103
  strong: 'inherit',
104
104
  em: 'inherit',
105
- link: '#6cb6e0',
105
+ link: '#9fcfec',
106
106
  code: '#c5dde8',
107
- codeBg: 'rgba(255, 255, 255, 0.08)',
108
- blockquote: '#9aa8b4',
109
- hr: 'rgba(255, 255, 255, 0.15)',
107
+ codeBg: '#1a232b',
108
+ blockquote: '#9fcfec',
109
+ hr: '#c5dde8',
110
110
  bg: 'transparent',
111
111
  }
112
112
  };
@@ -162,7 +162,7 @@ export function themeToCSSVars(colors, previewColors) {
162
162
  if (previewColors) {
163
163
  for (const [key, value] of Object.entries(previewColors)) {
164
164
  const varName = key.replace(/([A-Z])/g, '-$1').toLowerCase();
165
- vars.push(`--preview-${varName}: ${value};`);
165
+ vars.push(`--preview-${varName}-default: ${value};`);
166
166
  }
167
167
  }
168
168
  return vars.join('\n');