mjeditor/dist/mj-editor.css.map

A modern, plugin-extensible rich text editor for React with beautiful custom dialogs, notification system, and comprehensive editing features. Built with Slate.js for maximum flexibility.

{"version":3,"sources":["index.css","editor.css"],"names":[],"mappings":"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","file":"mj-editor.css","sourcesContent":["/* MJ Editor Styles */\n@import './editor.css'; ","/* MJEditor Main Styles - CKEditor Style */\n\n/* Editor Container */\n.mj-editor {\n  border: 1px solid #ccc;\n  border-radius: 4px;\n  background: #fff;\n  font-family: 'Lato', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;\n  line-height: 1.6;\n  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);\n}\n\n.mj-editor.light {\n  background: #fff;\n  color: #333;\n}\n\n.mj-editor.dark {\n  background: #2d3748;\n  color: #e2e8f0;\n  border-color: #4a5568;\n}\n\n/* CKEditor-style Toolbar */\n.mj-toolbar {\n  display: flex;\n  flex-wrap: wrap;\n  align-items: center;\n  gap: 1px;\n  padding: 4px;\n  border-bottom: 1px solid #e2e8f0;\n  background: #f8f9fa;\n  min-height: 40px;\n  border-radius: 4px 4px 0 0;\n}\n\n.mj-editor.dark .mj-toolbar {\n  background: #4a5568;\n  border-bottom-color: #718096;\n}\n\n.mj-toolbar-section {\n  display: flex;\n  align-items: center;\n  gap: 1px;\n  padding: 2px;\n  border-right: 1px solid #e2e8f0;\n  background: transparent;\n}\n\n.mj-editor.dark .mj-toolbar-section {\n  border-right-color: #718096;\n}\n\n.mj-toolbar-section:last-child {\n  border-right: none;\n}\n\n/* CKEditor-style Toolbar Buttons */\n.mj-toolbar-button {\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  width: 28px;\n  height: 28px;\n  border: 1px solid transparent;\n  border-radius: 3px;\n  background: transparent;\n  color: #4a5568;\n  font-size: 12px;\n  font-weight: 500;\n  cursor: pointer;\n  transition: all 0.15s ease;\n  position: relative;\n  min-width: 28px;\n}\n\n.mj-toolbar-button:hover {\n  background: #e2e8f0;\n  border-color: #cbd5e0;\n  color: #2d3748;\n}\n\n.mj-toolbar-button.active {\n  background: #3182ce;\n  color: white;\n  border-color: #3182ce;\n}\n\n.mj-toolbar-button:disabled {\n  opacity: 0.5;\n  cursor: not-allowed;\n}\n\n.mj-editor.dark .mj-toolbar-button {\n  color: #e2e8f0;\n}\n\n.mj-editor.dark .mj-toolbar-button:hover {\n  background: #718096;\n  border-color: #a0aec0;\n  color: #f7fafc;\n}\n\n.mj-editor.dark .mj-toolbar-button.active {\n  background: #4299e1;\n  border-color: #4299e1;\n}\n\n/* Button Icons */\n.button-icon {\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  font-weight: bold;\n  line-height: 1;\n}\n\n/* Dropdown Arrows */\n.dropdown-arrow {\n  font-size: 8px;\n  margin-left: 2px;\n  color: #48bb78;\n  font-weight: bold;\n}\n\n.mj-toolbar-button.active .dropdown-arrow {\n  color: white;\n}\n\n/* CKEditor-style Dropdowns */\n.mj-toolbar-dropdown-container {\n  position: relative;\n  display: flex;\n  align-items: center;\n}\n\n.mj-toolbar-dropdown {\n  padding: 4px 20px 4px 8px;\n  border: 1px solid #cbd5e0;\n  border-radius: 3px;\n  background: white;\n  color: #4a5568;\n  font-size: 12px;\n  font-weight: 500;\n  cursor: pointer;\n  appearance: none;\n  -webkit-appearance: none;\n  -moz-appearance: none;\n  background-image: url(\"data:image/svg+xml;charset=UTF-8,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%2348bb78' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3e%3cpolyline points='6,9 12,15 18,9'%3e%3c/polyline%3e%3c/svg%3e\");\n  background-repeat: no-repeat;\n  background-position: right 4px center;\n  background-size: 12px;\n  min-width: 60px;\n}\n\n.mj-toolbar-dropdown:hover {\n  border-color: #a0aec0;\n  background-color: #f7fafc;\n}\n\n.mj-toolbar-dropdown:focus {\n  outline: none;\n  border-color: #3182ce;\n  box-shadow: 0 0 0 2px rgba(49, 130, 206, 0.2);\n}\n\n.mj-editor.dark .mj-toolbar-dropdown {\n  background-color: #4a5568;\n  border-color: #718096;\n  color: #e2e8f0;\n}\n\n.mj-editor.dark .mj-toolbar-dropdown:hover {\n  background-color: #718096;\n  border-color: #a0aec0;\n}\n\n/* Dropdown Icons */\n.dropdown-icon {\n  position: absolute;\n  left: 6px;\n  top: 50%;\n  transform: translateY(-50%);\n  font-size: 12px;\n  font-weight: bold;\n  color: #4a5568;\n  pointer-events: none;\n}\n\n.mj-editor.dark .dropdown-icon {\n  color: #e2e8f0;\n}\n\n/* Color Picker */\n.mj-color-picker {\n  position: relative;\n  display: inline-block;\n}\n\n.mj-color-picker-button {\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  width: 28px;\n  height: 28px;\n  border: 1px solid #cbd5e0;\n  border-radius: 3px;\n  background: white;\n  color: #4a5568;\n  font-size: 12px;\n  font-weight: bold;\n  cursor: pointer;\n  transition: all 0.15s ease;\n  position: relative;\n}\n\n.mj-color-picker-button:hover {\n  border-color: #a0aec0;\n  background-color: #f7fafc;\n}\n\n.color-icon {\n  font-weight: bold;\n  line-height: 1;\n}\n\n.mj-color-picker-dropdown {\n  position: absolute;\n  top: 100%;\n  left: 0;\n  z-index: 1000;\n  display: grid;\n  grid-template-columns: repeat(8, 1fr);\n  gap: 2px;\n  padding: 8px;\n  background: white;\n  border: 1px solid #cbd5e0;\n  border-radius: 4px;\n  box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);\n  min-width: 200px;\n}\n\n.mj-color-option {\n  width: 20px;\n  height: 20px;\n  border: 1px solid #e2e8f0;\n  border-radius: 2px;\n  cursor: pointer;\n  transition: all 0.15s ease;\n}\n\n.mj-color-option:hover {\n  border-color: #3182ce;\n  transform: scale(1.1);\n}\n\n/* Editor Content Area */\n.mj-editor [data-slate-editor] {\n  padding: 16px;\n  min-height: 200px;\n  outline: none;\n  font-family: inherit;\n}\n\n.mj-editor [data-slate-editor] p {\n  margin: 0 0 8px 0;\n}\n\n.mj-editor [data-slate-editor] h1,\n.mj-editor [data-slate-editor] h2,\n.mj-editor [data-slate-editor] h3,\n.mj-editor [data-slate-editor] h4,\n.mj-editor [data-slate-editor] h5,\n.mj-editor [data-slate-editor] h6 {\n  margin: 16px 0 8px 0;\n  font-weight: 600;\n  line-height: 1.2;\n}\n\n.mj-editor [data-slate-editor] h1 { font-size: 2em; }\n.mj-editor [data-slate-editor] h2 { font-size: 1.5em; }\n.mj-editor [data-slate-editor] h3 { font-size: 1.25em; }\n.mj-editor [data-slate-editor] h4 { font-size: 1em; }\n.mj-editor [data-slate-editor] h5 { font-size: 0.875em; }\n.mj-editor [data-slate-editor] h6 { font-size: 0.85em; }\n\n.mj-editor [data-slate-editor] ul,\n.mj-editor [data-slate-editor] ol {\n  margin: 8px 0;\n  padding-left: 24px;\n}\n\n.mj-editor [data-slate-editor] li {\n  margin: 4px 0;\n}\n\n.mj-editor [data-slate-editor] blockquote {\n  margin: 16px 0;\n  padding: 8px 16px;\n  border-left: 4px solid #3182ce;\n  background: #f7fafc;\n  font-style: italic;\n}\n\n.mj-editor [data-slate-editor] pre {\n  margin: 16px 0;\n  padding: 12px;\n  background: #f7fafc;\n  border: 1px solid #e2e8f0;\n  border-radius: 4px;\n  overflow-x: auto;\n  font-family: 'Monaco', 'Menlo', 'Ubuntu Mono', monospace;\n  font-size: 0.875em;\n  line-height: 1.5;\n}\n\n.mj-editor.dark [data-slate-editor] pre {\n  background: #2d3748;\n  border-color: #4a5568;\n  color: #e2e8f0;\n}\n\n.mj-editor [data-slate-editor] code {\n  padding: 2px 4px;\n  background: #f7fafc;\n  border: 1px solid #e2e8f0;\n  border-radius: 3px;\n  font-family: 'Monaco', 'Menlo', 'Ubuntu Mono', monospace;\n  font-size: 0.875em;\n}\n\n.mj-editor.dark [data-slate-editor] code {\n  background: #2d3748;\n  border-color: #4a5568;\n  color: #e2e8f0;\n}\n\n.mj-editor [data-slate-editor] a {\n  color: #3182ce;\n  text-decoration: underline;\n}\n\n.mj-editor [data-slate-editor] a:hover {\n  color: #2c5282;\n}\n\n.mj-editor.dark [data-slate-editor] a {\n  color: #63b3ed;\n}\n\n.mj-editor.dark [data-slate-editor] a:hover {\n  color: #90cdf4;\n}\n\n.mj-editor [data-slate-editor] img {\n  max-width: 100%;\n  height: auto;\n  border-radius: 4px;\n  margin: 8px 0;\n}\n\n.mj-editor [data-slate-editor] table {\n  border-collapse: collapse;\n  width: 100%;\n  margin: 16px 0;\n}\n\n.mj-editor [data-slate-editor] th,\n.mj-editor [data-slate-editor] td {\n  border: 1px solid #e2e8f0;\n  padding: 8px 12px;\n  text-align: left;\n}\n\n.mj-editor [data-slate-editor] th {\n  background: #f7fafc;\n  font-weight: 600;\n}\n\n.mj-editor.dark [data-slate-editor] th,\n.mj-editor.dark [data-slate-editor] td {\n  border-color: #4a5568;\n}\n\n.mj-editor.dark [data-slate-editor] th {\n  background: #4a5568;\n}\n\n/* Placeholder */\n.mj-editor [data-slate-placeholder] {\n  position: absolute;\n  pointer-events: none;\n  color: #a0aec0;\n  font-style: italic;\n  font-size: 0.875em;\n}\n\n.mj-editor.dark [data-slate-placeholder] {\n  color: #718096;\n}\n\n/* Focus States */\n.mj-editor:focus-within {\n  border-color: #3182ce;\n  box-shadow: 0 0 0 2px rgba(49, 130, 206, 0.2);\n}\n\n.mj-editor.dark:focus-within {\n  border-color: #4299e1;\n  box-shadow: 0 0 0 2px rgba(66, 153, 225, 0.2);\n}\n\n/* Accessibility */\n.mj-toolbar-button:focus,\n.mj-toolbar-dropdown:focus,\n.mj-color-picker-button:focus {\n  outline: 2px solid #3182ce;\n  outline-offset: 2px;\n}\n\n.mj-editor.dark .mj-toolbar-button:focus,\n.mj-editor.dark .mj-toolbar-dropdown:focus,\n.mj-editor.dark .mj-color-picker-button:focus {\n  outline-color: #4299e1;\n}\n\n/* Responsive Design */\n@media (max-width: 768px) {\n  .mj-toolbar {\n    flex-direction: column;\n    align-items: stretch;\n    gap: 4px;\n  }\n  \n  .mj-toolbar-section {\n    border-right: none;\n    border-bottom: 1px solid #e2e8f0;\n    padding: 4px;\n    justify-content: center;\n  }\n  \n  .mj-toolbar-section:last-child {\n    border-bottom: none;\n  }\n  \n  .mj-toolbar-button {\n    width: 32px;\n    height: 32px;\n  }\n  \n  .mj-toolbar-dropdown {\n    min-width: 80px;\n  }\n}\n\n/* Print Styles */\n@media print {\n  .mj-toolbar {\n    display: none !important;\n  }\n  \n  .mj-editor {\n    border: none !important;\n    box-shadow: none !important;\n  }\n} "]}