phx-react
Version:
PHX REACT
2 lines (1 loc) • 14.4 kB
TypeScript
export declare const styleTag = "\n* {\n margin: 0;\n padding: 0;\n box-sizing: border-box;\n}\n.PlaygroundEditorTheme__ltr {\n text-align: left;\n}\n.PlaygroundEditorTheme__rtl {\n text-align: right;\n}\n\n[type='page-break'] {\n position: relative;\n display: block;\n width: calc(100% + var(--editor-input-padding, 28px) * 2);\n overflow: unset;\n margin-left: calc(var(--editor-input-padding, 28px) * -1);\n margin-top: var(--editor-input-padding, 28px);\n margin-bottom: var(--editor-input-padding, 28px);\n\n border: none;\n border-top: 1px dashed var(--editor-color-secondary, #eeeeee);\n border-bottom: 1px dashed var(--editor-color-secondary, #eeeeee);\n background-color: var(--editor-color-secondary, #eeeeee);\n}\n\n[type='page-break']::before {\n content: '';\n\n position: absolute;\n top: 50%;\n left: calc(var(--editor-input-padding, 28px) + 12px);\n transform: translateY(-50%);\n opacity: 0.5;\n\n background-size: cover;\n background-image: url(/icons/scissors.svg);\n width: 16px;\n height: 16px;\n}\n\n[type='page-break']::after {\n position: absolute;\n top: 50%;\n left: 50%;\n transform: translate(-50%, -50%);\n\n display: block;\n padding: 2px 6px;\n border: 1px solid #ccc;\n background-color: #fff;\n\n content: 'PAGE BREAK';\n font-size: 12px;\n color: #000;\n font-weight: 600;\n}\n\n.PlaygroundEditorTheme__quote {\n margin: 0;\n margin-left: 20px;\n font-size: 15px;\n color: rgb(101, 103, 107);\n border-left-color: rgb(206, 208, 212);\n border-left-width: 4px;\n border-left-style: solid;\n padding-left: 16px;\n}\n.PlaygroundEditorTheme__h1 {\n font-size: 34px;\n margin-bottom: 10px;\n}\n.PlaygroundEditorTheme__h2 {\n font-size: 29px;\n margin-bottom: 10px;\n}\n.PlaygroundEditorTheme__h3 {\n font-size: 24px;\n margin-bottom: 10px;\n}\n.PlaygroundEditorTheme__h4 {\n font-size: 21px;\n margin-bottom: 10px;\n}\n.PlaygroundEditorTheme__h5 {\n font-size: 18px;\n margin-bottom: 10px;\n}\n.PlaygroundEditorTheme__h6 {\n font-size: 16px;\n margin-bottom: 10px;\n}\n.PlaygroundEditorTheme__indent {\n --lexical-indent-base-value: 40px;\n}\n.PlaygroundEditorTheme__textBold {\n font-weight: bold;\n}\n.PlaygroundEditorTheme__textItalic {\n font-style: italic;\n}\n.PlaygroundEditorTheme__textUnderline {\n text-decoration: underline;\n}\n.PlaygroundEditorTheme__textStrikethrough {\n text-decoration: line-through;\n}\n.PlaygroundEditorTheme__textUnderlineStrikethrough {\n text-decoration: underline line-through;\n}\n.PlaygroundEditorTheme__textSubscript {\n font-size: 0.8em;\n vertical-align: sub !important;\n}\n.PlaygroundEditorTheme__textSuperscript {\n font-size: 0.8em;\n vertical-align: super;\n}\n.PlaygroundEditorTheme__textCode {\n background-color: rgb(240, 242, 245);\n padding: 1px 0.25rem;\n font-family: Menlo, Consolas, Monaco, monospace;\n font-size: 94%;\n}\n.PlaygroundEditorTheme__hashtag {\n background-color: rgba(88, 144, 255, 0.15);\n border-bottom: 1px solid rgba(88, 144, 255, 0.3);\n}\n.PlaygroundEditorTheme__link {\n color: rgb(33, 111, 219);\n text-decoration: none;\n}\n.PlaygroundEditorTheme__link:hover {\n text-decoration: underline;\n cursor: pointer;\n}\n.PlaygroundEditorTheme__code {\n background-color: rgb(240, 242, 245);\n font-family: Menlo, Consolas, Monaco, monospace;\n display: block;\n padding: 8px 8px 8px 52px;\n line-height: 1.53;\n font-size: 13px;\n margin: 0;\n margin-top: 8px;\n margin-bottom: 8px;\n overflow-x: auto;\n position: relative;\n tab-size: 2;\n}\n.PlaygroundEditorTheme__code:before {\n content: attr(data-gutter);\n position: absolute;\n background-color: #eee;\n left: 0;\n top: 0;\n border-right: 1px solid #ccc;\n padding: 8px;\n color: #777;\n white-space: pre-wrap;\n text-align: right;\n min-width: 25px;\n}\n.PlaygroundEditorTheme__table {\n border-collapse: collapse;\n border-spacing: 0;\n overflow-y: scroll;\n overflow-x: scroll;\n table-layout: fixed;\n width: max-content;\n margin: 30px 0;\n}\n.PlaygroundEditorTheme__tableSelection *::selection {\n background-color: transparent;\n}\n.PlaygroundEditorTheme__tableSelected {\n outline: 2px solid rgb(60, 132, 244);\n}\n.PlaygroundEditorTheme__tableCell {\n border: 1px solid #bbb;\n width: 75px;\n min-width: 75px;\n vertical-align: top;\n text-align: start;\n padding: 6px 8px;\n position: relative;\n outline: none;\n}\n.PlaygroundEditorTheme__tableCellSortedIndicator {\n display: block;\n opacity: 0.5;\n position: absolute;\n bottom: 0;\n left: 0;\n width: 100%;\n height: 4px;\n background-color: #999;\n}\n.PlaygroundEditorTheme__tableCellResizer {\n position: absolute;\n right: -4px;\n height: 100%;\n width: 8px;\n cursor: ew-resize;\n z-index: 10;\n top: 0;\n}\n.PlaygroundEditorTheme__tableCellHeader {\n background-color: #f2f3f5;\n text-align: start;\n}\n.PlaygroundEditorTheme__tableCellSelected {\n background-color: #c9dbf0;\n}\n.PlaygroundEditorTheme__tableCellPrimarySelected {\n border: 2px solid rgb(60, 132, 244);\n display: block;\n height: calc(100% - 2px);\n position: absolute;\n width: calc(100% - 2px);\n left: -1px;\n top: -1px;\n z-index: 2;\n}\n.PlaygroundEditorTheme__tableCellEditing {\n box-shadow: 0 0 5px rgba(0, 0, 0, 0.4);\n border-radius: 3px;\n}\n.PlaygroundEditorTheme__tableAddColumns {\n position: absolute;\n top: 0;\n width: 20px;\n background-color: #eee;\n height: 100%;\n right: -25px;\n animation: table-controls 0.2s ease;\n border: 0;\n cursor: pointer;\n}\n.PlaygroundEditorTheme__tableAddColumns:after {\n background-image: url('/icons/plus.svg');\n background-size: contain;\n background-position: center;\n background-repeat: no-repeat;\n display: block;\n content: ' ';\n position: absolute;\n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n opacity: 0.4;\n}\n.PlaygroundEditorTheme__tableAddColumns:hover {\n background-color: #c9dbf0;\n}\n.PlaygroundEditorTheme__tableAddRows {\n position: absolute;\n bottom: -25px;\n width: calc(100% - 25px);\n background-color: #eee;\n height: 20px;\n left: 0;\n animation: table-controls 0.2s ease;\n border: 0;\n cursor: pointer;\n}\n.PlaygroundEditorTheme__tableAddRows:after {\n background-image: url(/icons/plus.svg);\n background-size: contain;\n background-position: center;\n background-repeat: no-repeat;\n display: block;\n content: ' ';\n position: absolute;\n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n opacity: 0.4;\n}\n.PlaygroundEditorTheme__tableAddRows:hover {\n background-color: #c9dbf0;\n}\n@keyframes table-controls {\n 0% {\n opacity: 0;\n }\n 100% {\n opacity: 1;\n }\n}\n.PlaygroundEditorTheme__tableCellResizeRuler {\n display: block;\n position: absolute;\n width: 1px;\n background-color: rgb(60, 132, 244);\n height: 100%;\n top: 0;\n}\n.PlaygroundEditorTheme__tableCellActionButtonContainer {\n display: block;\n right: 5px;\n top: 6px;\n position: absolute;\n z-index: 4;\n width: 20px;\n height: 20px;\n}\n.PlaygroundEditorTheme__tableCellActionButton {\n background-color: #eee;\n display: block;\n border: 0;\n border-radius: 20px;\n width: 20px;\n height: 20px;\n color: #222;\n cursor: pointer;\n}\n.PlaygroundEditorTheme__tableCellActionButton:hover {\n background-color: #ddd;\n}\n.PlaygroundEditorTheme__characterLimit {\n display: inline;\n background-color: #ffbbbb !important;\n}\n.PlaygroundEditorTheme__ol1 {\n padding: 0;\n margin: 0;\n list-style-position: inside;\n list-style-type: decimal;\n margin-left: 20px;\n}\n.PlaygroundEditorTheme__ol2 {\n padding: 0;\n margin: 0;\n list-style-type: upper-alpha;\n list-style-position: inside;\n margin-left: 20px;\n}\n.PlaygroundEditorTheme__ol3 {\n padding: 0;\n margin: 0;\n list-style-type: lower-alpha;\n list-style-position: inside;\n margin-left: 20px;\n}\n.PlaygroundEditorTheme__ol4 {\n padding: 0;\n margin: 0;\n list-style-type: upper-roman;\n list-style-position: inside;\n margin-left: 20px;\n}\n.PlaygroundEditorTheme__ol5 {\n padding: 0;\n margin: 0;\n list-style-type: lower-roman;\n list-style-position: inside;\n margin-left: 20px;\n}\n.PlaygroundEditorTheme__ul {\n padding: 0;\n margin: 0;\n list-style: disc;\n margin-left: 20px;\n list-style-position: inside;\n}\n\n.PlaygroundEditorTheme__listItem {\n font-family: var(--listitem-marker-font-family);\n font-size: var(--listitem-marker-font-size);\n background-color: var(--listitem-marker-background-color);\n}\n\n.PlaygroundEditorTheme__listItem::marker {\n color: var(--listitem-marker-color);\n background-color: var(--listitem-marker-background-color);\n font-family: var(--listitem-marker-font-family);\n font-size: var(--listitem-marker-font-size);\n font-style: var(--listitem-marker-font-style);\n font-weight: var(--listitem-marker-font-weight);\n}\n\n.PlaygroundEditorTheme__listItemChecked,\n.PlaygroundEditorTheme__listItemUnchecked {\n position: relative;\n margin-left: 8px;\n margin-right: 8px;\n padding-left: 24px;\n padding-right: 24px;\n list-style-type: none;\n outline: none;\n}\n.PlaygroundEditorTheme__listItemChecked {\n text-decoration: line-through;\n}\n.PlaygroundEditorTheme__listItemUnchecked:before,\n.PlaygroundEditorTheme__listItemChecked:before {\n content: '';\n width: 16px;\n height: 16px;\n top: 2px;\n left: 0;\n cursor: pointer;\n display: block;\n background-size: cover;\n position: absolute;\n}\n.PlaygroundEditorTheme__listItemUnchecked[dir='rtl']:before,\n.PlaygroundEditorTheme__listItemChecked[dir='rtl']:before {\n left: auto;\n right: 0;\n}\n.PlaygroundEditorTheme__listItemUnchecked:focus:before,\n.PlaygroundEditorTheme__listItemChecked:focus:before {\n box-shadow: 0 0 0 2px #a6cdfe;\n border-radius: 2px;\n}\n.PlaygroundEditorTheme__listItemUnchecked:before {\n border: 1px solid #999;\n border-radius: 2px;\n}\n.PlaygroundEditorTheme__listItemChecked:before {\n border: 1px solid rgb(61, 135, 245);\n border-radius: 2px;\n background-color: #3d87f5;\n background-repeat: no-repeat;\n}\n.PlaygroundEditorTheme__listItemChecked:after {\n content: '';\n cursor: pointer;\n border-color: #fff;\n border-style: solid;\n position: absolute;\n display: block;\n top: 6px;\n width: 3px;\n left: 7px;\n right: 7px;\n height: 6px;\n transform: rotate(45deg);\n border-width: 0 2px 2px 0;\n}\n.PlaygroundEditorTheme__nestedListItem {\n list-style-type: none;\n}\n.PlaygroundEditorTheme__nestedListItem:before,\n.PlaygroundEditorTheme__nestedListItem:after {\n display: none;\n}\n.PlaygroundEditorTheme__tokenComment {\n color: slategray;\n}\n.PlaygroundEditorTheme__tokenPunctuation {\n color: #999;\n}\n.PlaygroundEditorTheme__tokenProperty {\n color: #905;\n}\n.PlaygroundEditorTheme__tokenSelector {\n color: #690;\n}\n.PlaygroundEditorTheme__tokenOperator {\n color: #9a6e3a;\n}\n.PlaygroundEditorTheme__tokenAttr {\n color: #07a;\n}\n.PlaygroundEditorTheme__tokenVariable {\n color: #e90;\n}\n.PlaygroundEditorTheme__tokenFunction {\n color: #dd4a68;\n}\n.PlaygroundEditorTheme__mark {\n background: rgba(255, 212, 0, 0.14);\n border-bottom: 2px solid rgba(255, 212, 0, 0.3);\n padding-bottom: 2px;\n}\n.PlaygroundEditorTheme__markOverlap {\n background: rgba(255, 212, 0, 0.3);\n border-bottom: 2px solid rgba(255, 212, 0, 0.7);\n}\n.PlaygroundEditorTheme__mark.selected {\n background: rgba(255, 212, 0, 0.5);\n border-bottom: 2px solid rgba(255, 212, 0, 1);\n}\n.PlaygroundEditorTheme__markOverlap.selected {\n background: rgba(255, 212, 0, 0.7);\n border-bottom: 2px solid rgba(255, 212, 0, 0.7);\n}\n.PlaygroundEditorTheme__embedBlock {\n user-select: none;\n}\n.PlaygroundEditorTheme__embedBlockFocus {\n outline: 2px solid rgb(60, 132, 244);\n}\n.PlaygroundEditorTheme__layoutContaner {\n display: grid;\n gap: 10px;\n margin: 10px 0;\n}\n.PlaygroundEditorTheme__layoutItem {\n border: 1px dashed #ddd;\n padding: 8px 16px;\n}\n\n.image-resizer-wrapper {\n position: absolute;\n inset: 0;\n pointer-events: none;\n z-index: 1;\n}\n\n.image-resizer {\n position: absolute;\n pointer-events: auto;\n background-color: #fff;\n border: 1px solid rgb(60, 132, 244);\n border-radius: 50%;\n box-sizing: border-box;\n width: 10px;\n height: 10px;\n}\n\n.image-resizer-n,\n.image-resizer-s {\n left: 50%;\n transform: translateX(-50%);\n cursor: ns-resize;\n}\n\n.image-resizer-e,\n.image-resizer-w {\n top: 50%;\n transform: translateY(-50%);\n cursor: ew-resize;\n}\n\n.image-resizer-n {\n top: -5px;\n}\n\n.image-resizer-ne {\n top: -5px;\n right: -5px;\n cursor: nesw-resize;\n}\n\n.image-resizer-e {\n right: -5px;\n}\n\n.image-resizer-se {\n right: -5px;\n bottom: -5px;\n cursor: nwse-resize;\n}\n\n.image-resizer-s {\n bottom: -5px;\n}\n\n.image-resizer-sw {\n bottom: -5px;\n left: -5px;\n cursor: nesw-resize;\n}\n\n.image-resizer-w {\n left: -5px;\n}\n\n.image-resizer-nw {\n top: -5px;\n left: -5px;\n cursor: nwse-resize;\n}\n\n.editor-image {\n display: block;\n position: relative;\n width: fit-content;\n max-width: 100%;\n margin-left: auto;\n margin-right: auto;\n}\n\n.editor-image.position-left,\n.inline-editor-image.position-left {\n display: block;\n position: relative;\n width: fit-content;\n max-width: 100%;\n margin-left: 0;\n margin-right: auto;\n}\n\n.editor-image.position-center,\n.inline-editor-image.position-center {\n display: block;\n position: relative;\n width: fit-content;\n max-width: 100%;\n margin-left: auto;\n margin-right: auto;\n}\n\n.editor-image.position-right,\n.inline-editor-image.position-right {\n display: block;\n position: relative;\n width: fit-content;\n max-width: 100%;\n margin-left: auto;\n margin-right: 0;\n}\n\n.editor-image > div,\n.inline-editor-image > div {\n position: relative;\n}\n\n.editor-image img {\n display: block;\n margin-left: auto;\n margin-right: auto;\n max-width: 90% !important;\n border: 1px solid #e5e7eb;\n margin-bottom: 10px;\n}\n\n.inline-editor-image.position-full {\n display: block;\n position: relative;\n width: 100%;\n max-width: 100%;\n}\n\n.inline-editor-image.position-full img {\n width: 100%;\n max-width: 100%;\n}\n\n.inline-editor-image.position-center img {\n max-width: 100%;\n}\n\n.editor-image img.focused,\n.inline-editor-image img.focused {\n outline: 2px solid rgb(60, 132, 244);\n outline-offset: 2px;\n}\n";