@crashbytes/contentful-richtext-editor 1.0.5 → 1.0.7
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/README.md +10 -10
- package/dist/components/ContentfulEditor.d.ts +2 -0
- package/dist/index.css +1 -1
- package/dist/index.d.ts +43 -1
- package/dist/index.esm.css +1 -1
- package/dist/index.esm.js +1206 -221
- package/dist/index.esm.js.map +1 -1
- package/dist/index.js +1216 -219
- package/dist/index.js.map +1 -1
- package/dist/utils/contentfulTransform.d.ts +14 -6
- package/package.json +2 -2
package/README.md
CHANGED
|
@@ -24,13 +24,13 @@ A modern, Tiptap-based rich text editor that's fully compatible with Contentful'
|
|
|
24
24
|
|
|
25
25
|
## Installation
|
|
26
26
|
|
|
27
|
-
```
|
|
27
|
+
```bash
|
|
28
28
|
npm install @crashbytes/contentful-richtext-editor
|
|
29
29
|
```
|
|
30
30
|
|
|
31
31
|
## Basic Usage
|
|
32
32
|
|
|
33
|
-
```
|
|
33
|
+
```jsx
|
|
34
34
|
import React, { useState } from 'react';
|
|
35
35
|
import { ContentfulRichTextEditor } from '@crashbytes/contentful-richtext-editor';
|
|
36
36
|
import '@crashbytes/contentful-richtext-editor/dist/index.css';
|
|
@@ -63,7 +63,7 @@ export default App;
|
|
|
63
63
|
|
|
64
64
|
### With Contentful Entry/Asset Embedding
|
|
65
65
|
|
|
66
|
-
```
|
|
66
|
+
```jsx
|
|
67
67
|
import { ContentfulRichTextEditor } from '@crashbytes/contentful-richtext-editor';
|
|
68
68
|
import '@crashbytes/contentful-richtext-editor/dist/index.css';
|
|
69
69
|
|
|
@@ -94,7 +94,7 @@ function ContentfulEditor() {
|
|
|
94
94
|
|
|
95
95
|
### Customizing Features
|
|
96
96
|
|
|
97
|
-
```
|
|
97
|
+
```jsx
|
|
98
98
|
<ContentfulRichTextEditor
|
|
99
99
|
placeholder="Simple editor..."
|
|
100
100
|
disabledFeatures={['table', 'embed', 'quote']}
|
|
@@ -106,7 +106,7 @@ function ContentfulEditor() {
|
|
|
106
106
|
|
|
107
107
|
### Controlling Available Headings and Formatting
|
|
108
108
|
|
|
109
|
-
```
|
|
109
|
+
```jsx
|
|
110
110
|
<ContentfulRichTextEditor
|
|
111
111
|
placeholder="Limited editor..."
|
|
112
112
|
availableHeadings={[1, 2, 3]} // Only H1, H2, H3
|
|
@@ -117,7 +117,7 @@ function ContentfulEditor() {
|
|
|
117
117
|
|
|
118
118
|
### With Initial Content
|
|
119
119
|
|
|
120
|
-
```
|
|
120
|
+
```jsx
|
|
121
121
|
import { createEmptyDocument } from '@crashbytes/contentful-richtext-editor';
|
|
122
122
|
|
|
123
123
|
const initialContent = {
|
|
@@ -179,7 +179,7 @@ You can disable specific features by passing them in the `disabledFeatures` arra
|
|
|
179
179
|
|
|
180
180
|
### Utility Functions
|
|
181
181
|
|
|
182
|
-
```
|
|
182
|
+
```jsx
|
|
183
183
|
import {
|
|
184
184
|
contentfulToTiptap,
|
|
185
185
|
tiptapToContentful,
|
|
@@ -202,7 +202,7 @@ const emptyDoc = createEmptyDocument();
|
|
|
202
202
|
|
|
203
203
|
The editor comes with default styles that match Contentful's design. Import the CSS:
|
|
204
204
|
|
|
205
|
-
```
|
|
205
|
+
```jsx
|
|
206
206
|
import '@crashbytes/contentful-richtext-editor/dist/index.css';
|
|
207
207
|
```
|
|
208
208
|
|
|
@@ -237,7 +237,7 @@ Standard rich text editor appearance with serif fonts.
|
|
|
237
237
|
|
|
238
238
|
## Integration with Next.js
|
|
239
239
|
|
|
240
|
-
```
|
|
240
|
+
```jsx
|
|
241
241
|
// pages/editor.tsx or app/editor/page.tsx
|
|
242
242
|
import dynamic from 'next/dynamic';
|
|
243
243
|
|
|
@@ -262,7 +262,7 @@ export default function EditorPage() {
|
|
|
262
262
|
|
|
263
263
|
This package is written in TypeScript and includes full type definitions. All Contentful rich text types are re-exported for convenience:
|
|
264
264
|
|
|
265
|
-
```
|
|
265
|
+
```tsx
|
|
266
266
|
import type {
|
|
267
267
|
Document,
|
|
268
268
|
Block,
|
|
@@ -24,6 +24,8 @@ export interface ContentfulRichTextEditorProps {
|
|
|
24
24
|
availableHeadings?: Array<1 | 2 | 3 | 4 | 5 | 6>;
|
|
25
25
|
/** Which text formatting marks to make available */
|
|
26
26
|
availableMarks?: Array<'bold' | 'italic' | 'underline'>;
|
|
27
|
+
/** Enable debug logging for troubleshooting */
|
|
28
|
+
debug?: boolean;
|
|
27
29
|
}
|
|
28
30
|
export declare const ContentfulRichTextEditor: React.FC<ContentfulRichTextEditorProps>;
|
|
29
31
|
export default ContentfulRichTextEditor;
|
package/dist/index.css
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
.contentful-editor{background:#fff;border:1px solid #d3dce6;border-radius:6px;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Helvetica,Arial,sans-serif}.contentful-editor--loading{align-items:center;color:#68737d;display:flex;justify-content:center;min-height:200px}.contentful-toolbar{background:#f7f9fa;border-bottom:1px solid #d3dce6;border-radius:6px 6px 0 0;padding:8px 12px}.contentful-toolbar,.contentful-toolbar__group{align-items:center;display:flex;gap:4px}.contentful-toolbar__group--right{margin-left:auto}.contentful-toolbar__separator{background:#d3dce6;height:24px;margin:0 8px;width:1px}.contentful-toolbar__select{background:#fff;border:1px solid #d3dce6;border-radius:4px;font-size:14px;min-width:120px;padding:4px 8px}.contentful-toolbar__select:focus{border-color:#2e75d4;box-shadow:0 0 0 2px rgba(46,117,212,.2);outline:none}.contentful-toolbar__button{align-items:center;background:transparent;border:1px solid transparent;border-radius:4px;cursor:pointer;display:flex;font-size:14px;height:32px;justify-content:center;line-height:1;min-width:32px;padding:6px 8px}.contentful-toolbar__button:hover{background:#e5ebed;border-color:#d3dce6}.contentful-toolbar__button:disabled{cursor:not-allowed;opacity:.5}.contentful-toolbar__button--active{background:#2e75d4;border-color:#2e75d4;color:#fff}.contentful-toolbar__button--active:hover{background:#1e5aa8;border-color:#1e5aa8}.contentful-toolbar__link-input{align-items:center;display:flex;gap:4px;margin-left:8px}.contentful-toolbar__link-input input{
|
|
1
|
+
.contentful-editor{background:#fff;border:1px solid #d3dce6;border-radius:6px;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Helvetica,Arial,sans-serif;overflow:hidden;position:relative}.contentful-editor--loading{align-items:center;background:#f7f9fa;color:#68737d;display:flex;font-size:14px;justify-content:center;min-height:200px}.contentful-editor__loading{align-items:center;display:flex;gap:8px}.contentful-editor__loading:before{animation:contentful-spin 1s linear infinite;border:2px solid #d3dce6;border-radius:50%;border-top-color:#2e75d4;content:"";height:16px;width:16px}@keyframes contentful-spin{0%{transform:rotate(0deg)}to{transform:rotate(1turn)}}.contentful-editor__error{background:#fff2f0;border:1px solid #ffccc7;border-left:4px solid #ff4d4f;border-radius:6px 6px 0 0;color:#cf1322;font-size:14px;line-height:1.4;margin-bottom:0;padding:12px 16px}.contentful-editor__error strong{color:#a8071a;font-weight:600}.contentful-editor--error{border-color:#ff7875}.contentful-toolbar{background:#f7f9fa;border-bottom:1px solid #d3dce6;border-radius:6px 6px 0 0;flex-wrap:wrap;min-height:48px;padding:8px 12px}.contentful-toolbar,.contentful-toolbar__group{align-items:center;display:flex;gap:4px}.contentful-toolbar__group--right{margin-left:auto}.contentful-toolbar__separator{background:#d3dce6;flex-shrink:0;height:24px;margin:0 8px;width:1px}.contentful-toolbar__select{background:#fff;border:1px solid #d3dce6;border-radius:4px;cursor:pointer;font-size:14px;height:32px;min-width:120px;padding:4px 8px;transition:all .2s ease}.contentful-toolbar__select:focus{border-color:#2e75d4;box-shadow:0 0 0 2px rgba(46,117,212,.2);outline:none}.contentful-toolbar__select:hover{border-color:#1e5aa8}.contentful-toolbar__button{align-items:center;background:transparent;border:1px solid transparent;border-radius:4px;cursor:pointer;display:flex;font-size:14px;height:32px;justify-content:center;line-height:1;min-width:32px;padding:6px 8px;position:relative;transition:all .15s ease}.contentful-toolbar__button:hover{background:#e5ebed;border-color:#d3dce6;transform:translateY(-1px)}.contentful-toolbar__button:active{transform:translateY(0)}.contentful-toolbar__button:disabled{cursor:not-allowed;opacity:.5;transform:none!important}.contentful-toolbar__button:disabled:hover{background:transparent;border-color:transparent}.contentful-toolbar__button--active{background:#2e75d4;border-color:#2e75d4;box-shadow:0 2px 4px rgba(46,117,212,.3);color:#fff}.contentful-toolbar__button--active:hover{background:#1e5aa8;border-color:#1e5aa8;transform:translateY(-1px)}.contentful-toolbar__link-input{align-items:center;background:#fff;border:1px solid #d3dce6;border-radius:6px;box-shadow:0 2px 8px rgba(0,0,0,.1);display:flex;gap:4px;margin-left:8px;padding:4px}.contentful-toolbar__link-input input{background:transparent;border:none;font-size:14px;outline:none;padding:6px 8px;width:200px}.contentful-toolbar__link-input input:focus{background:#f7f9fa}.contentful-toolbar__link-input button{align-items:center;background:#fff;border:1px solid #d3dce6;border-radius:4px;cursor:pointer;display:flex;font-size:12px;font-weight:500;height:24px;justify-content:center;min-width:24px;padding:4px 8px;transition:all .15s ease}.contentful-toolbar__link-input button:hover{background:#f7f9fa;border-color:#2e75d4}.contentful-toolbar__embed-dropdown{position:relative}.contentful-toolbar__embed-button{align-items:center;background:#2e75d4;border:1px solid #2e75d4;border-radius:4px;color:#fff;cursor:pointer;display:flex;font-size:14px;font-weight:500;gap:4px;height:32px;padding:6px 12px;transition:all .15s ease}.contentful-toolbar__embed-button:hover{background:#1e5aa8;border-color:#1e5aa8;box-shadow:0 2px 8px rgba(46,117,212,.3);transform:translateY(-1px)}.contentful-toolbar__embed-dropdown:hover .contentful-toolbar__embed-menu{animation:contentful-fade-in .15s ease;display:block}@keyframes contentful-fade-in{0%{opacity:0;transform:translateY(-4px)}to{opacity:1;transform:translateY(0)}}.contentful-toolbar__embed-menu{background:#fff;border:1px solid #d3dce6;border-radius:6px;box-shadow:0 4px 12px rgba(0,0,0,.15);display:none;min-width:140px;overflow:hidden;position:absolute;right:0;top:calc(100% + 4px);z-index:100}.contentful-toolbar__embed-option{background:none;border:none;color:#2c3e50;cursor:pointer;display:block;font-size:14px;font-weight:500;padding:12px 16px;text-align:left;transition:background-color .15s ease;width:100%}.contentful-toolbar__embed-option:hover{background:#f7f9fa;color:#2e75d4}.contentful-toolbar__embed-option:first-child{border-radius:6px 6px 0 0}.contentful-toolbar__embed-option:last-child{border-radius:0 0 6px 6px}.contentful-editor__content-wrapper{background:#fff;position:relative}.contentful-editor__content{min-height:200px}.contentful-editor-content{color:#2c3e50;font-size:16px;line-height:1.6;min-height:200px;outline:none;padding:16px}.contentful-editor-content:empty:before{color:#68737d;content:attr(data-placeholder);font-style:italic;pointer-events:none}.contentful-editor-content h1,.contentful-editor-content h2,.contentful-editor-content h3,.contentful-editor-content h4,.contentful-editor-content h5,.contentful-editor-content h6{color:#1a202c;font-weight:600;line-height:1.2;margin:1.5em 0 .75em}.contentful-editor-content h1:first-child,.contentful-editor-content h2:first-child,.contentful-editor-content h3:first-child,.contentful-editor-content h4:first-child,.contentful-editor-content h5:first-child,.contentful-editor-content h6:first-child{margin-top:0}.contentful-editor-content h1{font-size:2em}.contentful-editor-content h2{font-size:1.5em}.contentful-editor-content h3{font-size:1.25em}.contentful-editor-content h4,.contentful-editor-content h5,.contentful-editor-content h6{font-size:1em}.contentful-editor-content p{margin:0 0 1em}.contentful-editor-content p:last-child{margin-bottom:0}.contentful-bullet-list,.contentful-ordered-list{margin:1em 0;padding-left:1.5em}.contentful-bullet-list li,.contentful-ordered-list li{line-height:1.5;margin:.5em 0}.contentful-bullet-list li::marker{color:#2e75d4}.contentful-ordered-list li::marker{color:#2e75d4;font-weight:600}.contentful-blockquote{background:#f7f9fa;border-left:4px solid #2e75d4;border-radius:0 4px 4px 0;color:#68737d;font-style:italic;margin:1.5em 0;padding:1em 0 1em 1.5em;position:relative}.contentful-blockquote:before{color:#2e75d4;content:'"';font-size:3em;left:8px;line-height:1;opacity:.3;position:absolute;top:-8px}.contentful-link{border-bottom:1px solid transparent;color:#2e75d4;text-decoration:none;transition:all .15s ease}.contentful-link:hover{border-bottom-color:#1e5aa8;color:#1e5aa8}.contentful-link:focus{border-radius:2px;outline:2px solid #2e75d4;outline-offset:2px}.contentful-table{border:1px solid #d3dce6;border-collapse:collapse;border-radius:6px;box-shadow:0 1px 3px rgba(0,0,0,.1);margin:1.5em 0;overflow:hidden;width:100%}.contentful-table-cell,.contentful-table-header{border:1px solid #d3dce6;padding:12px 16px;text-align:left;vertical-align:top}.contentful-table-header{background:#f7f9fa;border-bottom:2px solid #d3dce6;color:#1a202c;font-weight:600}.contentful-table-cell{background:#fff}.contentful-table tbody tr:nth-child(2n) .contentful-table-cell{background:#fafbfc}.contentful-table tbody tr:hover .contentful-table-cell{background:#f0f6ff}.contentful-editor--minimal{border:none;border-radius:0;box-shadow:none}.contentful-editor--minimal .contentful-toolbar{background:#fff;border-bottom:1px solid #e1e8ed;border-radius:0}.contentful-editor--minimal .contentful-editor__error{border-radius:0}.contentful-editor--default .contentful-editor-content,.contentful-editor--default .contentful-editor-content h1,.contentful-editor--default .contentful-editor-content h2,.contentful-editor--default .contentful-editor-content h3,.contentful-editor--default .contentful-editor-content h4,.contentful-editor--default .contentful-editor-content h5,.contentful-editor--default .contentful-editor-content h6{font-family:Georgia,Times New Roman,serif}.contentful-editor:focus-within{border-color:#2e75d4;box-shadow:0 0 0 2px rgba(46,117,212,.2)}.contentful-editor--error:focus-within{border-color:#ff4d4f;box-shadow:0 0 0 2px rgba(255,77,79,.2)}@media (max-width:768px){.contentful-toolbar{flex-wrap:wrap;gap:8px;padding:12px}.contentful-toolbar__select{flex:1;min-width:100px}.contentful-toolbar__separator{display:none}.contentful-toolbar__group{flex-wrap:wrap}.contentful-editor-content{font-size:14px;padding:12px}.contentful-toolbar__link-input{align-items:stretch;flex-direction:column;gap:8px;margin-left:0;margin-top:8px;width:100%}.contentful-toolbar__link-input input{width:100%}.contentful-table{font-size:14px}.contentful-table-cell,.contentful-table-header{padding:8px 12px}}@media (max-width:480px){.contentful-editor-content{font-size:14px;padding:8px}.contentful-toolbar{padding:8px}.contentful-toolbar__button{font-size:12px;height:28px;min-width:28px;padding:4px 6px}.contentful-blockquote{margin:1em 0;padding:.75em 0 .75em 1em}}
|
package/dist/index.d.ts
CHANGED
|
@@ -1,5 +1,47 @@
|
|
|
1
1
|
export { ContentfulRichTextEditor } from './components/ContentfulEditor';
|
|
2
2
|
export type { ContentfulRichTextEditorProps } from './components/ContentfulEditor';
|
|
3
3
|
export { ContentfulToolbar } from './components/Toolbar';
|
|
4
|
-
export { contentfulToTiptap, tiptapToContentful, validateContentfulDocument, createEmptyDocument } from './utils/contentfulTransform';
|
|
4
|
+
export { contentfulToTiptap, tiptapToContentful, safeContentfulToTiptap, validateContentfulDocument, createEmptyDocument, createEmptyTiptapDocument } from './utils/contentfulTransform';
|
|
5
5
|
export type { ContentfulEditorTheme } from './utils/types';
|
|
6
|
+
export type { EmbeddedEntry as EmbeddedEntryType, EmbeddedAsset as EmbeddedAssetType } from './utils/types';
|
|
7
|
+
export { ContentfulDocument } from './components/ContentfulDocument';
|
|
8
|
+
export { EmbeddedEntry as EmbeddedEntryComponent, EmbeddedAsset as EmbeddedAssetComponent } from './components/ContentfulEmbedded';
|
|
9
|
+
export declare const ContentfulEditorVersion = "1.0.7-optimized";
|
|
10
|
+
export declare const SupportedContentfulVersion = "^16.0.0";
|
|
11
|
+
export declare const SupportedTiptapVersion = "^2.0.0";
|
|
12
|
+
/**
|
|
13
|
+
* Professional debugging utility for development environments
|
|
14
|
+
* Enables comprehensive error tracking and performance monitoring
|
|
15
|
+
*/
|
|
16
|
+
export declare const enableDebugMode: (enabled?: boolean) => void;
|
|
17
|
+
/**
|
|
18
|
+
* Strategic compatibility checker for production deployments
|
|
19
|
+
* Validates environment requirements and dependency versions
|
|
20
|
+
*/
|
|
21
|
+
export declare const validateEnvironment: () => boolean;
|
|
22
|
+
/**
|
|
23
|
+
* Production-grade initialization helper
|
|
24
|
+
* Streamlines editor setup for enterprise deployments
|
|
25
|
+
*/
|
|
26
|
+
export declare const initializeContentfulEditor: (config?: {
|
|
27
|
+
debug?: boolean;
|
|
28
|
+
validateEnv?: boolean;
|
|
29
|
+
}) => {
|
|
30
|
+
version: string;
|
|
31
|
+
ready: boolean;
|
|
32
|
+
timestamp: string;
|
|
33
|
+
};
|
|
34
|
+
export type { Document, Block, Inline, Text, BLOCKS, MARKS, INLINES } from '@contentful/rich-text-types';
|
|
35
|
+
export declare const utils: {
|
|
36
|
+
readonly validateEnvironment: () => boolean;
|
|
37
|
+
readonly enableDebugMode: (enabled?: boolean) => void;
|
|
38
|
+
readonly initializeContentfulEditor: (config?: {
|
|
39
|
+
debug?: boolean;
|
|
40
|
+
validateEnv?: boolean;
|
|
41
|
+
}) => {
|
|
42
|
+
version: string;
|
|
43
|
+
ready: boolean;
|
|
44
|
+
timestamp: string;
|
|
45
|
+
};
|
|
46
|
+
readonly version: "1.0.7-optimized";
|
|
47
|
+
};
|
package/dist/index.esm.css
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
.contentful-editor{background:#fff;border:1px solid #d3dce6;border-radius:6px;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Helvetica,Arial,sans-serif}.contentful-editor--loading{align-items:center;color:#68737d;display:flex;justify-content:center;min-height:200px}.contentful-toolbar{background:#f7f9fa;border-bottom:1px solid #d3dce6;border-radius:6px 6px 0 0;padding:8px 12px}.contentful-toolbar,.contentful-toolbar__group{align-items:center;display:flex;gap:4px}.contentful-toolbar__group--right{margin-left:auto}.contentful-toolbar__separator{background:#d3dce6;height:24px;margin:0 8px;width:1px}.contentful-toolbar__select{background:#fff;border:1px solid #d3dce6;border-radius:4px;font-size:14px;min-width:120px;padding:4px 8px}.contentful-toolbar__select:focus{border-color:#2e75d4;box-shadow:0 0 0 2px rgba(46,117,212,.2);outline:none}.contentful-toolbar__button{align-items:center;background:transparent;border:1px solid transparent;border-radius:4px;cursor:pointer;display:flex;font-size:14px;height:32px;justify-content:center;line-height:1;min-width:32px;padding:6px 8px}.contentful-toolbar__button:hover{background:#e5ebed;border-color:#d3dce6}.contentful-toolbar__button:disabled{cursor:not-allowed;opacity:.5}.contentful-toolbar__button--active{background:#2e75d4;border-color:#2e75d4;color:#fff}.contentful-toolbar__button--active:hover{background:#1e5aa8;border-color:#1e5aa8}.contentful-toolbar__link-input{align-items:center;display:flex;gap:4px;margin-left:8px}.contentful-toolbar__link-input input{
|
|
1
|
+
.contentful-editor{background:#fff;border:1px solid #d3dce6;border-radius:6px;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Helvetica,Arial,sans-serif;overflow:hidden;position:relative}.contentful-editor--loading{align-items:center;background:#f7f9fa;color:#68737d;display:flex;font-size:14px;justify-content:center;min-height:200px}.contentful-editor__loading{align-items:center;display:flex;gap:8px}.contentful-editor__loading:before{animation:contentful-spin 1s linear infinite;border:2px solid #d3dce6;border-radius:50%;border-top-color:#2e75d4;content:"";height:16px;width:16px}@keyframes contentful-spin{0%{transform:rotate(0deg)}to{transform:rotate(1turn)}}.contentful-editor__error{background:#fff2f0;border:1px solid #ffccc7;border-left:4px solid #ff4d4f;border-radius:6px 6px 0 0;color:#cf1322;font-size:14px;line-height:1.4;margin-bottom:0;padding:12px 16px}.contentful-editor__error strong{color:#a8071a;font-weight:600}.contentful-editor--error{border-color:#ff7875}.contentful-toolbar{background:#f7f9fa;border-bottom:1px solid #d3dce6;border-radius:6px 6px 0 0;flex-wrap:wrap;min-height:48px;padding:8px 12px}.contentful-toolbar,.contentful-toolbar__group{align-items:center;display:flex;gap:4px}.contentful-toolbar__group--right{margin-left:auto}.contentful-toolbar__separator{background:#d3dce6;flex-shrink:0;height:24px;margin:0 8px;width:1px}.contentful-toolbar__select{background:#fff;border:1px solid #d3dce6;border-radius:4px;cursor:pointer;font-size:14px;height:32px;min-width:120px;padding:4px 8px;transition:all .2s ease}.contentful-toolbar__select:focus{border-color:#2e75d4;box-shadow:0 0 0 2px rgba(46,117,212,.2);outline:none}.contentful-toolbar__select:hover{border-color:#1e5aa8}.contentful-toolbar__button{align-items:center;background:transparent;border:1px solid transparent;border-radius:4px;cursor:pointer;display:flex;font-size:14px;height:32px;justify-content:center;line-height:1;min-width:32px;padding:6px 8px;position:relative;transition:all .15s ease}.contentful-toolbar__button:hover{background:#e5ebed;border-color:#d3dce6;transform:translateY(-1px)}.contentful-toolbar__button:active{transform:translateY(0)}.contentful-toolbar__button:disabled{cursor:not-allowed;opacity:.5;transform:none!important}.contentful-toolbar__button:disabled:hover{background:transparent;border-color:transparent}.contentful-toolbar__button--active{background:#2e75d4;border-color:#2e75d4;box-shadow:0 2px 4px rgba(46,117,212,.3);color:#fff}.contentful-toolbar__button--active:hover{background:#1e5aa8;border-color:#1e5aa8;transform:translateY(-1px)}.contentful-toolbar__link-input{align-items:center;background:#fff;border:1px solid #d3dce6;border-radius:6px;box-shadow:0 2px 8px rgba(0,0,0,.1);display:flex;gap:4px;margin-left:8px;padding:4px}.contentful-toolbar__link-input input{background:transparent;border:none;font-size:14px;outline:none;padding:6px 8px;width:200px}.contentful-toolbar__link-input input:focus{background:#f7f9fa}.contentful-toolbar__link-input button{align-items:center;background:#fff;border:1px solid #d3dce6;border-radius:4px;cursor:pointer;display:flex;font-size:12px;font-weight:500;height:24px;justify-content:center;min-width:24px;padding:4px 8px;transition:all .15s ease}.contentful-toolbar__link-input button:hover{background:#f7f9fa;border-color:#2e75d4}.contentful-toolbar__embed-dropdown{position:relative}.contentful-toolbar__embed-button{align-items:center;background:#2e75d4;border:1px solid #2e75d4;border-radius:4px;color:#fff;cursor:pointer;display:flex;font-size:14px;font-weight:500;gap:4px;height:32px;padding:6px 12px;transition:all .15s ease}.contentful-toolbar__embed-button:hover{background:#1e5aa8;border-color:#1e5aa8;box-shadow:0 2px 8px rgba(46,117,212,.3);transform:translateY(-1px)}.contentful-toolbar__embed-dropdown:hover .contentful-toolbar__embed-menu{animation:contentful-fade-in .15s ease;display:block}@keyframes contentful-fade-in{0%{opacity:0;transform:translateY(-4px)}to{opacity:1;transform:translateY(0)}}.contentful-toolbar__embed-menu{background:#fff;border:1px solid #d3dce6;border-radius:6px;box-shadow:0 4px 12px rgba(0,0,0,.15);display:none;min-width:140px;overflow:hidden;position:absolute;right:0;top:calc(100% + 4px);z-index:100}.contentful-toolbar__embed-option{background:none;border:none;color:#2c3e50;cursor:pointer;display:block;font-size:14px;font-weight:500;padding:12px 16px;text-align:left;transition:background-color .15s ease;width:100%}.contentful-toolbar__embed-option:hover{background:#f7f9fa;color:#2e75d4}.contentful-toolbar__embed-option:first-child{border-radius:6px 6px 0 0}.contentful-toolbar__embed-option:last-child{border-radius:0 0 6px 6px}.contentful-editor__content-wrapper{background:#fff;position:relative}.contentful-editor__content{min-height:200px}.contentful-editor-content{color:#2c3e50;font-size:16px;line-height:1.6;min-height:200px;outline:none;padding:16px}.contentful-editor-content:empty:before{color:#68737d;content:attr(data-placeholder);font-style:italic;pointer-events:none}.contentful-editor-content h1,.contentful-editor-content h2,.contentful-editor-content h3,.contentful-editor-content h4,.contentful-editor-content h5,.contentful-editor-content h6{color:#1a202c;font-weight:600;line-height:1.2;margin:1.5em 0 .75em}.contentful-editor-content h1:first-child,.contentful-editor-content h2:first-child,.contentful-editor-content h3:first-child,.contentful-editor-content h4:first-child,.contentful-editor-content h5:first-child,.contentful-editor-content h6:first-child{margin-top:0}.contentful-editor-content h1{font-size:2em}.contentful-editor-content h2{font-size:1.5em}.contentful-editor-content h3{font-size:1.25em}.contentful-editor-content h4,.contentful-editor-content h5,.contentful-editor-content h6{font-size:1em}.contentful-editor-content p{margin:0 0 1em}.contentful-editor-content p:last-child{margin-bottom:0}.contentful-bullet-list,.contentful-ordered-list{margin:1em 0;padding-left:1.5em}.contentful-bullet-list li,.contentful-ordered-list li{line-height:1.5;margin:.5em 0}.contentful-bullet-list li::marker{color:#2e75d4}.contentful-ordered-list li::marker{color:#2e75d4;font-weight:600}.contentful-blockquote{background:#f7f9fa;border-left:4px solid #2e75d4;border-radius:0 4px 4px 0;color:#68737d;font-style:italic;margin:1.5em 0;padding:1em 0 1em 1.5em;position:relative}.contentful-blockquote:before{color:#2e75d4;content:'"';font-size:3em;left:8px;line-height:1;opacity:.3;position:absolute;top:-8px}.contentful-link{border-bottom:1px solid transparent;color:#2e75d4;text-decoration:none;transition:all .15s ease}.contentful-link:hover{border-bottom-color:#1e5aa8;color:#1e5aa8}.contentful-link:focus{border-radius:2px;outline:2px solid #2e75d4;outline-offset:2px}.contentful-table{border:1px solid #d3dce6;border-collapse:collapse;border-radius:6px;box-shadow:0 1px 3px rgba(0,0,0,.1);margin:1.5em 0;overflow:hidden;width:100%}.contentful-table-cell,.contentful-table-header{border:1px solid #d3dce6;padding:12px 16px;text-align:left;vertical-align:top}.contentful-table-header{background:#f7f9fa;border-bottom:2px solid #d3dce6;color:#1a202c;font-weight:600}.contentful-table-cell{background:#fff}.contentful-table tbody tr:nth-child(2n) .contentful-table-cell{background:#fafbfc}.contentful-table tbody tr:hover .contentful-table-cell{background:#f0f6ff}.contentful-editor--minimal{border:none;border-radius:0;box-shadow:none}.contentful-editor--minimal .contentful-toolbar{background:#fff;border-bottom:1px solid #e1e8ed;border-radius:0}.contentful-editor--minimal .contentful-editor__error{border-radius:0}.contentful-editor--default .contentful-editor-content,.contentful-editor--default .contentful-editor-content h1,.contentful-editor--default .contentful-editor-content h2,.contentful-editor--default .contentful-editor-content h3,.contentful-editor--default .contentful-editor-content h4,.contentful-editor--default .contentful-editor-content h5,.contentful-editor--default .contentful-editor-content h6{font-family:Georgia,Times New Roman,serif}.contentful-editor:focus-within{border-color:#2e75d4;box-shadow:0 0 0 2px rgba(46,117,212,.2)}.contentful-editor--error:focus-within{border-color:#ff4d4f;box-shadow:0 0 0 2px rgba(255,77,79,.2)}@media (max-width:768px){.contentful-toolbar{flex-wrap:wrap;gap:8px;padding:12px}.contentful-toolbar__select{flex:1;min-width:100px}.contentful-toolbar__separator{display:none}.contentful-toolbar__group{flex-wrap:wrap}.contentful-editor-content{font-size:14px;padding:12px}.contentful-toolbar__link-input{align-items:stretch;flex-direction:column;gap:8px;margin-left:0;margin-top:8px;width:100%}.contentful-toolbar__link-input input{width:100%}.contentful-table{font-size:14px}.contentful-table-cell,.contentful-table-header{padding:8px 12px}}@media (max-width:480px){.contentful-editor-content{font-size:14px;padding:8px}.contentful-toolbar{padding:8px}.contentful-toolbar__button{font-size:12px;height:28px;min-width:28px;padding:4px 6px}.contentful-blockquote{margin:1em 0;padding:.75em 0 .75em 1em}}
|