diff --git a/demos/plaintext-editor/src/PlainTextComposer.svelte b/demos/plaintext-editor/src/PlainTextComposer.svelte index c0030b5..0fc9d1a 100644 --- a/demos/plaintext-editor/src/PlainTextComposer.svelte +++ b/demos/plaintext-editor/src/PlainTextComposer.svelte @@ -6,7 +6,7 @@ PlainTextPlugin, HistoryPlugin, } from 'svelte-lexical'; - import PlaygroundEditorTheme from './themes/PlaygroundEditorTheme'; + import {editorTheme as PlaygroundEditorTheme} from 'svelte-lexical'; const initialConfig = { theme: PlaygroundEditorTheme, diff --git a/demos/plaintext-editor/src/themes/PlaygroundEditorTheme.css b/demos/plaintext-editor/src/themes/PlaygroundEditorTheme.css deleted file mode 100644 index 4e5b551..0000000 --- a/demos/plaintext-editor/src/themes/PlaygroundEditorTheme.css +++ /dev/null @@ -1,461 +0,0 @@ -/** - * Copyright (c) Meta Platforms, Inc. and affiliates. - * - * This source code is licensed under the MIT license found in the - * LICENSE file in the root directory of this source tree. - * - * - */ -.PlaygroundEditorTheme__ltr { - text-align: left; -} -.PlaygroundEditorTheme__rtl { - text-align: right; -} -.PlaygroundEditorTheme__paragraph { - margin: 0; - position: relative; -} -.PlaygroundEditorTheme__quote { - margin: 0; - margin-left: 20px; - margin-bottom: 10px; - font-size: 15px; - color: rgb(101, 103, 107); - border-left-color: rgb(206, 208, 212); - border-left-width: 4px; - border-left-style: solid; - padding-left: 16px; -} -.PlaygroundEditorTheme__h1 { - font-size: 24px; - color: rgb(5, 5, 5); - font-weight: 400; - margin: 0; -} -.PlaygroundEditorTheme__h2 { - font-size: 15px; - color: rgb(101, 103, 107); - font-weight: 700; - margin: 0; - text-transform: uppercase; -} -.PlaygroundEditorTheme__h3 { - font-size: 12px; - margin: 0; - text-transform: uppercase; -} -.PlaygroundEditorTheme__indent { - --lexical-indent-base-value: 40px; -} -.PlaygroundEditorTheme__textBold { - font-weight: bold; -} -.PlaygroundEditorTheme__textItalic { - font-style: italic; -} -.PlaygroundEditorTheme__textUnderline { - text-decoration: underline; -} -.PlaygroundEditorTheme__textStrikethrough { - text-decoration: line-through; -} -.PlaygroundEditorTheme__textUnderlineStrikethrough { - text-decoration: underline line-through; -} -.PlaygroundEditorTheme__textSubscript { - font-size: 0.8em; - vertical-align: sub !important; -} -.PlaygroundEditorTheme__textSuperscript { - font-size: 0.8em; - vertical-align: super; -} -.PlaygroundEditorTheme__textCode { - background-color: rgb(240, 242, 245); - padding: 1px 0.25rem; - font-family: Menlo, Consolas, Monaco, monospace; - font-size: 94%; -} -.PlaygroundEditorTheme__hashtag { - background-color: rgba(88, 144, 255, 0.15); - border-bottom: 1px solid rgba(88, 144, 255, 0.3); -} -.PlaygroundEditorTheme__link { - color: rgb(33, 111, 219); - text-decoration: none; -} -.PlaygroundEditorTheme__link:hover { - text-decoration: underline; - cursor: pointer; -} -.PlaygroundEditorTheme__code { - background-color: rgb(240, 242, 245); - font-family: Menlo, Consolas, Monaco, monospace; - display: block; - padding: 8px 8px 8px 52px; - line-height: 1.53; - font-size: 13px; - margin: 0; - margin-top: 8px; - margin-bottom: 8px; - overflow-x: auto; - position: relative; - tab-size: 2; -} -.PlaygroundEditorTheme__code:before { - content: attr(data-gutter); - position: absolute; - background-color: #eee; - left: 0; - top: 0; - border-right: 1px solid #ccc; - padding: 8px; - color: #777; - white-space: pre-wrap; - text-align: right; - min-width: 25px; -} -.PlaygroundEditorTheme__table { - border-collapse: collapse; - border-spacing: 0; - overflow-y: scroll; - overflow-x: scroll; - table-layout: fixed; - width: max-content; - margin: 30px 0; -} -.PlaygroundEditorTheme__tableSelection *::selection { - background-color: transparent; -} -.PlaygroundEditorTheme__tableSelected { - outline: 2px solid rgb(60, 132, 244); -} -.PlaygroundEditorTheme__tableCell { - border: 1px solid #bbb; - width: 75px; - min-width: 75px; - vertical-align: top; - text-align: start; - padding: 6px 8px; - position: relative; - outline: none; -} -.PlaygroundEditorTheme__tableCellSortedIndicator { - display: block; - opacity: 0.5; - position: absolute; - bottom: 0; - left: 0; - width: 100%; - height: 4px; - background-color: #999; -} -.PlaygroundEditorTheme__tableCellResizer { - position: absolute; - right: -4px; - height: 100%; - width: 8px; - cursor: ew-resize; - z-index: 10; - top: 0; -} -.PlaygroundEditorTheme__tableCellHeader { - background-color: #f2f3f5; - text-align: start; -} -.PlaygroundEditorTheme__tableCellSelected { - background-color: #c9dbf0; -} -.PlaygroundEditorTheme__tableCellPrimarySelected { - border: 2px solid rgb(60, 132, 244); - display: block; - height: calc(100% - 2px); - position: absolute; - width: calc(100% - 2px); - left: -1px; - top: -1px; - z-index: 2; -} -.PlaygroundEditorTheme__tableCellEditing { - box-shadow: 0 0 5px rgba(0, 0, 0, 0.4); - border-radius: 3px; -} -.PlaygroundEditorTheme__tableAddColumns { - position: absolute; - top: 0; - width: 20px; - background-color: #eee; - height: 100%; - right: -25px; - animation: table-controls 0.2s ease; - border: 0; - cursor: pointer; -} -.PlaygroundEditorTheme__tableAddColumns:after { - background-image: url(../images/icons/plus.svg); - background-size: contain; - background-position: center; - background-repeat: no-repeat; - display: block; - content: ' '; - position: absolute; - top: 0; - left: 0; - width: 100%; - height: 100%; - opacity: 0.4; -} -.PlaygroundEditorTheme__tableAddColumns:hover { - background-color: #c9dbf0; -} -.PlaygroundEditorTheme__tableAddRows { - position: absolute; - bottom: -25px; - width: calc(100% - 25px); - background-color: #eee; - height: 20px; - left: 0; - animation: table-controls 0.2s ease; - border: 0; - cursor: pointer; -} -.PlaygroundEditorTheme__tableAddRows:after { - background-image: url(../images/icons/plus.svg); - background-size: contain; - background-position: center; - background-repeat: no-repeat; - display: block; - content: ' '; - position: absolute; - top: 0; - left: 0; - width: 100%; - height: 100%; - opacity: 0.4; -} -.PlaygroundEditorTheme__tableAddRows:hover { - background-color: #c9dbf0; -} -@keyframes table-controls { - 0% { - opacity: 0; - } - 100% { - opacity: 1; - } -} -.PlaygroundEditorTheme__tableCellResizeRuler { - display: block; - position: absolute; - width: 1px; - background-color: rgb(60, 132, 244); - height: 100%; - top: 0; -} -.PlaygroundEditorTheme__tableCellActionButtonContainer { - display: block; - right: 5px; - top: 6px; - position: absolute; - z-index: 4; - width: 20px; - height: 20px; -} -.PlaygroundEditorTheme__tableCellActionButton { - background-color: #eee; - display: block; - border: 0; - border-radius: 20px; - width: 20px; - height: 20px; - color: #222; - cursor: pointer; -} -.PlaygroundEditorTheme__tableCellActionButton:hover { - background-color: #ddd; -} -.PlaygroundEditorTheme__characterLimit { - display: inline; - background-color: #ffbbbb !important; -} -.PlaygroundEditorTheme__ol1 { - padding: 0; - margin: 0; - list-style-position: outside; -} -.PlaygroundEditorTheme__ol2 { - padding: 0; - margin: 0; - list-style-type: upper-alpha; - list-style-position: outside; -} -.PlaygroundEditorTheme__ol3 { - padding: 0; - margin: 0; - list-style-type: lower-alpha; - list-style-position: outside; -} -.PlaygroundEditorTheme__ol4 { - padding: 0; - margin: 0; - list-style-type: upper-roman; - list-style-position: outside; -} -.PlaygroundEditorTheme__ol5 { - padding: 0; - margin: 0; - list-style-type: lower-roman; - list-style-position: outside; -} -.PlaygroundEditorTheme__ul { - padding: 0; - margin: 0; - list-style-position: outside; -} -.PlaygroundEditorTheme__listItem { - margin: 0 32px; -} -.PlaygroundEditorTheme__listItemChecked, -.PlaygroundEditorTheme__listItemUnchecked { - position: relative; - margin-left: 8px; - margin-right: 8px; - padding-left: 24px; - padding-right: 24px; - list-style-type: none; - outline: none; -} -.PlaygroundEditorTheme__listItemChecked { - text-decoration: line-through; -} -.PlaygroundEditorTheme__listItemUnchecked:before, -.PlaygroundEditorTheme__listItemChecked:before { - content: ''; - width: 16px; - height: 16px; - top: 2px; - left: 0; - cursor: pointer; - display: block; - background-size: cover; - position: absolute; -} -.PlaygroundEditorTheme__listItemUnchecked[dir='rtl']:before, -.PlaygroundEditorTheme__listItemChecked[dir='rtl']:before { - left: auto; - right: 0; -} -.PlaygroundEditorTheme__listItemUnchecked:focus:before, -.PlaygroundEditorTheme__listItemChecked:focus:before { - box-shadow: 0 0 0 2px #a6cdfe; - border-radius: 2px; -} -.PlaygroundEditorTheme__listItemUnchecked:before { - border: 1px solid #999; - border-radius: 2px; -} -.PlaygroundEditorTheme__listItemChecked:before { - border: 1px solid rgb(61, 135, 245); - border-radius: 2px; - background-color: #3d87f5; - background-repeat: no-repeat; -} -.PlaygroundEditorTheme__listItemChecked:after { - content: ''; - cursor: pointer; - border-color: #fff; - border-style: solid; - position: absolute; - display: block; - top: 6px; - width: 3px; - left: 7px; - right: 7px; - height: 6px; - transform: rotate(45deg); - border-width: 0 2px 2px 0; -} -.PlaygroundEditorTheme__nestedListItem { - list-style-type: none; -} -.PlaygroundEditorTheme__nestedListItem:before, -.PlaygroundEditorTheme__nestedListItem:after { - display: none; -} -.PlaygroundEditorTheme__tokenComment { - color: slategray; -} -.PlaygroundEditorTheme__tokenPunctuation { - color: #999; -} -.PlaygroundEditorTheme__tokenProperty { - color: #905; -} -.PlaygroundEditorTheme__tokenSelector { - color: #690; -} -.PlaygroundEditorTheme__tokenOperator { - color: #9a6e3a; -} -.PlaygroundEditorTheme__tokenAttr { - color: #07a; -} -.PlaygroundEditorTheme__tokenVariable { - color: #e90; -} -.PlaygroundEditorTheme__tokenFunction { - color: #dd4a68; -} -.PlaygroundEditorTheme__mark { - background: rgba(255, 212, 0, 0.14); - border-bottom: 2px solid rgba(255, 212, 0, 0.3); - padding-bottom: 2px; -} -.PlaygroundEditorTheme__markOverlap { - background: rgba(255, 212, 0, 0.3); - border-bottom: 2px solid rgba(255, 212, 0, 0.7); -} -.PlaygroundEditorTheme__mark.selected { - background: rgba(255, 212, 0, 0.5); - border-bottom: 2px solid rgba(255, 212, 0, 1); -} -.PlaygroundEditorTheme__markOverlap.selected { - background: rgba(255, 212, 0, 0.7); - border-bottom: 2px solid rgba(255, 212, 0, 0.7); -} -.PlaygroundEditorTheme__embedBlock { - user-select: none; -} -.PlaygroundEditorTheme__embedBlockFocus { - outline: 2px solid rgb(60, 132, 244); -} -.PlaygroundEditorTheme__layoutContainer { - display: grid; - gap: 10px; - margin: 10px 0; -} -.PlaygroundEditorTheme__layoutItem { - border: 1px dashed #ddd; - padding: 8px 16px; -} -.PlaygroundEditorTheme__autocomplete { - color: #ccc; -} -.PlaygroundEditorTheme__hr { - padding: 2px 2px; - border: none; - margin: 1em 0; - cursor: pointer; -} -.PlaygroundEditorTheme__hr:after { - content: ''; - display: block; - height: 2px; - background-color: #ccc; - line-height: 2px; -} -.PlaygroundEditorTheme__hr.selected { - outline: 2px solid rgb(60, 132, 244); - user-select: none; -} diff --git a/demos/plaintext-editor/src/themes/PlaygroundEditorTheme.ts b/demos/plaintext-editor/src/themes/PlaygroundEditorTheme.ts deleted file mode 100644 index 9523e72..0000000 --- a/demos/plaintext-editor/src/themes/PlaygroundEditorTheme.ts +++ /dev/null @@ -1,89 +0,0 @@ -/** - * Copyright (c) Syed Umar Anis - * - * This source code is licensed under the MIT license found in the - * LICENSE file in the root directory of this source tree. - * - */ - -import './PlaygroundEditorTheme.css'; - -// TODO: Trim the code below to remove irrelevant styles -const theme = { - characterLimit: 'PlaygroundEditorTheme__characterLimit', - code: 'PlaygroundEditorTheme__code', - codeHighlight: { - atrule: 'PlaygroundEditorTheme__tokenAttr', - attr: 'PlaygroundEditorTheme__tokenAttr', - boolean: 'PlaygroundEditorTheme__tokenProperty', - builtin: 'PlaygroundEditorTheme__tokenSelector', - cdata: 'PlaygroundEditorTheme__tokenComment', - char: 'PlaygroundEditorTheme__tokenSelector', - class: 'PlaygroundEditorTheme__tokenFunction', - 'class-name': 'PlaygroundEditorTheme__tokenFunction', - comment: 'PlaygroundEditorTheme__tokenComment', - constant: 'PlaygroundEditorTheme__tokenProperty', - deleted: 'PlaygroundEditorTheme__tokenProperty', - doctype: 'PlaygroundEditorTheme__tokenComment', - entity: 'PlaygroundEditorTheme__tokenOperator', - function: 'PlaygroundEditorTheme__tokenFunction', - important: 'PlaygroundEditorTheme__tokenVariable', - inserted: 'PlaygroundEditorTheme__tokenSelector', - keyword: 'PlaygroundEditorTheme__tokenAttr', - namespace: 'PlaygroundEditorTheme__tokenVariable', - number: 'PlaygroundEditorTheme__tokenProperty', - operator: 'PlaygroundEditorTheme__tokenOperator', - prolog: 'PlaygroundEditorTheme__tokenComment', - property: 'PlaygroundEditorTheme__tokenProperty', - punctuation: 'PlaygroundEditorTheme__tokenPunctuation', - regex: 'PlaygroundEditorTheme__tokenVariable', - selector: 'PlaygroundEditorTheme__tokenSelector', - string: 'PlaygroundEditorTheme__tokenSelector', - symbol: 'PlaygroundEditorTheme__tokenProperty', - tag: 'PlaygroundEditorTheme__tokenProperty', - url: 'PlaygroundEditorTheme__tokenOperator', - variable: 'PlaygroundEditorTheme__tokenVariable', - }, - hashtag: 'PlaygroundEditorTheme__hashtag', - heading: { - h1: 'PlaygroundEditorTheme__h1', - h2: 'PlaygroundEditorTheme__h2', - h3: 'PlaygroundEditorTheme__h3', - h4: 'PlaygroundEditorTheme__h4', - h5: 'PlaygroundEditorTheme__h5', - }, - hr: 'PlaygroundEditorTheme__hr', - image: 'editor-image', - link: 'PlaygroundEditorTheme__link', - list: { - listitem: 'PlaygroundEditorTheme__listItem', - nested: { - listitem: 'PlaygroundEditorTheme__nestedListItem', - }, - olDepth: [ - 'PlaygroundEditorTheme__ol1', - 'PlaygroundEditorTheme__ol2', - 'PlaygroundEditorTheme__ol3', - 'PlaygroundEditorTheme__ol4', - 'PlaygroundEditorTheme__ol5', - ], - ul: 'PlaygroundEditorTheme__ul', - }, - ltr: 'PlaygroundEditorTheme__ltr', - paragraph: 'PlaygroundEditorTheme__paragraph', - quote: 'PlaygroundEditorTheme__quote', - rtl: 'PlaygroundEditorTheme__rtl', - table: 'PlaygroundEditorTheme__table', - tableCell: 'PlaygroundEditorTheme__tableCell', - tableCellHeader: 'PlaygroundEditorTheme__tableCellHeader', - text: { - bold: 'PlaygroundEditorTheme__textBold', - code: 'PlaygroundEditorTheme__textCode', - italic: 'PlaygroundEditorTheme__textItalic', - strikethrough: 'PlaygroundEditorTheme__textStrikethrough', - underline: 'PlaygroundEditorTheme__textUnderline', - underlineStrikethrough: 'PlaygroundEditorTheme__textUnderlineStrikethrough', - }, -}; - -export default theme; diff --git a/demos/plaintext-editor/src/themes/StickyEditorTheme.css b/demos/plaintext-editor/src/themes/StickyEditorTheme.css deleted file mode 100644 index f563869..0000000 --- a/demos/plaintext-editor/src/themes/StickyEditorTheme.css +++ /dev/null @@ -1,13 +0,0 @@ -/** - * Copyright (c) Meta Platforms, Inc. and affiliates. - * - * This source code is licensed under the MIT license found in the - * LICENSE file in the root directory of this source tree. - * - * - */ - -.StickyEditorTheme__paragraph { - margin: 0; - position: 'relative'; -} diff --git a/demos/plaintext-editor/src/themes/StickyEditorTheme.ts b/demos/plaintext-editor/src/themes/StickyEditorTheme.ts deleted file mode 100644 index 33e3ef6..0000000 --- a/demos/plaintext-editor/src/themes/StickyEditorTheme.ts +++ /dev/null @@ -1,18 +0,0 @@ -/** - * Copyright (c) Syed Umar Anis - * - * This source code is licensed under the MIT license found in the - * LICENSE file in the root directory of this source tree. - * - */ - -import './StickyEditorTheme.css'; - -import baseTheme from './PlaygroundEditorTheme'; - -const theme = { - ...baseTheme, - paragraph: 'StickyEditorTheme__paragraph', -}; - -export default theme; diff --git a/demos/richtext-editor/src/App.svelte b/demos/richtext-editor/src/App.svelte index ec2d3cb..08e6fac 100644 --- a/demos/richtext-editor/src/App.svelte +++ b/demos/richtext-editor/src/App.svelte @@ -1,6 +1,6 @@
diff --git a/demos/richtext-editor/src/themes/CommentEditorTheme.css b/demos/richtext-editor/src/themes/CommentEditorTheme.css deleted file mode 100644 index e50318c..0000000 --- a/demos/richtext-editor/src/themes/CommentEditorTheme.css +++ /dev/null @@ -1,13 +0,0 @@ -/** - * Copyright (c) Meta Platforms, Inc. and affiliates. - * - * This source code is licensed under the MIT license found in the - * LICENSE file in the root directory of this source tree. - * - * - */ - -.CommentEditorTheme__paragraph { - margin: 0; - position: 'relative'; -} diff --git a/demos/richtext-editor/src/themes/CommentEditorTheme.ts b/demos/richtext-editor/src/themes/CommentEditorTheme.ts deleted file mode 100644 index 04dd660..0000000 --- a/demos/richtext-editor/src/themes/CommentEditorTheme.ts +++ /dev/null @@ -1,18 +0,0 @@ -/** - * Copyright (c) Meta Platforms, Inc. and affiliates. - * - * This source code is licensed under the MIT license found in the - * LICENSE file in the root directory of this source tree. - * - */ - -import './CommentEditorTheme.css'; - -import baseTheme from './PlaygroundEditorTheme'; - -const theme = { - ...baseTheme, - paragraph: 'CommentEditorTheme__paragraph', -}; - -export default theme; diff --git a/demos/richtext-editor/src/themes/PlaygroundEditorTheme.css b/demos/richtext-editor/src/themes/PlaygroundEditorTheme.css deleted file mode 100644 index 4e5b551..0000000 --- a/demos/richtext-editor/src/themes/PlaygroundEditorTheme.css +++ /dev/null @@ -1,461 +0,0 @@ -/** - * Copyright (c) Meta Platforms, Inc. and affiliates. - * - * This source code is licensed under the MIT license found in the - * LICENSE file in the root directory of this source tree. - * - * - */ -.PlaygroundEditorTheme__ltr { - text-align: left; -} -.PlaygroundEditorTheme__rtl { - text-align: right; -} -.PlaygroundEditorTheme__paragraph { - margin: 0; - position: relative; -} -.PlaygroundEditorTheme__quote { - margin: 0; - margin-left: 20px; - margin-bottom: 10px; - font-size: 15px; - color: rgb(101, 103, 107); - border-left-color: rgb(206, 208, 212); - border-left-width: 4px; - border-left-style: solid; - padding-left: 16px; -} -.PlaygroundEditorTheme__h1 { - font-size: 24px; - color: rgb(5, 5, 5); - font-weight: 400; - margin: 0; -} -.PlaygroundEditorTheme__h2 { - font-size: 15px; - color: rgb(101, 103, 107); - font-weight: 700; - margin: 0; - text-transform: uppercase; -} -.PlaygroundEditorTheme__h3 { - font-size: 12px; - margin: 0; - text-transform: uppercase; -} -.PlaygroundEditorTheme__indent { - --lexical-indent-base-value: 40px; -} -.PlaygroundEditorTheme__textBold { - font-weight: bold; -} -.PlaygroundEditorTheme__textItalic { - font-style: italic; -} -.PlaygroundEditorTheme__textUnderline { - text-decoration: underline; -} -.PlaygroundEditorTheme__textStrikethrough { - text-decoration: line-through; -} -.PlaygroundEditorTheme__textUnderlineStrikethrough { - text-decoration: underline line-through; -} -.PlaygroundEditorTheme__textSubscript { - font-size: 0.8em; - vertical-align: sub !important; -} -.PlaygroundEditorTheme__textSuperscript { - font-size: 0.8em; - vertical-align: super; -} -.PlaygroundEditorTheme__textCode { - background-color: rgb(240, 242, 245); - padding: 1px 0.25rem; - font-family: Menlo, Consolas, Monaco, monospace; - font-size: 94%; -} -.PlaygroundEditorTheme__hashtag { - background-color: rgba(88, 144, 255, 0.15); - border-bottom: 1px solid rgba(88, 144, 255, 0.3); -} -.PlaygroundEditorTheme__link { - color: rgb(33, 111, 219); - text-decoration: none; -} -.PlaygroundEditorTheme__link:hover { - text-decoration: underline; - cursor: pointer; -} -.PlaygroundEditorTheme__code { - background-color: rgb(240, 242, 245); - font-family: Menlo, Consolas, Monaco, monospace; - display: block; - padding: 8px 8px 8px 52px; - line-height: 1.53; - font-size: 13px; - margin: 0; - margin-top: 8px; - margin-bottom: 8px; - overflow-x: auto; - position: relative; - tab-size: 2; -} -.PlaygroundEditorTheme__code:before { - content: attr(data-gutter); - position: absolute; - background-color: #eee; - left: 0; - top: 0; - border-right: 1px solid #ccc; - padding: 8px; - color: #777; - white-space: pre-wrap; - text-align: right; - min-width: 25px; -} -.PlaygroundEditorTheme__table { - border-collapse: collapse; - border-spacing: 0; - overflow-y: scroll; - overflow-x: scroll; - table-layout: fixed; - width: max-content; - margin: 30px 0; -} -.PlaygroundEditorTheme__tableSelection *::selection { - background-color: transparent; -} -.PlaygroundEditorTheme__tableSelected { - outline: 2px solid rgb(60, 132, 244); -} -.PlaygroundEditorTheme__tableCell { - border: 1px solid #bbb; - width: 75px; - min-width: 75px; - vertical-align: top; - text-align: start; - padding: 6px 8px; - position: relative; - outline: none; -} -.PlaygroundEditorTheme__tableCellSortedIndicator { - display: block; - opacity: 0.5; - position: absolute; - bottom: 0; - left: 0; - width: 100%; - height: 4px; - background-color: #999; -} -.PlaygroundEditorTheme__tableCellResizer { - position: absolute; - right: -4px; - height: 100%; - width: 8px; - cursor: ew-resize; - z-index: 10; - top: 0; -} -.PlaygroundEditorTheme__tableCellHeader { - background-color: #f2f3f5; - text-align: start; -} -.PlaygroundEditorTheme__tableCellSelected { - background-color: #c9dbf0; -} -.PlaygroundEditorTheme__tableCellPrimarySelected { - border: 2px solid rgb(60, 132, 244); - display: block; - height: calc(100% - 2px); - position: absolute; - width: calc(100% - 2px); - left: -1px; - top: -1px; - z-index: 2; -} -.PlaygroundEditorTheme__tableCellEditing { - box-shadow: 0 0 5px rgba(0, 0, 0, 0.4); - border-radius: 3px; -} -.PlaygroundEditorTheme__tableAddColumns { - position: absolute; - top: 0; - width: 20px; - background-color: #eee; - height: 100%; - right: -25px; - animation: table-controls 0.2s ease; - border: 0; - cursor: pointer; -} -.PlaygroundEditorTheme__tableAddColumns:after { - background-image: url(../images/icons/plus.svg); - background-size: contain; - background-position: center; - background-repeat: no-repeat; - display: block; - content: ' '; - position: absolute; - top: 0; - left: 0; - width: 100%; - height: 100%; - opacity: 0.4; -} -.PlaygroundEditorTheme__tableAddColumns:hover { - background-color: #c9dbf0; -} -.PlaygroundEditorTheme__tableAddRows { - position: absolute; - bottom: -25px; - width: calc(100% - 25px); - background-color: #eee; - height: 20px; - left: 0; - animation: table-controls 0.2s ease; - border: 0; - cursor: pointer; -} -.PlaygroundEditorTheme__tableAddRows:after { - background-image: url(../images/icons/plus.svg); - background-size: contain; - background-position: center; - background-repeat: no-repeat; - display: block; - content: ' '; - position: absolute; - top: 0; - left: 0; - width: 100%; - height: 100%; - opacity: 0.4; -} -.PlaygroundEditorTheme__tableAddRows:hover { - background-color: #c9dbf0; -} -@keyframes table-controls { - 0% { - opacity: 0; - } - 100% { - opacity: 1; - } -} -.PlaygroundEditorTheme__tableCellResizeRuler { - display: block; - position: absolute; - width: 1px; - background-color: rgb(60, 132, 244); - height: 100%; - top: 0; -} -.PlaygroundEditorTheme__tableCellActionButtonContainer { - display: block; - right: 5px; - top: 6px; - position: absolute; - z-index: 4; - width: 20px; - height: 20px; -} -.PlaygroundEditorTheme__tableCellActionButton { - background-color: #eee; - display: block; - border: 0; - border-radius: 20px; - width: 20px; - height: 20px; - color: #222; - cursor: pointer; -} -.PlaygroundEditorTheme__tableCellActionButton:hover { - background-color: #ddd; -} -.PlaygroundEditorTheme__characterLimit { - display: inline; - background-color: #ffbbbb !important; -} -.PlaygroundEditorTheme__ol1 { - padding: 0; - margin: 0; - list-style-position: outside; -} -.PlaygroundEditorTheme__ol2 { - padding: 0; - margin: 0; - list-style-type: upper-alpha; - list-style-position: outside; -} -.PlaygroundEditorTheme__ol3 { - padding: 0; - margin: 0; - list-style-type: lower-alpha; - list-style-position: outside; -} -.PlaygroundEditorTheme__ol4 { - padding: 0; - margin: 0; - list-style-type: upper-roman; - list-style-position: outside; -} -.PlaygroundEditorTheme__ol5 { - padding: 0; - margin: 0; - list-style-type: lower-roman; - list-style-position: outside; -} -.PlaygroundEditorTheme__ul { - padding: 0; - margin: 0; - list-style-position: outside; -} -.PlaygroundEditorTheme__listItem { - margin: 0 32px; -} -.PlaygroundEditorTheme__listItemChecked, -.PlaygroundEditorTheme__listItemUnchecked { - position: relative; - margin-left: 8px; - margin-right: 8px; - padding-left: 24px; - padding-right: 24px; - list-style-type: none; - outline: none; -} -.PlaygroundEditorTheme__listItemChecked { - text-decoration: line-through; -} -.PlaygroundEditorTheme__listItemUnchecked:before, -.PlaygroundEditorTheme__listItemChecked:before { - content: ''; - width: 16px; - height: 16px; - top: 2px; - left: 0; - cursor: pointer; - display: block; - background-size: cover; - position: absolute; -} -.PlaygroundEditorTheme__listItemUnchecked[dir='rtl']:before, -.PlaygroundEditorTheme__listItemChecked[dir='rtl']:before { - left: auto; - right: 0; -} -.PlaygroundEditorTheme__listItemUnchecked:focus:before, -.PlaygroundEditorTheme__listItemChecked:focus:before { - box-shadow: 0 0 0 2px #a6cdfe; - border-radius: 2px; -} -.PlaygroundEditorTheme__listItemUnchecked:before { - border: 1px solid #999; - border-radius: 2px; -} -.PlaygroundEditorTheme__listItemChecked:before { - border: 1px solid rgb(61, 135, 245); - border-radius: 2px; - background-color: #3d87f5; - background-repeat: no-repeat; -} -.PlaygroundEditorTheme__listItemChecked:after { - content: ''; - cursor: pointer; - border-color: #fff; - border-style: solid; - position: absolute; - display: block; - top: 6px; - width: 3px; - left: 7px; - right: 7px; - height: 6px; - transform: rotate(45deg); - border-width: 0 2px 2px 0; -} -.PlaygroundEditorTheme__nestedListItem { - list-style-type: none; -} -.PlaygroundEditorTheme__nestedListItem:before, -.PlaygroundEditorTheme__nestedListItem:after { - display: none; -} -.PlaygroundEditorTheme__tokenComment { - color: slategray; -} -.PlaygroundEditorTheme__tokenPunctuation { - color: #999; -} -.PlaygroundEditorTheme__tokenProperty { - color: #905; -} -.PlaygroundEditorTheme__tokenSelector { - color: #690; -} -.PlaygroundEditorTheme__tokenOperator { - color: #9a6e3a; -} -.PlaygroundEditorTheme__tokenAttr { - color: #07a; -} -.PlaygroundEditorTheme__tokenVariable { - color: #e90; -} -.PlaygroundEditorTheme__tokenFunction { - color: #dd4a68; -} -.PlaygroundEditorTheme__mark { - background: rgba(255, 212, 0, 0.14); - border-bottom: 2px solid rgba(255, 212, 0, 0.3); - padding-bottom: 2px; -} -.PlaygroundEditorTheme__markOverlap { - background: rgba(255, 212, 0, 0.3); - border-bottom: 2px solid rgba(255, 212, 0, 0.7); -} -.PlaygroundEditorTheme__mark.selected { - background: rgba(255, 212, 0, 0.5); - border-bottom: 2px solid rgba(255, 212, 0, 1); -} -.PlaygroundEditorTheme__markOverlap.selected { - background: rgba(255, 212, 0, 0.7); - border-bottom: 2px solid rgba(255, 212, 0, 0.7); -} -.PlaygroundEditorTheme__embedBlock { - user-select: none; -} -.PlaygroundEditorTheme__embedBlockFocus { - outline: 2px solid rgb(60, 132, 244); -} -.PlaygroundEditorTheme__layoutContainer { - display: grid; - gap: 10px; - margin: 10px 0; -} -.PlaygroundEditorTheme__layoutItem { - border: 1px dashed #ddd; - padding: 8px 16px; -} -.PlaygroundEditorTheme__autocomplete { - color: #ccc; -} -.PlaygroundEditorTheme__hr { - padding: 2px 2px; - border: none; - margin: 1em 0; - cursor: pointer; -} -.PlaygroundEditorTheme__hr:after { - content: ''; - display: block; - height: 2px; - background-color: #ccc; - line-height: 2px; -} -.PlaygroundEditorTheme__hr.selected { - outline: 2px solid rgb(60, 132, 244); - user-select: none; -} diff --git a/demos/richtext-editor/src/themes/PlaygroundEditorTheme.ts b/demos/richtext-editor/src/themes/PlaygroundEditorTheme.ts deleted file mode 100644 index ffc3adf..0000000 --- a/demos/richtext-editor/src/themes/PlaygroundEditorTheme.ts +++ /dev/null @@ -1,112 +0,0 @@ -/** - * Copyright (c) Syed Umar Anis - * - * This source code is licensed under the MIT license found in the - * LICENSE file in the root directory of this source tree. - * - */ - -import './PlaygroundEditorTheme.css'; - -const theme = { - blockCursor: 'PlaygroundEditorTheme__blockCursor', - characterLimit: 'PlaygroundEditorTheme__characterLimit', - code: 'PlaygroundEditorTheme__code', - codeHighlight: { - atrule: 'PlaygroundEditorTheme__tokenAttr', - attr: 'PlaygroundEditorTheme__tokenAttr', - boolean: 'PlaygroundEditorTheme__tokenProperty', - builtin: 'PlaygroundEditorTheme__tokenSelector', - cdata: 'PlaygroundEditorTheme__tokenComment', - char: 'PlaygroundEditorTheme__tokenSelector', - class: 'PlaygroundEditorTheme__tokenFunction', - 'class-name': 'PlaygroundEditorTheme__tokenFunction', - comment: 'PlaygroundEditorTheme__tokenComment', - constant: 'PlaygroundEditorTheme__tokenProperty', - deleted: 'PlaygroundEditorTheme__tokenProperty', - doctype: 'PlaygroundEditorTheme__tokenComment', - entity: 'PlaygroundEditorTheme__tokenOperator', - function: 'PlaygroundEditorTheme__tokenFunction', - important: 'PlaygroundEditorTheme__tokenVariable', - inserted: 'PlaygroundEditorTheme__tokenSelector', - keyword: 'PlaygroundEditorTheme__tokenAttr', - namespace: 'PlaygroundEditorTheme__tokenVariable', - number: 'PlaygroundEditorTheme__tokenProperty', - operator: 'PlaygroundEditorTheme__tokenOperator', - prolog: 'PlaygroundEditorTheme__tokenComment', - property: 'PlaygroundEditorTheme__tokenProperty', - punctuation: 'PlaygroundEditorTheme__tokenPunctuation', - regex: 'PlaygroundEditorTheme__tokenVariable', - selector: 'PlaygroundEditorTheme__tokenSelector', - string: 'PlaygroundEditorTheme__tokenSelector', - symbol: 'PlaygroundEditorTheme__tokenProperty', - tag: 'PlaygroundEditorTheme__tokenProperty', - url: 'PlaygroundEditorTheme__tokenOperator', - variable: 'PlaygroundEditorTheme__tokenVariable', - }, - embedBlock: { - base: 'PlaygroundEditorTheme__embedBlock', - focus: 'PlaygroundEditorTheme__embedBlockFocus', - }, - hashtag: 'PlaygroundEditorTheme__hashtag', - heading: { - h1: 'PlaygroundEditorTheme__h1', - h2: 'PlaygroundEditorTheme__h2', - h3: 'PlaygroundEditorTheme__h3', - h4: 'PlaygroundEditorTheme__h4', - h5: 'PlaygroundEditorTheme__h5', - h6: 'PlaygroundEditorTheme__h6', - }, - hr: 'PlaygroundEditorTheme__hr', - image: 'editor-image', - link: 'PlaygroundEditorTheme__link', - list: { - listitem: 'PlaygroundEditorTheme__listItem', - listitemChecked: 'PlaygroundEditorTheme__listItemChecked', - listitemUnchecked: 'PlaygroundEditorTheme__listItemUnchecked', - nested: { - listitem: 'PlaygroundEditorTheme__nestedListItem', - }, - olDepth: [ - 'PlaygroundEditorTheme__ol1', - 'PlaygroundEditorTheme__ol2', - 'PlaygroundEditorTheme__ol3', - 'PlaygroundEditorTheme__ol4', - 'PlaygroundEditorTheme__ol5', - ], - ul: 'PlaygroundEditorTheme__ul', - }, - ltr: 'PlaygroundEditorTheme__ltr', - mark: 'PlaygroundEditorTheme__mark', - markOverlap: 'PlaygroundEditorTheme__markOverlap', - paragraph: 'PlaygroundEditorTheme__paragraph', - quote: 'PlaygroundEditorTheme__quote', - rtl: 'PlaygroundEditorTheme__rtl', - table: 'PlaygroundEditorTheme__table', - tableAddColumns: 'PlaygroundEditorTheme__tableAddColumns', - tableAddRows: 'PlaygroundEditorTheme__tableAddRows', - tableCell: 'PlaygroundEditorTheme__tableCell', - tableCellActionButton: 'PlaygroundEditorTheme__tableCellActionButton', - tableCellActionButtonContainer: - 'PlaygroundEditorTheme__tableCellActionButtonContainer', - tableCellEditing: 'PlaygroundEditorTheme__tableCellEditing', - tableCellHeader: 'PlaygroundEditorTheme__tableCellHeader', - tableCellPrimarySelected: 'PlaygroundEditorTheme__tableCellPrimarySelected', - tableCellResizer: 'PlaygroundEditorTheme__tableCellResizer', - tableCellSelected: 'PlaygroundEditorTheme__tableCellSelected', - tableCellSortedIndicator: 'PlaygroundEditorTheme__tableCellSortedIndicator', - tableResizeRuler: 'PlaygroundEditorTheme__tableCellResizeRuler', - tableSelected: 'PlaygroundEditorTheme__tableSelected', - text: { - bold: 'PlaygroundEditorTheme__textBold', - code: 'PlaygroundEditorTheme__textCode', - italic: 'PlaygroundEditorTheme__textItalic', - strikethrough: 'PlaygroundEditorTheme__textStrikethrough', - subscript: 'PlaygroundEditorTheme__textSubscript', - superscript: 'PlaygroundEditorTheme__textSuperscript', - underline: 'PlaygroundEditorTheme__textUnderline', - underlineStrikethrough: 'PlaygroundEditorTheme__textUnderlineStrikethrough', - }, -}; - -export default theme; diff --git a/demos/richtext-editor/src/themes/StickyEditorTheme.css b/demos/richtext-editor/src/themes/StickyEditorTheme.css deleted file mode 100644 index f563869..0000000 --- a/demos/richtext-editor/src/themes/StickyEditorTheme.css +++ /dev/null @@ -1,13 +0,0 @@ -/** - * Copyright (c) Meta Platforms, Inc. and affiliates. - * - * This source code is licensed under the MIT license found in the - * LICENSE file in the root directory of this source tree. - * - * - */ - -.StickyEditorTheme__paragraph { - margin: 0; - position: 'relative'; -} diff --git a/demos/richtext-editor/src/themes/StickyEditorTheme.ts b/demos/richtext-editor/src/themes/StickyEditorTheme.ts deleted file mode 100644 index 33e3ef6..0000000 --- a/demos/richtext-editor/src/themes/StickyEditorTheme.ts +++ /dev/null @@ -1,18 +0,0 @@ -/** - * Copyright (c) Syed Umar Anis - * - * This source code is licensed under the MIT license found in the - * LICENSE file in the root directory of this source tree. - * - */ - -import './StickyEditorTheme.css'; - -import baseTheme from './PlaygroundEditorTheme'; - -const theme = { - ...baseTheme, - paragraph: 'StickyEditorTheme__paragraph', -}; - -export default theme; diff --git a/demos/sveltekit/src/RichTextComposer.svelte b/demos/sveltekit/src/RichTextComposer.svelte index 978eb39..6e28232 100644 --- a/demos/sveltekit/src/RichTextComposer.svelte +++ b/demos/sveltekit/src/RichTextComposer.svelte @@ -19,7 +19,7 @@ HorizontalRuleNode, ImageNode, } from 'svelte-lexical'; - import PlaygroundEditorTheme from './themes/PlaygroundEditorTheme'; + import {editorTheme as PlaygroundEditorTheme} from 'svelte-lexical'; import { $getRoot as getRoot, $createTextNode as createTextNode, diff --git a/demos/sveltekit/src/themes/CommentEditorTheme.css b/demos/sveltekit/src/themes/CommentEditorTheme.css deleted file mode 100644 index e50318c..0000000 --- a/demos/sveltekit/src/themes/CommentEditorTheme.css +++ /dev/null @@ -1,13 +0,0 @@ -/** - * Copyright (c) Meta Platforms, Inc. and affiliates. - * - * This source code is licensed under the MIT license found in the - * LICENSE file in the root directory of this source tree. - * - * - */ - -.CommentEditorTheme__paragraph { - margin: 0; - position: 'relative'; -} diff --git a/demos/sveltekit/src/themes/CommentEditorTheme.ts b/demos/sveltekit/src/themes/CommentEditorTheme.ts deleted file mode 100644 index 04dd660..0000000 --- a/demos/sveltekit/src/themes/CommentEditorTheme.ts +++ /dev/null @@ -1,18 +0,0 @@ -/** - * Copyright (c) Meta Platforms, Inc. and affiliates. - * - * This source code is licensed under the MIT license found in the - * LICENSE file in the root directory of this source tree. - * - */ - -import './CommentEditorTheme.css'; - -import baseTheme from './PlaygroundEditorTheme'; - -const theme = { - ...baseTheme, - paragraph: 'CommentEditorTheme__paragraph', -}; - -export default theme; diff --git a/demos/sveltekit/src/themes/PlaygroundEditorTheme.css b/demos/sveltekit/src/themes/PlaygroundEditorTheme.css deleted file mode 100644 index 4e5b551..0000000 --- a/demos/sveltekit/src/themes/PlaygroundEditorTheme.css +++ /dev/null @@ -1,461 +0,0 @@ -/** - * Copyright (c) Meta Platforms, Inc. and affiliates. - * - * This source code is licensed under the MIT license found in the - * LICENSE file in the root directory of this source tree. - * - * - */ -.PlaygroundEditorTheme__ltr { - text-align: left; -} -.PlaygroundEditorTheme__rtl { - text-align: right; -} -.PlaygroundEditorTheme__paragraph { - margin: 0; - position: relative; -} -.PlaygroundEditorTheme__quote { - margin: 0; - margin-left: 20px; - margin-bottom: 10px; - font-size: 15px; - color: rgb(101, 103, 107); - border-left-color: rgb(206, 208, 212); - border-left-width: 4px; - border-left-style: solid; - padding-left: 16px; -} -.PlaygroundEditorTheme__h1 { - font-size: 24px; - color: rgb(5, 5, 5); - font-weight: 400; - margin: 0; -} -.PlaygroundEditorTheme__h2 { - font-size: 15px; - color: rgb(101, 103, 107); - font-weight: 700; - margin: 0; - text-transform: uppercase; -} -.PlaygroundEditorTheme__h3 { - font-size: 12px; - margin: 0; - text-transform: uppercase; -} -.PlaygroundEditorTheme__indent { - --lexical-indent-base-value: 40px; -} -.PlaygroundEditorTheme__textBold { - font-weight: bold; -} -.PlaygroundEditorTheme__textItalic { - font-style: italic; -} -.PlaygroundEditorTheme__textUnderline { - text-decoration: underline; -} -.PlaygroundEditorTheme__textStrikethrough { - text-decoration: line-through; -} -.PlaygroundEditorTheme__textUnderlineStrikethrough { - text-decoration: underline line-through; -} -.PlaygroundEditorTheme__textSubscript { - font-size: 0.8em; - vertical-align: sub !important; -} -.PlaygroundEditorTheme__textSuperscript { - font-size: 0.8em; - vertical-align: super; -} -.PlaygroundEditorTheme__textCode { - background-color: rgb(240, 242, 245); - padding: 1px 0.25rem; - font-family: Menlo, Consolas, Monaco, monospace; - font-size: 94%; -} -.PlaygroundEditorTheme__hashtag { - background-color: rgba(88, 144, 255, 0.15); - border-bottom: 1px solid rgba(88, 144, 255, 0.3); -} -.PlaygroundEditorTheme__link { - color: rgb(33, 111, 219); - text-decoration: none; -} -.PlaygroundEditorTheme__link:hover { - text-decoration: underline; - cursor: pointer; -} -.PlaygroundEditorTheme__code { - background-color: rgb(240, 242, 245); - font-family: Menlo, Consolas, Monaco, monospace; - display: block; - padding: 8px 8px 8px 52px; - line-height: 1.53; - font-size: 13px; - margin: 0; - margin-top: 8px; - margin-bottom: 8px; - overflow-x: auto; - position: relative; - tab-size: 2; -} -.PlaygroundEditorTheme__code:before { - content: attr(data-gutter); - position: absolute; - background-color: #eee; - left: 0; - top: 0; - border-right: 1px solid #ccc; - padding: 8px; - color: #777; - white-space: pre-wrap; - text-align: right; - min-width: 25px; -} -.PlaygroundEditorTheme__table { - border-collapse: collapse; - border-spacing: 0; - overflow-y: scroll; - overflow-x: scroll; - table-layout: fixed; - width: max-content; - margin: 30px 0; -} -.PlaygroundEditorTheme__tableSelection *::selection { - background-color: transparent; -} -.PlaygroundEditorTheme__tableSelected { - outline: 2px solid rgb(60, 132, 244); -} -.PlaygroundEditorTheme__tableCell { - border: 1px solid #bbb; - width: 75px; - min-width: 75px; - vertical-align: top; - text-align: start; - padding: 6px 8px; - position: relative; - outline: none; -} -.PlaygroundEditorTheme__tableCellSortedIndicator { - display: block; - opacity: 0.5; - position: absolute; - bottom: 0; - left: 0; - width: 100%; - height: 4px; - background-color: #999; -} -.PlaygroundEditorTheme__tableCellResizer { - position: absolute; - right: -4px; - height: 100%; - width: 8px; - cursor: ew-resize; - z-index: 10; - top: 0; -} -.PlaygroundEditorTheme__tableCellHeader { - background-color: #f2f3f5; - text-align: start; -} -.PlaygroundEditorTheme__tableCellSelected { - background-color: #c9dbf0; -} -.PlaygroundEditorTheme__tableCellPrimarySelected { - border: 2px solid rgb(60, 132, 244); - display: block; - height: calc(100% - 2px); - position: absolute; - width: calc(100% - 2px); - left: -1px; - top: -1px; - z-index: 2; -} -.PlaygroundEditorTheme__tableCellEditing { - box-shadow: 0 0 5px rgba(0, 0, 0, 0.4); - border-radius: 3px; -} -.PlaygroundEditorTheme__tableAddColumns { - position: absolute; - top: 0; - width: 20px; - background-color: #eee; - height: 100%; - right: -25px; - animation: table-controls 0.2s ease; - border: 0; - cursor: pointer; -} -.PlaygroundEditorTheme__tableAddColumns:after { - background-image: url(../images/icons/plus.svg); - background-size: contain; - background-position: center; - background-repeat: no-repeat; - display: block; - content: ' '; - position: absolute; - top: 0; - left: 0; - width: 100%; - height: 100%; - opacity: 0.4; -} -.PlaygroundEditorTheme__tableAddColumns:hover { - background-color: #c9dbf0; -} -.PlaygroundEditorTheme__tableAddRows { - position: absolute; - bottom: -25px; - width: calc(100% - 25px); - background-color: #eee; - height: 20px; - left: 0; - animation: table-controls 0.2s ease; - border: 0; - cursor: pointer; -} -.PlaygroundEditorTheme__tableAddRows:after { - background-image: url(../images/icons/plus.svg); - background-size: contain; - background-position: center; - background-repeat: no-repeat; - display: block; - content: ' '; - position: absolute; - top: 0; - left: 0; - width: 100%; - height: 100%; - opacity: 0.4; -} -.PlaygroundEditorTheme__tableAddRows:hover { - background-color: #c9dbf0; -} -@keyframes table-controls { - 0% { - opacity: 0; - } - 100% { - opacity: 1; - } -} -.PlaygroundEditorTheme__tableCellResizeRuler { - display: block; - position: absolute; - width: 1px; - background-color: rgb(60, 132, 244); - height: 100%; - top: 0; -} -.PlaygroundEditorTheme__tableCellActionButtonContainer { - display: block; - right: 5px; - top: 6px; - position: absolute; - z-index: 4; - width: 20px; - height: 20px; -} -.PlaygroundEditorTheme__tableCellActionButton { - background-color: #eee; - display: block; - border: 0; - border-radius: 20px; - width: 20px; - height: 20px; - color: #222; - cursor: pointer; -} -.PlaygroundEditorTheme__tableCellActionButton:hover { - background-color: #ddd; -} -.PlaygroundEditorTheme__characterLimit { - display: inline; - background-color: #ffbbbb !important; -} -.PlaygroundEditorTheme__ol1 { - padding: 0; - margin: 0; - list-style-position: outside; -} -.PlaygroundEditorTheme__ol2 { - padding: 0; - margin: 0; - list-style-type: upper-alpha; - list-style-position: outside; -} -.PlaygroundEditorTheme__ol3 { - padding: 0; - margin: 0; - list-style-type: lower-alpha; - list-style-position: outside; -} -.PlaygroundEditorTheme__ol4 { - padding: 0; - margin: 0; - list-style-type: upper-roman; - list-style-position: outside; -} -.PlaygroundEditorTheme__ol5 { - padding: 0; - margin: 0; - list-style-type: lower-roman; - list-style-position: outside; -} -.PlaygroundEditorTheme__ul { - padding: 0; - margin: 0; - list-style-position: outside; -} -.PlaygroundEditorTheme__listItem { - margin: 0 32px; -} -.PlaygroundEditorTheme__listItemChecked, -.PlaygroundEditorTheme__listItemUnchecked { - position: relative; - margin-left: 8px; - margin-right: 8px; - padding-left: 24px; - padding-right: 24px; - list-style-type: none; - outline: none; -} -.PlaygroundEditorTheme__listItemChecked { - text-decoration: line-through; -} -.PlaygroundEditorTheme__listItemUnchecked:before, -.PlaygroundEditorTheme__listItemChecked:before { - content: ''; - width: 16px; - height: 16px; - top: 2px; - left: 0; - cursor: pointer; - display: block; - background-size: cover; - position: absolute; -} -.PlaygroundEditorTheme__listItemUnchecked[dir='rtl']:before, -.PlaygroundEditorTheme__listItemChecked[dir='rtl']:before { - left: auto; - right: 0; -} -.PlaygroundEditorTheme__listItemUnchecked:focus:before, -.PlaygroundEditorTheme__listItemChecked:focus:before { - box-shadow: 0 0 0 2px #a6cdfe; - border-radius: 2px; -} -.PlaygroundEditorTheme__listItemUnchecked:before { - border: 1px solid #999; - border-radius: 2px; -} -.PlaygroundEditorTheme__listItemChecked:before { - border: 1px solid rgb(61, 135, 245); - border-radius: 2px; - background-color: #3d87f5; - background-repeat: no-repeat; -} -.PlaygroundEditorTheme__listItemChecked:after { - content: ''; - cursor: pointer; - border-color: #fff; - border-style: solid; - position: absolute; - display: block; - top: 6px; - width: 3px; - left: 7px; - right: 7px; - height: 6px; - transform: rotate(45deg); - border-width: 0 2px 2px 0; -} -.PlaygroundEditorTheme__nestedListItem { - list-style-type: none; -} -.PlaygroundEditorTheme__nestedListItem:before, -.PlaygroundEditorTheme__nestedListItem:after { - display: none; -} -.PlaygroundEditorTheme__tokenComment { - color: slategray; -} -.PlaygroundEditorTheme__tokenPunctuation { - color: #999; -} -.PlaygroundEditorTheme__tokenProperty { - color: #905; -} -.PlaygroundEditorTheme__tokenSelector { - color: #690; -} -.PlaygroundEditorTheme__tokenOperator { - color: #9a6e3a; -} -.PlaygroundEditorTheme__tokenAttr { - color: #07a; -} -.PlaygroundEditorTheme__tokenVariable { - color: #e90; -} -.PlaygroundEditorTheme__tokenFunction { - color: #dd4a68; -} -.PlaygroundEditorTheme__mark { - background: rgba(255, 212, 0, 0.14); - border-bottom: 2px solid rgba(255, 212, 0, 0.3); - padding-bottom: 2px; -} -.PlaygroundEditorTheme__markOverlap { - background: rgba(255, 212, 0, 0.3); - border-bottom: 2px solid rgba(255, 212, 0, 0.7); -} -.PlaygroundEditorTheme__mark.selected { - background: rgba(255, 212, 0, 0.5); - border-bottom: 2px solid rgba(255, 212, 0, 1); -} -.PlaygroundEditorTheme__markOverlap.selected { - background: rgba(255, 212, 0, 0.7); - border-bottom: 2px solid rgba(255, 212, 0, 0.7); -} -.PlaygroundEditorTheme__embedBlock { - user-select: none; -} -.PlaygroundEditorTheme__embedBlockFocus { - outline: 2px solid rgb(60, 132, 244); -} -.PlaygroundEditorTheme__layoutContainer { - display: grid; - gap: 10px; - margin: 10px 0; -} -.PlaygroundEditorTheme__layoutItem { - border: 1px dashed #ddd; - padding: 8px 16px; -} -.PlaygroundEditorTheme__autocomplete { - color: #ccc; -} -.PlaygroundEditorTheme__hr { - padding: 2px 2px; - border: none; - margin: 1em 0; - cursor: pointer; -} -.PlaygroundEditorTheme__hr:after { - content: ''; - display: block; - height: 2px; - background-color: #ccc; - line-height: 2px; -} -.PlaygroundEditorTheme__hr.selected { - outline: 2px solid rgb(60, 132, 244); - user-select: none; -} diff --git a/demos/sveltekit/src/themes/PlaygroundEditorTheme.ts b/demos/sveltekit/src/themes/PlaygroundEditorTheme.ts deleted file mode 100644 index ffc3adf..0000000 --- a/demos/sveltekit/src/themes/PlaygroundEditorTheme.ts +++ /dev/null @@ -1,112 +0,0 @@ -/** - * Copyright (c) Syed Umar Anis - * - * This source code is licensed under the MIT license found in the - * LICENSE file in the root directory of this source tree. - * - */ - -import './PlaygroundEditorTheme.css'; - -const theme = { - blockCursor: 'PlaygroundEditorTheme__blockCursor', - characterLimit: 'PlaygroundEditorTheme__characterLimit', - code: 'PlaygroundEditorTheme__code', - codeHighlight: { - atrule: 'PlaygroundEditorTheme__tokenAttr', - attr: 'PlaygroundEditorTheme__tokenAttr', - boolean: 'PlaygroundEditorTheme__tokenProperty', - builtin: 'PlaygroundEditorTheme__tokenSelector', - cdata: 'PlaygroundEditorTheme__tokenComment', - char: 'PlaygroundEditorTheme__tokenSelector', - class: 'PlaygroundEditorTheme__tokenFunction', - 'class-name': 'PlaygroundEditorTheme__tokenFunction', - comment: 'PlaygroundEditorTheme__tokenComment', - constant: 'PlaygroundEditorTheme__tokenProperty', - deleted: 'PlaygroundEditorTheme__tokenProperty', - doctype: 'PlaygroundEditorTheme__tokenComment', - entity: 'PlaygroundEditorTheme__tokenOperator', - function: 'PlaygroundEditorTheme__tokenFunction', - important: 'PlaygroundEditorTheme__tokenVariable', - inserted: 'PlaygroundEditorTheme__tokenSelector', - keyword: 'PlaygroundEditorTheme__tokenAttr', - namespace: 'PlaygroundEditorTheme__tokenVariable', - number: 'PlaygroundEditorTheme__tokenProperty', - operator: 'PlaygroundEditorTheme__tokenOperator', - prolog: 'PlaygroundEditorTheme__tokenComment', - property: 'PlaygroundEditorTheme__tokenProperty', - punctuation: 'PlaygroundEditorTheme__tokenPunctuation', - regex: 'PlaygroundEditorTheme__tokenVariable', - selector: 'PlaygroundEditorTheme__tokenSelector', - string: 'PlaygroundEditorTheme__tokenSelector', - symbol: 'PlaygroundEditorTheme__tokenProperty', - tag: 'PlaygroundEditorTheme__tokenProperty', - url: 'PlaygroundEditorTheme__tokenOperator', - variable: 'PlaygroundEditorTheme__tokenVariable', - }, - embedBlock: { - base: 'PlaygroundEditorTheme__embedBlock', - focus: 'PlaygroundEditorTheme__embedBlockFocus', - }, - hashtag: 'PlaygroundEditorTheme__hashtag', - heading: { - h1: 'PlaygroundEditorTheme__h1', - h2: 'PlaygroundEditorTheme__h2', - h3: 'PlaygroundEditorTheme__h3', - h4: 'PlaygroundEditorTheme__h4', - h5: 'PlaygroundEditorTheme__h5', - h6: 'PlaygroundEditorTheme__h6', - }, - hr: 'PlaygroundEditorTheme__hr', - image: 'editor-image', - link: 'PlaygroundEditorTheme__link', - list: { - listitem: 'PlaygroundEditorTheme__listItem', - listitemChecked: 'PlaygroundEditorTheme__listItemChecked', - listitemUnchecked: 'PlaygroundEditorTheme__listItemUnchecked', - nested: { - listitem: 'PlaygroundEditorTheme__nestedListItem', - }, - olDepth: [ - 'PlaygroundEditorTheme__ol1', - 'PlaygroundEditorTheme__ol2', - 'PlaygroundEditorTheme__ol3', - 'PlaygroundEditorTheme__ol4', - 'PlaygroundEditorTheme__ol5', - ], - ul: 'PlaygroundEditorTheme__ul', - }, - ltr: 'PlaygroundEditorTheme__ltr', - mark: 'PlaygroundEditorTheme__mark', - markOverlap: 'PlaygroundEditorTheme__markOverlap', - paragraph: 'PlaygroundEditorTheme__paragraph', - quote: 'PlaygroundEditorTheme__quote', - rtl: 'PlaygroundEditorTheme__rtl', - table: 'PlaygroundEditorTheme__table', - tableAddColumns: 'PlaygroundEditorTheme__tableAddColumns', - tableAddRows: 'PlaygroundEditorTheme__tableAddRows', - tableCell: 'PlaygroundEditorTheme__tableCell', - tableCellActionButton: 'PlaygroundEditorTheme__tableCellActionButton', - tableCellActionButtonContainer: - 'PlaygroundEditorTheme__tableCellActionButtonContainer', - tableCellEditing: 'PlaygroundEditorTheme__tableCellEditing', - tableCellHeader: 'PlaygroundEditorTheme__tableCellHeader', - tableCellPrimarySelected: 'PlaygroundEditorTheme__tableCellPrimarySelected', - tableCellResizer: 'PlaygroundEditorTheme__tableCellResizer', - tableCellSelected: 'PlaygroundEditorTheme__tableCellSelected', - tableCellSortedIndicator: 'PlaygroundEditorTheme__tableCellSortedIndicator', - tableResizeRuler: 'PlaygroundEditorTheme__tableCellResizeRuler', - tableSelected: 'PlaygroundEditorTheme__tableSelected', - text: { - bold: 'PlaygroundEditorTheme__textBold', - code: 'PlaygroundEditorTheme__textCode', - italic: 'PlaygroundEditorTheme__textItalic', - strikethrough: 'PlaygroundEditorTheme__textStrikethrough', - subscript: 'PlaygroundEditorTheme__textSubscript', - superscript: 'PlaygroundEditorTheme__textSuperscript', - underline: 'PlaygroundEditorTheme__textUnderline', - underlineStrikethrough: 'PlaygroundEditorTheme__textUnderlineStrikethrough', - }, -}; - -export default theme; diff --git a/demos/sveltekit/src/themes/StickyEditorTheme.css b/demos/sveltekit/src/themes/StickyEditorTheme.css deleted file mode 100644 index f563869..0000000 --- a/demos/sveltekit/src/themes/StickyEditorTheme.css +++ /dev/null @@ -1,13 +0,0 @@ -/** - * Copyright (c) Meta Platforms, Inc. and affiliates. - * - * This source code is licensed under the MIT license found in the - * LICENSE file in the root directory of this source tree. - * - * - */ - -.StickyEditorTheme__paragraph { - margin: 0; - position: 'relative'; -} diff --git a/demos/sveltekit/src/themes/StickyEditorTheme.ts b/demos/sveltekit/src/themes/StickyEditorTheme.ts deleted file mode 100644 index 33e3ef6..0000000 --- a/demos/sveltekit/src/themes/StickyEditorTheme.ts +++ /dev/null @@ -1,18 +0,0 @@ -/** - * Copyright (c) Syed Umar Anis - * - * This source code is licensed under the MIT license found in the - * LICENSE file in the root directory of this source tree. - * - */ - -import './StickyEditorTheme.css'; - -import baseTheme from './PlaygroundEditorTheme'; - -const theme = { - ...baseTheme, - paragraph: 'StickyEditorTheme__paragraph', -}; - -export default theme; diff --git a/packages/svelte-lexical/src/routes/RichTextComposer.svelte b/packages/svelte-lexical/src/routes/RichTextComposer.svelte index 3cd8e80..412123b 100644 --- a/packages/svelte-lexical/src/routes/RichTextComposer.svelte +++ b/packages/svelte-lexical/src/routes/RichTextComposer.svelte @@ -39,7 +39,7 @@ LayoutContainerNode, LayoutItemNode, } from '$lib/index.js'; - import PlaygroundEditorTheme from './themes/PlaygroundEditorTheme.js'; + import editorTheme from '$lib/themes/PlaygroundEditorTheme.js'; import { $getRoot as getRoot, $createTextNode as createTextNode, @@ -56,7 +56,7 @@ let editorDiv; const initialConfig = { - theme: PlaygroundEditorTheme, + theme: editorTheme, namespace: 'pg_sveltekit', nodes: [ HeadingNode, diff --git a/packages/svelte-lexical/src/routes/examples/Composer1PlainText.svelte b/packages/svelte-lexical/src/routes/examples/Composer1PlainText.svelte index 4544484..677979e 100644 --- a/packages/svelte-lexical/src/routes/examples/Composer1PlainText.svelte +++ b/packages/svelte-lexical/src/routes/examples/Composer1PlainText.svelte @@ -6,11 +6,11 @@ PlainTextPlugin, HistoryPlugin, } from '$lib/index.js'; - import PlaygroundEditorTheme from '../themes/PlaygroundEditorTheme.js'; + import editorTheme from '$lib/themes/PlaygroundEditorTheme.js'; import Composer1Toolbar from './Composer1Toolbar.svelte'; const initialConfig = { - theme: PlaygroundEditorTheme, + theme: editorTheme, namespace: 'Playground', nodes: [], onError: (error: Error) => { diff --git a/packages/svelte-lexical/src/routes/examples/Composer2RichTextBasic.svelte b/packages/svelte-lexical/src/routes/examples/Composer2RichTextBasic.svelte index 4d26b50..6473107 100644 --- a/packages/svelte-lexical/src/routes/examples/Composer2RichTextBasic.svelte +++ b/packages/svelte-lexical/src/routes/examples/Composer2RichTextBasic.svelte @@ -5,7 +5,7 @@ ActionBar, RichTextPlugin, } from '$lib/index.js'; - import PlaygroundEditorTheme from '../themes/PlaygroundEditorTheme.js'; + import editorTheme from '$lib/themes/PlaygroundEditorTheme.js'; import { $getRoot as getRoot, $createTextNode as createTextNode, @@ -14,7 +14,7 @@ import Composer2Toolbar from './Composer2Toolbar.svelte'; const initialConfig = { - theme: PlaygroundEditorTheme, + theme: editorTheme, namespace: 'pg_sveltekit', nodes: [], onError: (error: Error) => { diff --git a/packages/svelte-lexical/src/routes/examples/Composer3RichTextAdv.svelte b/packages/svelte-lexical/src/routes/examples/Composer3RichTextAdv.svelte index b2d664d..288e70b 100644 --- a/packages/svelte-lexical/src/routes/examples/Composer3RichTextAdv.svelte +++ b/packages/svelte-lexical/src/routes/examples/Composer3RichTextAdv.svelte @@ -23,7 +23,7 @@ HorizontalRuleNode, ImageNode, } from '$lib/index.js'; - import PlaygroundEditorTheme from '../themes/PlaygroundEditorTheme.js'; + import editorTheme from '$lib/themes/PlaygroundEditorTheme.js'; import { $getRoot as getRoot, $createTextNode as createTextNode, @@ -33,7 +33,7 @@ import Composer3Toolbar from './Composer3Toolbar.svelte'; const initialConfig = { - theme: PlaygroundEditorTheme, + theme: editorTheme, namespace: 'pg_sveltekit', nodes: [ HeadingNode, diff --git a/packages/svelte-lexical/src/routes/examples/Composer4RTLinks.svelte b/packages/svelte-lexical/src/routes/examples/Composer4RTLinks.svelte index 95bf2f2..c13fe9a 100644 --- a/packages/svelte-lexical/src/routes/examples/Composer4RTLinks.svelte +++ b/packages/svelte-lexical/src/routes/examples/Composer4RTLinks.svelte @@ -32,7 +32,7 @@ HorizontalRuleNode, ImageNode, } from '$lib/index.js'; - import PlaygroundEditorTheme from '../themes/PlaygroundEditorTheme.js'; + import editorTheme from '$lib/themes/PlaygroundEditorTheme.js'; import { $getRoot as getRoot, $createTextNode as createTextNode, @@ -45,7 +45,7 @@ let editorDiv; const initialConfig = { - theme: PlaygroundEditorTheme, + theme: editorTheme, namespace: 'pg_sveltekit', nodes: [ HeadingNode, diff --git a/packages/svelte-lexical/src/routes/examples/Composer5Code.svelte b/packages/svelte-lexical/src/routes/examples/Composer5Code.svelte index 8c99fef..15fedc0 100644 --- a/packages/svelte-lexical/src/routes/examples/Composer5Code.svelte +++ b/packages/svelte-lexical/src/routes/examples/Composer5Code.svelte @@ -36,7 +36,7 @@ HorizontalRuleNode, ImageNode, } from '$lib/index.js'; - import PlaygroundEditorTheme from '../themes/PlaygroundEditorTheme.js'; + import editorTheme from '$lib/themes/PlaygroundEditorTheme.js'; import { $getRoot as getRoot, $createTextNode as createTextNode, @@ -49,7 +49,7 @@ let editorDiv; const initialConfig = { - theme: PlaygroundEditorTheme, + theme: editorTheme, namespace: 'pg_sveltekit', nodes: [ HeadingNode, diff --git a/packages/svelte-lexical/src/routes/themes/CommentEditorTheme.css b/packages/svelte-lexical/src/routes/themes/CommentEditorTheme.css deleted file mode 100644 index e50318c..0000000 --- a/packages/svelte-lexical/src/routes/themes/CommentEditorTheme.css +++ /dev/null @@ -1,13 +0,0 @@ -/** - * Copyright (c) Meta Platforms, Inc. and affiliates. - * - * This source code is licensed under the MIT license found in the - * LICENSE file in the root directory of this source tree. - * - * - */ - -.CommentEditorTheme__paragraph { - margin: 0; - position: 'relative'; -} diff --git a/packages/svelte-lexical/src/routes/themes/CommentEditorTheme.ts b/packages/svelte-lexical/src/routes/themes/CommentEditorTheme.ts deleted file mode 100644 index d70dc5a..0000000 --- a/packages/svelte-lexical/src/routes/themes/CommentEditorTheme.ts +++ /dev/null @@ -1,18 +0,0 @@ -/** - * Copyright (c) Meta Platforms, Inc. and affiliates. - * - * This source code is licensed under the MIT license found in the - * LICENSE file in the root directory of this source tree. - * - */ - -import './CommentEditorTheme.css'; - -import baseTheme from './PlaygroundEditorTheme.js'; - -const theme = { - ...baseTheme, - paragraph: 'CommentEditorTheme__paragraph', -}; - -export default theme; diff --git a/packages/svelte-lexical/src/routes/themes/PlaygroundEditorTheme.css b/packages/svelte-lexical/src/routes/themes/PlaygroundEditorTheme.css deleted file mode 100644 index 7168469..0000000 --- a/packages/svelte-lexical/src/routes/themes/PlaygroundEditorTheme.css +++ /dev/null @@ -1,470 +0,0 @@ -/** - * Copyright (c) Meta Platforms, Inc. and affiliates. - * - * This source code is licensed under the MIT license found in the - * LICENSE file in the root directory of this source tree. - * - * - */ -.PlaygroundEditorTheme__layoutContainer { - display: grid; - gap: 10px; - margin: 10px 0; -} -.PlaygroundEditorTheme__layoutItem { - border: 1px dashed #ddd; - padding: 8px 16px; -} -.PlaygroundEditorTheme__ltr { - text-align: left; -} -.PlaygroundEditorTheme__rtl { - text-align: right; -} -.PlaygroundEditorTheme__paragraph { - margin: 0; - position: relative; -} -.PlaygroundEditorTheme__quote { - margin: 0; - margin-left: 20px; - margin-bottom: 10px; - font-size: 15px; - color: rgb(101, 103, 107); - border-left-color: rgb(206, 208, 212); - border-left-width: 4px; - border-left-style: solid; - padding-left: 16px; -} -.PlaygroundEditorTheme__h1 { - font-size: 24px; - color: rgb(5, 5, 5); - font-weight: 400; - margin: 0; -} -.PlaygroundEditorTheme__h2 { - font-size: 15px; - color: rgb(101, 103, 107); - font-weight: 700; - margin: 0; - text-transform: uppercase; -} -.PlaygroundEditorTheme__h3 { - font-size: 12px; - margin: 0; - text-transform: uppercase; -} -.PlaygroundEditorTheme__indent { - --lexical-indent-base-value: 40px; -} -.PlaygroundEditorTheme__textBold { - font-weight: bold; -} -.PlaygroundEditorTheme__textItalic { - font-style: italic; -} -.PlaygroundEditorTheme__textUnderline { - text-decoration: underline; -} -.PlaygroundEditorTheme__textStrikethrough { - text-decoration: line-through; -} -.PlaygroundEditorTheme__textUnderlineStrikethrough { - text-decoration: underline line-through; -} -.PlaygroundEditorTheme__textSubscript { - font-size: 0.8em; - vertical-align: sub !important; -} -.PlaygroundEditorTheme__textSuperscript { - font-size: 0.8em; - vertical-align: super; -} -.PlaygroundEditorTheme__textCode { - background-color: rgb(240, 242, 245); - padding: 1px 0.25rem; - font-family: Menlo, Consolas, Monaco, monospace; - font-size: 94%; -} -.PlaygroundEditorTheme__hashtag { - background-color: rgba(88, 144, 255, 0.15); - border-bottom: 1px solid rgba(88, 144, 255, 0.3); -} -.PlaygroundEditorTheme__link { - color: rgb(33, 111, 219); - text-decoration: none; -} -.PlaygroundEditorTheme__link:hover { - text-decoration: underline; - cursor: pointer; -} -.PlaygroundEditorTheme__code { - background-color: rgb(240, 242, 245); - font-family: Menlo, Consolas, Monaco, monospace; - display: block; - padding: 8px 8px 8px 52px; - line-height: 1.53; - font-size: 13px; - margin: 0; - margin-top: 8px; - margin-bottom: 8px; - overflow-x: auto; - position: relative; - tab-size: 2; -} -.PlaygroundEditorTheme__code:before { - content: attr(data-gutter); - position: absolute; - background-color: #eee; - left: 0; - top: 0; - border-right: 1px solid #ccc; - padding: 8px; - color: #777; - white-space: pre-wrap; - text-align: right; - min-width: 25px; -} -.PlaygroundEditorTheme__table { - border-collapse: collapse; - border-spacing: 0; - overflow-y: scroll; - overflow-x: scroll; - table-layout: fixed; - width: max-content; - margin: 30px 0; -} -.PlaygroundEditorTheme__tableSelection *::selection { - background-color: transparent; -} -.PlaygroundEditorTheme__tableSelected { - outline: 2px solid rgb(60, 132, 244); -} -.PlaygroundEditorTheme__tableCell { - border: 1px solid #bbb; - width: 75px; - min-width: 75px; - vertical-align: top; - text-align: start; - padding: 6px 8px; - position: relative; - outline: none; -} -.PlaygroundEditorTheme__tableCellSortedIndicator { - display: block; - opacity: 0.5; - position: absolute; - bottom: 0; - left: 0; - width: 100%; - height: 4px; - background-color: #999; -} -.PlaygroundEditorTheme__tableCellResizer { - position: absolute; - right: -4px; - height: 100%; - width: 8px; - cursor: ew-resize; - z-index: 10; - top: 0; -} -.PlaygroundEditorTheme__tableCellHeader { - background-color: #f2f3f5; - text-align: start; -} -.PlaygroundEditorTheme__tableCellSelected { - background-color: #c9dbf0; -} -.PlaygroundEditorTheme__tableCellPrimarySelected { - border: 2px solid rgb(60, 132, 244); - display: block; - height: calc(100% - 2px); - position: absolute; - width: calc(100% - 2px); - left: -1px; - top: -1px; - z-index: 2; -} -.PlaygroundEditorTheme__tableCellEditing { - box-shadow: 0 0 5px rgba(0, 0, 0, 0.4); - border-radius: 3px; -} -.PlaygroundEditorTheme__tableAddColumns { - position: absolute; - top: 0; - width: 20px; - background-color: #eee; - height: 100%; - right: -25px; - animation: table-controls 0.2s ease; - border: 0; - cursor: pointer; -} -.PlaygroundEditorTheme__tableAddColumns:after { - background-image: url(/images/icons/plus.svg); - background-size: contain; - background-position: center; - background-repeat: no-repeat; - display: block; - content: ' '; - position: absolute; - top: 0; - left: 0; - width: 100%; - height: 100%; - opacity: 0.4; -} -.PlaygroundEditorTheme__tableAddColumns:hover { - background-color: #c9dbf0; -} -.PlaygroundEditorTheme__tableAddRows { - position: absolute; - bottom: -25px; - width: calc(100% - 25px); - background-color: #eee; - height: 20px; - left: 0; - animation: table-controls 0.2s ease; - border: 0; - cursor: pointer; -} -.PlaygroundEditorTheme__tableAddRows:after { - background-image: url(/images/icons/plus.svg); - background-size: contain; - background-position: center; - background-repeat: no-repeat; - display: block; - content: ' '; - position: absolute; - top: 0; - left: 0; - width: 100%; - height: 100%; - opacity: 0.4; -} -.PlaygroundEditorTheme__tableAddRows:hover { - background-color: #c9dbf0; -} -@keyframes table-controls { - 0% { - opacity: 0; - } - 100% { - opacity: 1; - } -} -.PlaygroundEditorTheme__tableCellResizeRuler { - display: block; - position: absolute; - width: 1px; - background-color: rgb(60, 132, 244); - height: 100%; - top: 0; -} -.PlaygroundEditorTheme__tableCellActionButtonContainer { - display: block; - right: 5px; - top: 6px; - position: absolute; - z-index: 4; - width: 20px; - height: 20px; -} -.PlaygroundEditorTheme__tableCellActionButton { - background-color: #eee; - display: block; - border: 0; - border-radius: 20px; - width: 20px; - height: 20px; - color: #222; - cursor: pointer; -} -.PlaygroundEditorTheme__tableCellActionButton:hover { - background-color: #ddd; -} -.PlaygroundEditorTheme__characterLimit { - display: inline; - background-color: #ffbbbb !important; -} -.PlaygroundEditorTheme__ol1 { - padding: 0; - margin: 0; - list-style-position: outside; -} -.PlaygroundEditorTheme__ol2 { - padding: 0; - margin: 0; - list-style-type: upper-alpha; - list-style-position: outside; -} -.PlaygroundEditorTheme__ol3 { - padding: 0; - margin: 0; - list-style-type: lower-alpha; - list-style-position: outside; -} -.PlaygroundEditorTheme__ol4 { - padding: 0; - margin: 0; - list-style-type: upper-roman; - list-style-position: outside; -} -.PlaygroundEditorTheme__ol5 { - padding: 0; - margin: 0; - list-style-type: lower-roman; - list-style-position: outside; -} -.PlaygroundEditorTheme__ul { - padding: 0; - margin: 0; - list-style-position: outside; -} -.PlaygroundEditorTheme__listItem { - margin: 0 32px; -} -.PlaygroundEditorTheme__listItemChecked, -.PlaygroundEditorTheme__listItemUnchecked { - position: relative; - margin-left: 8px; - margin-right: 8px; - padding-left: 24px; - padding-right: 24px; - list-style-type: none; - outline: none; -} -.PlaygroundEditorTheme__listItemChecked { - text-decoration: line-through; -} -.PlaygroundEditorTheme__listItemUnchecked:before, -.PlaygroundEditorTheme__listItemChecked:before { - content: ''; - width: 16px; - height: 16px; - top: 2px; - left: 0; - cursor: pointer; - display: block; - background-size: cover; - position: absolute; -} -.PlaygroundEditorTheme__listItemUnchecked[dir='rtl']:before, -.PlaygroundEditorTheme__listItemChecked[dir='rtl']:before { - left: auto; - right: 0; -} -.PlaygroundEditorTheme__listItemUnchecked:focus:before, -.PlaygroundEditorTheme__listItemChecked:focus:before { - box-shadow: 0 0 0 2px #a6cdfe; - border-radius: 2px; -} -.PlaygroundEditorTheme__listItemUnchecked:before { - border: 1px solid #999; - border-radius: 2px; -} -.PlaygroundEditorTheme__listItemChecked:before { - border: 1px solid rgb(61, 135, 245); - border-radius: 2px; - background-color: #3d87f5; - background-repeat: no-repeat; -} -.PlaygroundEditorTheme__listItemChecked:after { - content: ''; - cursor: pointer; - border-color: #fff; - border-style: solid; - position: absolute; - display: block; - top: 6px; - width: 3px; - left: 7px; - right: 7px; - height: 6px; - transform: rotate(45deg); - border-width: 0 2px 2px 0; -} -.PlaygroundEditorTheme__nestedListItem { - list-style-type: none; -} -.PlaygroundEditorTheme__nestedListItem:before, -.PlaygroundEditorTheme__nestedListItem:after { - display: none; -} -.PlaygroundEditorTheme__tokenComment { - color: slategray; -} -.PlaygroundEditorTheme__tokenPunctuation { - color: #999; -} -.PlaygroundEditorTheme__tokenProperty { - color: #905; -} -.PlaygroundEditorTheme__tokenSelector { - color: #690; -} -.PlaygroundEditorTheme__tokenOperator { - color: #9a6e3a; -} -.PlaygroundEditorTheme__tokenAttr { - color: #07a; -} -.PlaygroundEditorTheme__tokenVariable { - color: #e90; -} -.PlaygroundEditorTheme__tokenFunction { - color: #dd4a68; -} -.PlaygroundEditorTheme__mark { - background: rgba(255, 212, 0, 0.14); - border-bottom: 2px solid rgba(255, 212, 0, 0.3); - padding-bottom: 2px; -} -.PlaygroundEditorTheme__markOverlap { - background: rgba(255, 212, 0, 0.3); - border-bottom: 2px solid rgba(255, 212, 0, 0.7); -} -.PlaygroundEditorTheme__mark.selected { - background: rgba(255, 212, 0, 0.5); - border-bottom: 2px solid rgba(255, 212, 0, 1); -} -.PlaygroundEditorTheme__markOverlap.selected { - background: rgba(255, 212, 0, 0.7); - border-bottom: 2px solid rgba(255, 212, 0, 0.7); -} -.PlaygroundEditorTheme__embedBlock { - user-select: none; -} -.PlaygroundEditorTheme__embedBlockFocus { - outline: 2px solid rgb(60, 132, 244); -} -.PlaygroundEditorTheme__layoutContainer { - display: grid; - gap: 10px; - margin: 10px 0; -} -.PlaygroundEditorTheme__layoutItem { - border: 1px dashed #ddd; - padding: 8px 16px; -} -.PlaygroundEditorTheme__autocomplete { - color: #ccc; -} -.PlaygroundEditorTheme__hr { - padding: 2px 2px; - border: none; - margin: 1em 0; - cursor: pointer; -} -.PlaygroundEditorTheme__hr:after { - content: ''; - display: block; - height: 2px; - background-color: #ccc; - line-height: 2px; -} -.PlaygroundEditorTheme__hr.selected { - outline: 2px solid rgb(60, 132, 244); - user-select: none; -} diff --git a/packages/svelte-lexical/src/routes/themes/PlaygroundEditorTheme.ts b/packages/svelte-lexical/src/routes/themes/PlaygroundEditorTheme.ts deleted file mode 100644 index e781fb4..0000000 --- a/packages/svelte-lexical/src/routes/themes/PlaygroundEditorTheme.ts +++ /dev/null @@ -1,114 +0,0 @@ -/** - * Copyright (c) Syed Umar Anis - * - * This source code is licensed under the MIT license found in the - * LICENSE file in the root directory of this source tree. - * - */ - -import './PlaygroundEditorTheme.css'; - -const theme = { - layoutContainer: 'PlaygroundEditorTheme__layoutContainer', - layoutItem: 'PlaygroundEditorTheme__layoutItem', - blockCursor: 'PlaygroundEditorTheme__blockCursor', - characterLimit: 'PlaygroundEditorTheme__characterLimit', - code: 'PlaygroundEditorTheme__code', - codeHighlight: { - atrule: 'PlaygroundEditorTheme__tokenAttr', - attr: 'PlaygroundEditorTheme__tokenAttr', - boolean: 'PlaygroundEditorTheme__tokenProperty', - builtin: 'PlaygroundEditorTheme__tokenSelector', - cdata: 'PlaygroundEditorTheme__tokenComment', - char: 'PlaygroundEditorTheme__tokenSelector', - class: 'PlaygroundEditorTheme__tokenFunction', - 'class-name': 'PlaygroundEditorTheme__tokenFunction', - comment: 'PlaygroundEditorTheme__tokenComment', - constant: 'PlaygroundEditorTheme__tokenProperty', - deleted: 'PlaygroundEditorTheme__tokenProperty', - doctype: 'PlaygroundEditorTheme__tokenComment', - entity: 'PlaygroundEditorTheme__tokenOperator', - function: 'PlaygroundEditorTheme__tokenFunction', - important: 'PlaygroundEditorTheme__tokenVariable', - inserted: 'PlaygroundEditorTheme__tokenSelector', - keyword: 'PlaygroundEditorTheme__tokenAttr', - namespace: 'PlaygroundEditorTheme__tokenVariable', - number: 'PlaygroundEditorTheme__tokenProperty', - operator: 'PlaygroundEditorTheme__tokenOperator', - prolog: 'PlaygroundEditorTheme__tokenComment', - property: 'PlaygroundEditorTheme__tokenProperty', - punctuation: 'PlaygroundEditorTheme__tokenPunctuation', - regex: 'PlaygroundEditorTheme__tokenVariable', - selector: 'PlaygroundEditorTheme__tokenSelector', - string: 'PlaygroundEditorTheme__tokenSelector', - symbol: 'PlaygroundEditorTheme__tokenProperty', - tag: 'PlaygroundEditorTheme__tokenProperty', - url: 'PlaygroundEditorTheme__tokenOperator', - variable: 'PlaygroundEditorTheme__tokenVariable', - }, - embedBlock: { - base: 'PlaygroundEditorTheme__embedBlock', - focus: 'PlaygroundEditorTheme__embedBlockFocus', - }, - hashtag: 'PlaygroundEditorTheme__hashtag', - heading: { - h1: 'PlaygroundEditorTheme__h1', - h2: 'PlaygroundEditorTheme__h2', - h3: 'PlaygroundEditorTheme__h3', - h4: 'PlaygroundEditorTheme__h4', - h5: 'PlaygroundEditorTheme__h5', - h6: 'PlaygroundEditorTheme__h6', - }, - hr: 'PlaygroundEditorTheme__hr', - image: 'editor-image', - link: 'PlaygroundEditorTheme__link', - list: { - listitem: 'PlaygroundEditorTheme__listItem', - listitemChecked: 'PlaygroundEditorTheme__listItemChecked', - listitemUnchecked: 'PlaygroundEditorTheme__listItemUnchecked', - nested: { - listitem: 'PlaygroundEditorTheme__nestedListItem', - }, - olDepth: [ - 'PlaygroundEditorTheme__ol1', - 'PlaygroundEditorTheme__ol2', - 'PlaygroundEditorTheme__ol3', - 'PlaygroundEditorTheme__ol4', - 'PlaygroundEditorTheme__ol5', - ], - ul: 'PlaygroundEditorTheme__ul', - }, - ltr: 'PlaygroundEditorTheme__ltr', - mark: 'PlaygroundEditorTheme__mark', - markOverlap: 'PlaygroundEditorTheme__markOverlap', - paragraph: 'PlaygroundEditorTheme__paragraph', - quote: 'PlaygroundEditorTheme__quote', - rtl: 'PlaygroundEditorTheme__rtl', - table: 'PlaygroundEditorTheme__table', - tableAddColumns: 'PlaygroundEditorTheme__tableAddColumns', - tableAddRows: 'PlaygroundEditorTheme__tableAddRows', - tableCell: 'PlaygroundEditorTheme__tableCell', - tableCellActionButton: 'PlaygroundEditorTheme__tableCellActionButton', - tableCellActionButtonContainer: - 'PlaygroundEditorTheme__tableCellActionButtonContainer', - tableCellEditing: 'PlaygroundEditorTheme__tableCellEditing', - tableCellHeader: 'PlaygroundEditorTheme__tableCellHeader', - tableCellPrimarySelected: 'PlaygroundEditorTheme__tableCellPrimarySelected', - tableCellResizer: 'PlaygroundEditorTheme__tableCellResizer', - tableCellSelected: 'PlaygroundEditorTheme__tableCellSelected', - tableCellSortedIndicator: 'PlaygroundEditorTheme__tableCellSortedIndicator', - tableResizeRuler: 'PlaygroundEditorTheme__tableCellResizeRuler', - tableSelected: 'PlaygroundEditorTheme__tableSelected', - text: { - bold: 'PlaygroundEditorTheme__textBold', - code: 'PlaygroundEditorTheme__textCode', - italic: 'PlaygroundEditorTheme__textItalic', - strikethrough: 'PlaygroundEditorTheme__textStrikethrough', - subscript: 'PlaygroundEditorTheme__textSubscript', - superscript: 'PlaygroundEditorTheme__textSuperscript', - underline: 'PlaygroundEditorTheme__textUnderline', - underlineStrikethrough: 'PlaygroundEditorTheme__textUnderlineStrikethrough', - }, -}; - -export default theme; diff --git a/packages/svelte-lexical/src/routes/themes/StickyEditorTheme.css b/packages/svelte-lexical/src/routes/themes/StickyEditorTheme.css deleted file mode 100644 index f563869..0000000 --- a/packages/svelte-lexical/src/routes/themes/StickyEditorTheme.css +++ /dev/null @@ -1,13 +0,0 @@ -/** - * Copyright (c) Meta Platforms, Inc. and affiliates. - * - * This source code is licensed under the MIT license found in the - * LICENSE file in the root directory of this source tree. - * - * - */ - -.StickyEditorTheme__paragraph { - margin: 0; - position: 'relative'; -} diff --git a/packages/svelte-lexical/src/routes/themes/StickyEditorTheme.ts b/packages/svelte-lexical/src/routes/themes/StickyEditorTheme.ts deleted file mode 100644 index 66bfe99..0000000 --- a/packages/svelte-lexical/src/routes/themes/StickyEditorTheme.ts +++ /dev/null @@ -1,18 +0,0 @@ -/** - * Copyright (c) Syed Umar Anis - * - * This source code is licensed under the MIT license found in the - * LICENSE file in the root directory of this source tree. - * - */ - -import './StickyEditorTheme.css'; - -import baseTheme from './PlaygroundEditorTheme.js'; - -const theme = { - ...baseTheme, - paragraph: 'StickyEditorTheme__paragraph', -}; - -export default theme;