mirror of https://github.com/fantasticit/think.git
Merge pull request #15 from fantasticit/feat/editor
This commit is contained in:
fantasticit
GitHub
commit
fb3a9c01cd
|
|
@ -39,6 +39,8 @@
|
||||||
"@tiptap/extension-paragraph": "^2.0.0-beta.23",
|
"@tiptap/extension-paragraph": "^2.0.0-beta.23",
|
||||||
"@tiptap/extension-placeholder": "^2.0.0-beta.47",
|
"@tiptap/extension-placeholder": "^2.0.0-beta.47",
|
||||||
"@tiptap/extension-strike": "^2.0.0-beta.27",
|
"@tiptap/extension-strike": "^2.0.0-beta.27",
|
||||||
|
"@tiptap/extension-subscript": "^2.0.0-beta.10",
|
||||||
|
"@tiptap/extension-superscript": "^2.0.0-beta.10",
|
||||||
"@tiptap/extension-table": "^2.0.0-beta.48",
|
"@tiptap/extension-table": "^2.0.0-beta.48",
|
||||||
"@tiptap/extension-table-cell": "^2.0.0-beta.20",
|
"@tiptap/extension-table-cell": "^2.0.0-beta.20",
|
||||||
"@tiptap/extension-table-header": "^2.0.0-beta.22",
|
"@tiptap/extension-table-header": "^2.0.0-beta.22",
|
||||||
|
|
|
||||||
|
|
@ -0,0 +1,22 @@
|
||||||
|
import { Icon } from '@douyinfe/semi-ui';
|
||||||
|
|
||||||
|
export const IconSub: React.FC<{ style?: React.CSSProperties }> = ({ style = {} }) => {
|
||||||
|
return (
|
||||||
|
<Icon
|
||||||
|
style={style}
|
||||||
|
svg={
|
||||||
|
<svg width="16" height="16" viewBox="0 0 256 256" role="presentation">
|
||||||
|
<g stroke="currentColor" fill="none" fill-rule="evenodd">
|
||||||
|
<path stroke-width="20" stroke-linecap="round" d="m40 50 114 168M154 50 40 218"></path>
|
||||||
|
<path
|
||||||
|
d="M231.92 225.48c2.72 0 4.08-1.48 4.08-4.44 0-2.88-1.36-4.32-4.08-4.32H198.8c6.48-5.52 12.28-11.24 17.4-17.16 2.16-2.48 4.28-5.16 6.36-8.04 2.08-2.88 3.94-5.82 5.58-8.82 1.64-3 2.96-6.04 3.96-9.12 1-3.08 1.5-6.14 1.5-9.18 0-3.36-.48-6.42-1.44-9.18s-2.38-5.12-4.26-7.08-4.2-3.48-6.96-4.56c-2.76-1.08-5.9-1.62-9.42-1.62-7.92 0-13.8 2.26-17.64 6.78-3.84 4.52-5.76 10.66-5.76 18.42 0 2.24.32 3.74.96 4.5.64.76 1.96 1.14 3.96 1.14 1.76 0 2.98-.44 3.66-1.32.68-.88 1.02-2.32 1.02-4.32 0-4.8 1.04-8.74 3.12-11.82s5.4-4.62 9.96-4.62c4 0 7.16 1.32 9.48 3.96 2.32 2.64 3.48 6.12 3.48 10.44 0 3.2-.64 6.42-1.92 9.66-1.28 3.24-2.94 6.4-4.98 9.48a84.099 84.099 0 0 1-6.84 8.94c-2.52 2.88-5.04 5.6-7.56 8.16-2.52 2.56-4.92 4.94-7.2 7.14-2.28 2.2-4.18 4.1-5.7 5.7-.64 1.04-.96 2.04-.96 3-.56 1.04-.86 2.06-.9 3.06-.04 1 .1 1.88.42 2.64.32.76.8 1.38 1.44 1.86.64.48 1.36.72 2.16.72h40.2Z"
|
||||||
|
strokeWidth="5"
|
||||||
|
fill="currentColor"
|
||||||
|
fillRule="nonzero"
|
||||||
|
></path>
|
||||||
|
</g>
|
||||||
|
</svg>
|
||||||
|
}
|
||||||
|
/>
|
||||||
|
);
|
||||||
|
};
|
||||||
|
|
@ -0,0 +1,22 @@
|
||||||
|
import { Icon } from '@douyinfe/semi-ui';
|
||||||
|
|
||||||
|
export const IconSup: React.FC<{ style?: React.CSSProperties }> = ({ style = {} }) => {
|
||||||
|
return (
|
||||||
|
<Icon
|
||||||
|
style={style}
|
||||||
|
svg={
|
||||||
|
<svg width="16" height="16" viewBox="0 0 256 256" role="presentation">
|
||||||
|
<g stroke="currentColor" fill="none" fill-rule="evenodd">
|
||||||
|
<path stroke-width="20" stroke-linecap="round" d="m40 50 114 168M154 50 40 218"></path>
|
||||||
|
<path
|
||||||
|
d="M231.92 103.48c2.72 0 4.08-1.48 4.08-4.44 0-2.88-1.36-4.32-4.08-4.32H198.8c6.48-5.52 12.28-11.24 17.4-17.16 2.16-2.48 4.28-5.16 6.36-8.04 2.08-2.88 3.94-5.82 5.58-8.82 1.64-3 2.96-6.04 3.96-9.12 1-3.08 1.5-6.14 1.5-9.18 0-3.36-.48-6.42-1.44-9.18s-2.38-5.12-4.26-7.08-4.2-3.48-6.96-4.56c-2.76-1.08-5.9-1.62-9.42-1.62-7.92 0-13.8 2.26-17.64 6.78-3.84 4.52-5.76 10.66-5.76 18.42 0 2.24.32 3.74.96 4.5.64.76 1.96 1.14 3.96 1.14 1.76 0 2.98-.44 3.66-1.32.68-.88 1.02-2.32 1.02-4.32 0-4.8 1.04-8.74 3.12-11.82s5.4-4.62 9.96-4.62c4 0 7.16 1.32 9.48 3.96 2.32 2.64 3.48 6.12 3.48 10.44 0 3.2-.64 6.42-1.92 9.66-1.28 3.24-2.94 6.4-4.98 9.48a84.099 84.099 0 0 1-6.84 8.94c-2.52 2.88-5.04 5.6-7.56 8.16-2.52 2.56-4.92 4.94-7.2 7.14-2.28 2.2-4.18 4.1-5.7 5.7-.64 1.04-.96 2.04-.96 3-.56 1.04-.86 2.06-.9 3.06-.04 1 .1 1.88.42 2.64.32.76.8 1.38 1.44 1.86.64.48 1.36.72 2.16.72h40.2Z"
|
||||||
|
strokeWidth="5"
|
||||||
|
fill="currentColor"
|
||||||
|
fillRule="nonzero"
|
||||||
|
></path>
|
||||||
|
</g>
|
||||||
|
</svg>
|
||||||
|
}
|
||||||
|
/>
|
||||||
|
);
|
||||||
|
};
|
||||||
|
|
@ -45,3 +45,5 @@ export * from './IconHeading3';
|
||||||
export * from './IconTableHeaderRow';
|
export * from './IconTableHeaderRow';
|
||||||
export * from './IconTableHeaderColumn';
|
export * from './IconTableHeaderColumn';
|
||||||
export * from './IconTableHeaderCell';
|
export * from './IconTableHeaderCell';
|
||||||
|
export * from './IconSub';
|
||||||
|
export * from './IconSup';
|
||||||
|
|
|
||||||
|
|
@ -36,6 +36,8 @@ import { SearchNReplace } from './extensions/search';
|
||||||
import { SelectionExtension } from './extensions/selection';
|
import { SelectionExtension } from './extensions/selection';
|
||||||
import { Status } from './extensions/status';
|
import { Status } from './extensions/status';
|
||||||
import { Strike } from './extensions/strike';
|
import { Strike } from './extensions/strike';
|
||||||
|
import { Subscript } from './extensions/subscript';
|
||||||
|
import { Superscript } from './extensions/superscript';
|
||||||
import { Table } from './extensions/table';
|
import { Table } from './extensions/table';
|
||||||
import { TableCell } from './extensions/tableCell';
|
import { TableCell } from './extensions/tableCell';
|
||||||
import { TableHeader } from './extensions/tableHeader';
|
import { TableHeader } from './extensions/tableHeader';
|
||||||
|
|
@ -89,6 +91,8 @@ export const BaseKit = [
|
||||||
SelectionExtension,
|
SelectionExtension,
|
||||||
Status,
|
Status,
|
||||||
Strike,
|
Strike,
|
||||||
|
Subscript,
|
||||||
|
Superscript,
|
||||||
Table,
|
Table,
|
||||||
TableCell,
|
TableCell,
|
||||||
TableHeader,
|
TableHeader,
|
||||||
|
|
|
||||||
|
|
@ -60,33 +60,29 @@ export const Emoji = Node.create({
|
||||||
new Plugin({
|
new Plugin({
|
||||||
key: new PluginKey('emojiPlaceholder'),
|
key: new PluginKey('emojiPlaceholder'),
|
||||||
props: {
|
props: {
|
||||||
decorations: (state) => {
|
// decorations: (state) => {
|
||||||
if (!editor.isEditable) return;
|
// if (!editor.isEditable) return;
|
||||||
|
// const parent = findParentNode((node) => node.type.name === 'paragraph')(state.selection);
|
||||||
const parent = findParentNode((node) => node.type.name === 'paragraph')(state.selection);
|
// if (!parent) {
|
||||||
if (!parent) {
|
// return;
|
||||||
return;
|
// }
|
||||||
}
|
// const decorations: Decoration[] = [];
|
||||||
|
// const isEmpty = parent && parent.node.content.size === 0;
|
||||||
const decorations: Decoration[] = [];
|
// const isSlash = parent && parent.node.textContent === ':';
|
||||||
const isEmpty = parent && parent.node.content.size === 0;
|
// const isTopLevel = state.selection.$from.depth === 1;
|
||||||
const isSlash = parent && parent.node.textContent === ':';
|
// if (isTopLevel) {
|
||||||
const isTopLevel = state.selection.$from.depth === 1;
|
// if (isSlash) {
|
||||||
|
// decorations.push(
|
||||||
if (isTopLevel) {
|
// Decoration.node(parent.pos, parent.pos + parent.node.nodeSize, {
|
||||||
if (isSlash) {
|
// 'class': 'placeholder',
|
||||||
decorations.push(
|
// 'data-placeholder': ` 继续输入进行过滤`,
|
||||||
Decoration.node(parent.pos, parent.pos + parent.node.nodeSize, {
|
// })
|
||||||
'class': 'placeholder',
|
// );
|
||||||
'data-placeholder': ` 继续输入进行过滤`,
|
// }
|
||||||
})
|
// return DecorationSet.create(state.doc, decorations);
|
||||||
);
|
// }
|
||||||
}
|
// return null;
|
||||||
|
// },
|
||||||
return DecorationSet.create(state.doc, decorations);
|
|
||||||
}
|
|
||||||
return null;
|
|
||||||
},
|
|
||||||
},
|
},
|
||||||
}),
|
}),
|
||||||
];
|
];
|
||||||
|
|
|
||||||
|
|
@ -42,43 +42,38 @@ export const EvokeMenu = Node.create({
|
||||||
new Plugin({
|
new Plugin({
|
||||||
key: new PluginKey('evokeMenuPlaceholder'),
|
key: new PluginKey('evokeMenuPlaceholder'),
|
||||||
props: {
|
props: {
|
||||||
decorations: (state) => {
|
// decorations: (state) => {
|
||||||
if (!editor.isEditable) return;
|
// if (!editor.isEditable) return;
|
||||||
|
// const parent = findParentNode((node) => node.type.name === 'paragraph')(state.selection);
|
||||||
const parent = findParentNode((node) => node.type.name === 'paragraph')(state.selection);
|
// if (!parent) {
|
||||||
if (!parent) {
|
// return;
|
||||||
return;
|
// }
|
||||||
}
|
// const decorations: Decoration[] = [];
|
||||||
|
// const isEmpty = parent && parent.node.content.size === 0;
|
||||||
const decorations: Decoration[] = [];
|
// const isSlash = parent && parent.node.textContent === '/';
|
||||||
const isEmpty = parent && parent.node.content.size === 0;
|
// const isTopLevel = state.selection.$from.depth === 1;
|
||||||
const isSlash = parent && parent.node.textContent === '/';
|
// const hasOtherChildren = parent && parent.node.content.childCount > 1;
|
||||||
const isTopLevel = state.selection.$from.depth === 1;
|
// if (isTopLevel) {
|
||||||
const hasOtherChildren = parent && parent.node.content.childCount > 1;
|
// if (isEmpty) {
|
||||||
|
// decorations.push(
|
||||||
if (isTopLevel) {
|
// Decoration.node(parent.pos, parent.pos + parent.node.nodeSize, {
|
||||||
if (isEmpty) {
|
// 'class': 'is-empty',
|
||||||
decorations.push(
|
// 'data-placeholder': '输入 / 唤起更多',
|
||||||
Decoration.node(parent.pos, parent.pos + parent.node.nodeSize, {
|
// })
|
||||||
'class': 'is-empty',
|
// );
|
||||||
'data-placeholder': '输入 / 唤起更多',
|
// }
|
||||||
})
|
// if (isSlash && !hasOtherChildren) {
|
||||||
);
|
// decorations.push(
|
||||||
}
|
// Decoration.node(parent.pos, parent.pos + parent.node.nodeSize, {
|
||||||
|
// 'class': 'is-empty',
|
||||||
if (isSlash && !hasOtherChildren) {
|
// 'data-placeholder': ` 继续输入进行过滤`,
|
||||||
decorations.push(
|
// })
|
||||||
Decoration.node(parent.pos, parent.pos + parent.node.nodeSize, {
|
// );
|
||||||
'class': 'is-empty',
|
// }
|
||||||
'data-placeholder': ` 继续输入进行过滤`,
|
// return DecorationSet.create(state.doc, decorations);
|
||||||
})
|
// }
|
||||||
);
|
// return null;
|
||||||
}
|
// },
|
||||||
|
|
||||||
return DecorationSet.create(state.doc, decorations);
|
|
||||||
}
|
|
||||||
return null;
|
|
||||||
},
|
|
||||||
},
|
},
|
||||||
}),
|
}),
|
||||||
];
|
];
|
||||||
|
|
|
||||||
|
|
@ -0,0 +1,3 @@
|
||||||
|
import Subscript from '@tiptap/extension-subscript';
|
||||||
|
|
||||||
|
export { Subscript };
|
||||||
|
|
@ -0,0 +1,3 @@
|
||||||
|
import Superscript from '@tiptap/extension-superscript';
|
||||||
|
|
||||||
|
export { Superscript };
|
||||||
|
|
@ -105,7 +105,7 @@ export const TableCell = BuiltInTableCell.extend({
|
||||||
return !!cells?.some((cell, index) => isRowSelected(index)(editor.state.selection));
|
return !!cells?.some((cell, index) => isRowSelected(index)(editor.state.selection));
|
||||||
},
|
},
|
||||||
init: (dom, editor) => {
|
init: (dom, editor) => {
|
||||||
dom.classList.add('table-controller-wrapper');
|
dom.classList.add('bubble-memu-table-cell');
|
||||||
dom.classList.add('row');
|
dom.classList.add('row');
|
||||||
ReactDOM.render(
|
ReactDOM.render(
|
||||||
<>
|
<>
|
||||||
|
|
|
||||||
|
|
@ -94,7 +94,7 @@ export const TableHeader = BuiltInTableHeader.extend({
|
||||||
return !!cells?.some((cell, index) => isColumnSelected(index)(selection));
|
return !!cells?.some((cell, index) => isColumnSelected(index)(selection));
|
||||||
},
|
},
|
||||||
init: (dom, editor) => {
|
init: (dom, editor) => {
|
||||||
dom.classList.add('table-controller-wrapper');
|
dom.classList.add('bubble-memu-table-cell');
|
||||||
ReactDOM.render(
|
ReactDOM.render(
|
||||||
<Space>
|
<Space>
|
||||||
<Tooltip content="向前插入一列">
|
<Tooltip content="向前插入一列">
|
||||||
|
|
|
||||||
|
|
@ -1,6 +1,7 @@
|
||||||
import React from 'react';
|
import React from 'react';
|
||||||
import { Button } from '@douyinfe/semi-ui';
|
import { Button } from '@douyinfe/semi-ui';
|
||||||
import { IconBold, IconItalic, IconStrikeThrough, IconUnderline, IconCode } from '@douyinfe/semi-icons';
|
import { IconBold, IconItalic, IconStrikeThrough, IconUnderline, IconCode } from '@douyinfe/semi-icons';
|
||||||
|
import { IconSup, IconSub } from 'components/icons';
|
||||||
import { Tooltip } from 'components/tooltip';
|
import { Tooltip } from 'components/tooltip';
|
||||||
import { isTitleActive } from '../services/isActive';
|
import { isTitleActive } from '../services/isActive';
|
||||||
import { ColorMenu } from './color';
|
import { ColorMenu } from './color';
|
||||||
|
|
@ -62,6 +63,26 @@ export const BaseMenu: React.FC<{ editor: any }> = ({ editor }) => {
|
||||||
/>
|
/>
|
||||||
</Tooltip>
|
</Tooltip>
|
||||||
|
|
||||||
|
<Tooltip content="上标">
|
||||||
|
<Button
|
||||||
|
theme={editor.isActive('superscript') ? 'light' : 'borderless'}
|
||||||
|
type="tertiary"
|
||||||
|
icon={<IconSup />}
|
||||||
|
onClick={() => editor.chain().focus().toggleSuperscript().run()}
|
||||||
|
disabled={isTitleActive(editor)}
|
||||||
|
/>
|
||||||
|
</Tooltip>
|
||||||
|
|
||||||
|
<Tooltip content="下标">
|
||||||
|
<Button
|
||||||
|
theme={editor.isActive('subscript') ? 'light' : 'borderless'}
|
||||||
|
type="tertiary"
|
||||||
|
icon={<IconSub />}
|
||||||
|
onClick={() => editor.chain().focus().toggleSubscript().run()}
|
||||||
|
disabled={isTitleActive(editor)}
|
||||||
|
/>
|
||||||
|
</Tooltip>
|
||||||
|
|
||||||
<ColorMenu editor={editor} />
|
<ColorMenu editor={editor} />
|
||||||
</>
|
</>
|
||||||
);
|
);
|
||||||
|
|
|
||||||
|
|
@ -21,7 +21,7 @@ import { Table } from '../extensions/table';
|
||||||
export const TableBubbleMenu = ({ editor }) => {
|
export const TableBubbleMenu = ({ editor }) => {
|
||||||
return (
|
return (
|
||||||
<BubbleMenu
|
<BubbleMenu
|
||||||
className={'bubble-menu table-bubble-menu'}
|
className={'bubble-menu bubble-menu-table'}
|
||||||
editor={editor}
|
editor={editor}
|
||||||
pluginKey="table-bubble-menu"
|
pluginKey="table-bubble-menu"
|
||||||
shouldShow={() => editor.isActive(Table.name)}
|
shouldShow={() => editor.isActive(Table.name)}
|
||||||
|
|
|
||||||
|
|
@ -0,0 +1,13 @@
|
||||||
|
import { Mark } from './mark';
|
||||||
|
|
||||||
|
export class Subscript extends Mark {
|
||||||
|
matching() {
|
||||||
|
return this.DOMNode.nodeName === 'SUB';
|
||||||
|
}
|
||||||
|
|
||||||
|
data() {
|
||||||
|
return {
|
||||||
|
type: 'subscript',
|
||||||
|
};
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
@ -0,0 +1,13 @@
|
||||||
|
import { Mark } from './mark';
|
||||||
|
|
||||||
|
export class Superscript extends Mark {
|
||||||
|
matching() {
|
||||||
|
return this.DOMNode.nodeName === 'SUP';
|
||||||
|
}
|
||||||
|
|
||||||
|
data() {
|
||||||
|
return {
|
||||||
|
type: 'superscript',
|
||||||
|
};
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
@ -36,6 +36,8 @@ import { Bold } from './marks/bold';
|
||||||
import { Code } from './marks/code';
|
import { Code } from './marks/code';
|
||||||
import { Italic } from './marks/italic';
|
import { Italic } from './marks/italic';
|
||||||
import { Link } from './marks/link';
|
import { Link } from './marks/link';
|
||||||
|
import { Subscript } from './marks/subscript';
|
||||||
|
import { Superscript } from './marks/superscript';
|
||||||
import { Underline } from './marks/underline';
|
import { Underline } from './marks/underline';
|
||||||
|
|
||||||
export class Renderer {
|
export class Renderer {
|
||||||
|
|
@ -84,7 +86,7 @@ export class Renderer {
|
||||||
BulletList,
|
BulletList,
|
||||||
];
|
];
|
||||||
|
|
||||||
this.marks = [Bold, Code, Italic, Link, Underline];
|
this.marks = [Bold, Code, Italic, Link, Subscript, Superscript, Underline];
|
||||||
}
|
}
|
||||||
|
|
||||||
setDocument(document) {
|
setDocument(document) {
|
||||||
|
|
|
||||||
|
|
@ -22,6 +22,8 @@ import { OrderedList } from '../../../extensions/orderedList';
|
||||||
import { Paragraph } from '../../../extensions/paragraph';
|
import { Paragraph } from '../../../extensions/paragraph';
|
||||||
import { Status } from '../../../extensions/status';
|
import { Status } from '../../../extensions/status';
|
||||||
import { Strike } from '../../../extensions/strike';
|
import { Strike } from '../../../extensions/strike';
|
||||||
|
import { Subscript } from '../../../extensions/subscript';
|
||||||
|
import { Superscript } from '../../../extensions/superscript';
|
||||||
import { Table } from '../../../extensions/table';
|
import { Table } from '../../../extensions/table';
|
||||||
import { TableCell } from '../../../extensions/tableCell';
|
import { TableCell } from '../../../extensions/tableCell';
|
||||||
import { TableHeader } from '../../../extensions/tableHeader';
|
import { TableHeader } from '../../../extensions/tableHeader';
|
||||||
|
|
@ -67,6 +69,8 @@ const SerializerConfig = {
|
||||||
mixable: true,
|
mixable: true,
|
||||||
expelEnclosingWhitespace: true,
|
expelEnclosingWhitespace: true,
|
||||||
},
|
},
|
||||||
|
[Subscript.name]: { open: '<sub>', close: '</sub>', mixable: true },
|
||||||
|
[Superscript.name]: { open: '<sup>', close: '</sup>', mixable: true },
|
||||||
// FIXME: 如何导出 style？
|
// FIXME: 如何导出 style？
|
||||||
[TextStyle.name]: { open: '', close: '', mixable: true, expelEnclosingWhitespace: true },
|
[TextStyle.name]: { open: '', close: '', mixable: true, expelEnclosingWhitespace: true },
|
||||||
...marks.reduce(
|
...marks.reduce(
|
||||||
|
|
|
||||||
|
|
@ -2,7 +2,6 @@
|
||||||
display: flex;
|
display: flex;
|
||||||
justify-content: space-between;
|
justify-content: space-between;
|
||||||
align-items: center;
|
align-items: center;
|
||||||
margin: 10px 0;
|
|
||||||
padding: 8px 16px;
|
padding: 8px 16px;
|
||||||
border: 1px solid var(--semi-color-border);
|
border: 1px solid var(--semi-color-border);
|
||||||
border-radius: var(--border-radius);
|
border-radius: var(--border-radius);
|
||||||
|
|
|
||||||
|
|
@ -1,5 +1,4 @@
|
||||||
.wrap {
|
.wrap {
|
||||||
margin: 12px 0;
|
|
||||||
line-height: 0;
|
line-height: 0;
|
||||||
border-radius: var(--border-radius);
|
border-radius: var(--border-radius);
|
||||||
border: 1px solid var(--semi-color-border);
|
border: 1px solid var(--semi-color-border);
|
||||||
|
|
|
||||||
|
|
@ -1,15 +1,10 @@
|
||||||
.wrap {
|
.wrap {
|
||||||
margin-top: 12px;
|
margin-top: 0.75em;
|
||||||
padding: 12px;
|
padding: 12px;
|
||||||
border: 1px solid var(--semi-color-border);
|
border: 1px solid var(--semi-color-border);
|
||||||
|
border-radius: var(--border-radius);
|
||||||
|
|
||||||
&.isEditable {
|
&.isEditable {
|
||||||
background-color: var(--semi-color-fill-0);
|
|
||||||
|
|
||||||
&:hover {
|
|
||||||
background-color: var(--semi-color-fill-1);
|
|
||||||
}
|
|
||||||
|
|
||||||
.itemWrap {
|
.itemWrap {
|
||||||
pointer-events: none;
|
pointer-events: none;
|
||||||
|
|
||||||
|
|
@ -24,6 +19,7 @@
|
||||||
display: flex;
|
display: flex;
|
||||||
align-items: center;
|
align-items: center;
|
||||||
margin-top: 12px;
|
margin-top: 12px;
|
||||||
|
padding: 6px;
|
||||||
text-decoration: none;
|
text-decoration: none;
|
||||||
color: var(--semi-color-text-1);
|
color: var(--semi-color-text-1);
|
||||||
border-radius: var(--border-radius);
|
border-radius: var(--border-radius);
|
||||||
|
|
|
||||||
|
|
@ -76,8 +76,6 @@ export const DocumentChildrenWrapper = ({ editor, node, updateAttributes }) => {
|
||||||
<Text type="tertiary">当前页面无法使用子文档</Text>
|
<Text type="tertiary">当前页面无法使用子文档</Text>
|
||||||
)}
|
)}
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<NodeViewContent></NodeViewContent>
|
|
||||||
</NodeViewWrapper>
|
</NodeViewWrapper>
|
||||||
);
|
);
|
||||||
};
|
};
|
||||||
|
|
|
||||||
|
|
@ -1,23 +1,13 @@
|
||||||
.wrap {
|
.wrap {
|
||||||
margin-top: 12px;
|
margin-top: 0.75em;
|
||||||
|
border-radius: var(--border-radius);
|
||||||
|
|
||||||
&.isEditable {
|
&.isEditable {
|
||||||
border-color: transparent !important;
|
|
||||||
padding: 12px;
|
padding: 12px;
|
||||||
background-color: var(--semi-color-fill-0);
|
|
||||||
|
|
||||||
&:hover {
|
|
||||||
background-color: var(--semi-color-fill-1);
|
|
||||||
}
|
|
||||||
|
|
||||||
.itemWrap {
|
.itemWrap {
|
||||||
pointer-events: none;
|
pointer-events: none;
|
||||||
margin-top: 12px;
|
margin-top: 12px;
|
||||||
|
|
||||||
&:hover {
|
|
||||||
color: var(--semi-color-text-1);
|
|
||||||
border-color: var(--semi-color-border);
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
|
|
||||||
.empty {
|
.empty {
|
||||||
|
|
|
||||||
|
|
@ -35,6 +35,7 @@ export const DocumentReferenceWrapper = ({ editor, node, updateAttributes }) =>
|
||||||
<Select
|
<Select
|
||||||
placeholder="请选择文档"
|
placeholder="请选择文档"
|
||||||
onChange={(v) => selectDoc(v)}
|
onChange={(v) => selectDoc(v)}
|
||||||
|
style={{ maxWidth: 180 }}
|
||||||
{...(wikiId && documentId ? { value: `${wikiId}/${title}/${documentId}` } : {})}
|
{...(wikiId && documentId ? { value: `${wikiId}/${title}/${documentId}` } : {})}
|
||||||
>
|
>
|
||||||
{(tocs || []).map((toc) => (
|
{(tocs || []).map((toc) => (
|
||||||
|
|
@ -69,7 +70,6 @@ export const DocumentReferenceWrapper = ({ editor, node, updateAttributes }) =>
|
||||||
</div>
|
</div>
|
||||||
)}
|
)}
|
||||||
</div>
|
</div>
|
||||||
<NodeViewContent></NodeViewContent>
|
|
||||||
</NodeViewWrapper>
|
</NodeViewWrapper>
|
||||||
);
|
);
|
||||||
};
|
};
|
||||||
|
|
|
||||||
|
|
@ -20,7 +20,6 @@
|
||||||
flex: 1;
|
flex: 1;
|
||||||
position: relative;
|
position: relative;
|
||||||
width: 100%;
|
width: 100%;
|
||||||
// height: 100%;
|
|
||||||
border-radius: var(--border-radius);
|
border-radius: var(--border-radius);
|
||||||
overflow: hidden;
|
overflow: hidden;
|
||||||
}
|
}
|
||||||
|
|
|
||||||
|
|
@ -2,7 +2,6 @@
|
||||||
display: flex;
|
display: flex;
|
||||||
justify-content: space-between;
|
justify-content: space-between;
|
||||||
align-items: center;
|
align-items: center;
|
||||||
margin: 10px 0;
|
|
||||||
padding: 8px 16px;
|
padding: 8px 16px;
|
||||||
border: 1px solid var(--semi-color-border);
|
border: 1px solid var(--semi-color-border);
|
||||||
border-radius: var(--border-radius);
|
border-radius: var(--border-radius);
|
||||||
|
|
|
||||||
|
|
@ -1,5 +1,6 @@
|
||||||
.wrap {
|
.wrap {
|
||||||
margin: 8px 0;
|
|
||||||
display: inline-flex;
|
display: inline-flex;
|
||||||
justify-content: center;
|
justify-content: center;
|
||||||
|
padding: 0 8px;
|
||||||
|
transform: translateY(8px);
|
||||||
}
|
}
|
||||||
|
|
|
||||||
|
|
@ -28,6 +28,7 @@ export const KatexWrapper = ({ editor, node, updateAttributes }) => {
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<NodeViewWrapper as="span" className={cls(styles.wrap, 'render-wrapper')} contentEditable={false}>
|
<NodeViewWrapper as="span" className={cls(styles.wrap, 'render-wrapper')} contentEditable={false}>
|
||||||
|
<NodeViewContent />
|
||||||
{isEditable ? (
|
{isEditable ? (
|
||||||
<Popover
|
<Popover
|
||||||
showArrow
|
showArrow
|
||||||
|
|
@ -57,7 +58,7 @@ export const KatexWrapper = ({ editor, node, updateAttributes }) => {
|
||||||
) : (
|
) : (
|
||||||
content
|
content
|
||||||
)}
|
)}
|
||||||
<NodeViewContent></NodeViewContent>
|
<NodeViewContent />
|
||||||
</NodeViewWrapper>
|
</NodeViewWrapper>
|
||||||
);
|
);
|
||||||
};
|
};
|
||||||
|
|
|
||||||
|
|
@ -1,7 +1,6 @@
|
||||||
.wrap {
|
.wrap {
|
||||||
position: relative;
|
position: relative;
|
||||||
max-width: 100%;
|
max-width: 100%;
|
||||||
margin: 12px 0;
|
|
||||||
line-height: 0;
|
line-height: 0;
|
||||||
overflow: visible;
|
overflow: visible;
|
||||||
outline: none;
|
outline: none;
|
||||||
|
|
|
||||||
|
|
@ -14,6 +14,7 @@ export const StatusWrapper = ({ editor, node, updateAttributes }) => {
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<NodeViewWrapper as="span" className={cls(styles.wrap, 'status')}>
|
<NodeViewWrapper as="span" className={cls(styles.wrap, 'status')}>
|
||||||
|
<NodeViewContent />
|
||||||
{isEditable ? (
|
{isEditable ? (
|
||||||
<Popover
|
<Popover
|
||||||
showArrow
|
showArrow
|
||||||
|
|
@ -44,7 +45,7 @@ export const StatusWrapper = ({ editor, node, updateAttributes }) => {
|
||||||
) : (
|
) : (
|
||||||
content
|
content
|
||||||
)}
|
)}
|
||||||
{/* <NodeViewContent></NodeViewContent> */}
|
<NodeViewContent />
|
||||||
</NodeViewWrapper>
|
</NodeViewWrapper>
|
||||||
);
|
);
|
||||||
};
|
};
|
||||||
|
|
|
||||||
|
|
@ -0,0 +1,53 @@
|
||||||
|
.ProseMirror {
|
||||||
|
color: var(--semi-color-text-0);
|
||||||
|
white-space: break-spaces;
|
||||||
|
word-break: break-word;
|
||||||
|
word-wrap: break-word;
|
||||||
|
font-family: 'Chinese Quote', 'Segoe UI', Roboto, RobotoNum, 'PingFang SC', 'Hiragino Sans GB', 'Microsoft YaHei',
|
||||||
|
'Helvetica Neue', Helvetica, Arial, sans-serif;
|
||||||
|
letter-spacing: 0.008em;
|
||||||
|
line-height: 1.74;
|
||||||
|
outline: none !important;
|
||||||
|
|
||||||
|
&:focus-visible {
|
||||||
|
outline: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
a {
|
||||||
|
color: var(--semi-color-link);
|
||||||
|
text-decoration: underline;
|
||||||
|
}
|
||||||
|
|
||||||
|
img {
|
||||||
|
border-radius: var(--border-radius);
|
||||||
|
border: 1px solid var(--semi-color-border);
|
||||||
|
}
|
||||||
|
|
||||||
|
p {
|
||||||
|
font-size: 1em;
|
||||||
|
line-height: 1.714;
|
||||||
|
font-weight: normal;
|
||||||
|
margin-top: 0.75rem;
|
||||||
|
margin-bottom: 0px;
|
||||||
|
letter-spacing: -0.005em;
|
||||||
|
}
|
||||||
|
|
||||||
|
blockquote {
|
||||||
|
box-sizing: border-box;
|
||||||
|
padding-left: 10px;
|
||||||
|
border-left: 2px solid var(--semi-color-fill-2);
|
||||||
|
margin: 0.75rem 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
hr {
|
||||||
|
border: 0;
|
||||||
|
height: 2px;
|
||||||
|
background: var(--semi-color-border);
|
||||||
|
margin: 18px 0;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.resize-cursor {
|
||||||
|
cursor: ew-resize;
|
||||||
|
cursor: col-resize;
|
||||||
|
}
|
||||||
|
|
@ -0,0 +1,277 @@
|
||||||
|
.ProseMirror {
|
||||||
|
code {
|
||||||
|
cursor: text;
|
||||||
|
font-size: 0.875rem;
|
||||||
|
line-height: 1.5rem;
|
||||||
|
border-radius: var(--border-radius);
|
||||||
|
padding: 4px;
|
||||||
|
line-height: 1.3;
|
||||||
|
background-color: var(--semi-color-fill-1);
|
||||||
|
font-family: Consolas, Menlo, Courier, monospace;
|
||||||
|
}
|
||||||
|
|
||||||
|
pre {
|
||||||
|
position: relative;
|
||||||
|
margin: 0;
|
||||||
|
counter-reset: line 0;
|
||||||
|
display: flex;
|
||||||
|
min-width: 48px;
|
||||||
|
overflow-x: auto;
|
||||||
|
line-height: 1.3;
|
||||||
|
background-color: var(--semi-color-fill-0);
|
||||||
|
|
||||||
|
code {
|
||||||
|
color: inherit;
|
||||||
|
font-size: 0.875rem;
|
||||||
|
line-height: 1.5rem;
|
||||||
|
margin: 8px;
|
||||||
|
padding: 0;
|
||||||
|
white-space: pre;
|
||||||
|
background-color: transparent;
|
||||||
|
|
||||||
|
width: 100%;
|
||||||
|
max-height: 370px;
|
||||||
|
overflow: auto;
|
||||||
|
overscroll-behavior: contain;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
/*!
|
||||||
|
Theme: GitHub
|
||||||
|
Description: Light theme as seen on github.com
|
||||||
|
Author: github.com
|
||||||
|
Maintainer: @Hirse
|
||||||
|
Updated: 2021-05-15
|
||||||
|
|
||||||
|
Outdated base version: https://github.com/primer/github-syntax-light
|
||||||
|
Current colors taken from GitHub's CSS
|
||||||
|
*/
|
||||||
|
.hljs {
|
||||||
|
color: #24292e;
|
||||||
|
background: #ffffff;
|
||||||
|
}
|
||||||
|
|
||||||
|
.hljs-doctag,
|
||||||
|
.hljs-keyword,
|
||||||
|
.hljs-meta .hljs-keyword,
|
||||||
|
.hljs-template-tag,
|
||||||
|
.hljs-template-variable,
|
||||||
|
.hljs-type,
|
||||||
|
.hljs-variable.language_ {
|
||||||
|
/* prettylights-syntax-keyword */
|
||||||
|
color: #d73a49;
|
||||||
|
}
|
||||||
|
|
||||||
|
.hljs-title,
|
||||||
|
.hljs-title.class_,
|
||||||
|
.hljs-title.class_.inherited__,
|
||||||
|
.hljs-title.function_ {
|
||||||
|
/* prettylights-syntax-entity */
|
||||||
|
color: #6f42c1;
|
||||||
|
}
|
||||||
|
|
||||||
|
.hljs-attr,
|
||||||
|
.hljs-attribute,
|
||||||
|
.hljs-literal,
|
||||||
|
.hljs-meta,
|
||||||
|
.hljs-number,
|
||||||
|
.hljs-operator,
|
||||||
|
.hljs-variable,
|
||||||
|
.hljs-selector-attr,
|
||||||
|
.hljs-selector-class,
|
||||||
|
.hljs-selector-id {
|
||||||
|
/* prettylights-syntax-constant */
|
||||||
|
color: #005cc5;
|
||||||
|
}
|
||||||
|
|
||||||
|
.hljs-regexp,
|
||||||
|
.hljs-string,
|
||||||
|
.hljs-meta .hljs-string {
|
||||||
|
/* prettylights-syntax-string */
|
||||||
|
color: #032f62;
|
||||||
|
}
|
||||||
|
|
||||||
|
.hljs-built_in,
|
||||||
|
.hljs-symbol {
|
||||||
|
/* prettylights-syntax-variable */
|
||||||
|
color: #e36209;
|
||||||
|
}
|
||||||
|
|
||||||
|
.hljs-comment,
|
||||||
|
.hljs-code,
|
||||||
|
.hljs-formula {
|
||||||
|
/* prettylights-syntax-comment */
|
||||||
|
color: #6a737d;
|
||||||
|
}
|
||||||
|
|
||||||
|
.hljs-name,
|
||||||
|
.hljs-quote,
|
||||||
|
.hljs-selector-tag,
|
||||||
|
.hljs-selector-pseudo {
|
||||||
|
/* prettylights-syntax-entity-tag */
|
||||||
|
color: #22863a;
|
||||||
|
}
|
||||||
|
|
||||||
|
.hljs-subst {
|
||||||
|
/* prettylights-syntax-storage-modifier-import */
|
||||||
|
color: #24292e;
|
||||||
|
}
|
||||||
|
|
||||||
|
.hljs-section {
|
||||||
|
/* prettylights-syntax-markup-heading */
|
||||||
|
color: #005cc5;
|
||||||
|
font-weight: bold;
|
||||||
|
}
|
||||||
|
|
||||||
|
.hljs-bullet {
|
||||||
|
/* prettylights-syntax-markup-list */
|
||||||
|
color: #735c0f;
|
||||||
|
}
|
||||||
|
|
||||||
|
.hljs-emphasis {
|
||||||
|
/* prettylights-syntax-markup-italic */
|
||||||
|
color: #24292e;
|
||||||
|
font-style: italic;
|
||||||
|
}
|
||||||
|
|
||||||
|
.hljs-strong {
|
||||||
|
/* prettylights-syntax-markup-bold */
|
||||||
|
color: #24292e;
|
||||||
|
font-weight: bold;
|
||||||
|
}
|
||||||
|
|
||||||
|
.hljs-addition {
|
||||||
|
/* prettylights-syntax-markup-inserted */
|
||||||
|
color: #22863a;
|
||||||
|
background-color: #f0fff4;
|
||||||
|
}
|
||||||
|
|
||||||
|
.hljs-deletion {
|
||||||
|
/* prettylights-syntax-markup-deleted */
|
||||||
|
color: #b31d28;
|
||||||
|
background-color: #ffeef0;
|
||||||
|
}
|
||||||
|
|
||||||
|
body[theme-mode='dark'] {
|
||||||
|
/*!
|
||||||
|
Theme: GitHub Dark
|
||||||
|
Description: Dark theme as seen on github.com
|
||||||
|
Author: github.com
|
||||||
|
Maintainer: @Hirse
|
||||||
|
Updated: 2021-05-15
|
||||||
|
|
||||||
|
Outdated base version: https://github.com/primer/github-syntax-dark
|
||||||
|
Current colors taken from GitHub's CSS
|
||||||
|
*/
|
||||||
|
|
||||||
|
.hljs {
|
||||||
|
color: #c9d1d9;
|
||||||
|
background: #0d1117;
|
||||||
|
}
|
||||||
|
|
||||||
|
.hljs-doctag,
|
||||||
|
.hljs-keyword,
|
||||||
|
.hljs-meta .hljs-keyword,
|
||||||
|
.hljs-template-tag,
|
||||||
|
.hljs-template-variable,
|
||||||
|
.hljs-type,
|
||||||
|
.hljs-variable.language_ {
|
||||||
|
/* prettylights-syntax-keyword */
|
||||||
|
color: #ff7b72;
|
||||||
|
}
|
||||||
|
|
||||||
|
.hljs-title,
|
||||||
|
.hljs-title.class_,
|
||||||
|
.hljs-title.class_.inherited__,
|
||||||
|
.hljs-title.function_ {
|
||||||
|
/* prettylights-syntax-entity */
|
||||||
|
color: #d2a8ff;
|
||||||
|
}
|
||||||
|
|
||||||
|
.hljs-attr,
|
||||||
|
.hljs-attribute,
|
||||||
|
.hljs-literal,
|
||||||
|
.hljs-meta,
|
||||||
|
.hljs-number,
|
||||||
|
.hljs-operator,
|
||||||
|
.hljs-variable,
|
||||||
|
.hljs-selector-attr,
|
||||||
|
.hljs-selector-class,
|
||||||
|
.hljs-selector-id {
|
||||||
|
/* prettylights-syntax-constant */
|
||||||
|
color: #79c0ff;
|
||||||
|
}
|
||||||
|
|
||||||
|
.hljs-regexp,
|
||||||
|
.hljs-string,
|
||||||
|
.hljs-meta .hljs-string {
|
||||||
|
/* prettylights-syntax-string */
|
||||||
|
color: #a5d6ff;
|
||||||
|
}
|
||||||
|
|
||||||
|
.hljs-built_in,
|
||||||
|
.hljs-symbol {
|
||||||
|
/* prettylights-syntax-variable */
|
||||||
|
color: #ffa657;
|
||||||
|
}
|
||||||
|
|
||||||
|
.hljs-comment,
|
||||||
|
.hljs-code,
|
||||||
|
.hljs-formula {
|
||||||
|
/* prettylights-syntax-comment */
|
||||||
|
color: #8b949e;
|
||||||
|
}
|
||||||
|
|
||||||
|
.hljs-name,
|
||||||
|
.hljs-quote,
|
||||||
|
.hljs-selector-tag,
|
||||||
|
.hljs-selector-pseudo {
|
||||||
|
/* prettylights-syntax-entity-tag */
|
||||||
|
color: #7ee787;
|
||||||
|
}
|
||||||
|
|
||||||
|
.hljs-subst {
|
||||||
|
/* prettylights-syntax-storage-modifier-import */
|
||||||
|
color: #c9d1d9;
|
||||||
|
}
|
||||||
|
|
||||||
|
.hljs-section {
|
||||||
|
/* prettylights-syntax-markup-heading */
|
||||||
|
color: #1f6feb;
|
||||||
|
font-weight: bold;
|
||||||
|
}
|
||||||
|
|
||||||
|
.hljs-bullet {
|
||||||
|
/* prettylights-syntax-markup-list */
|
||||||
|
color: #f2cc60;
|
||||||
|
}
|
||||||
|
|
||||||
|
.hljs-emphasis {
|
||||||
|
/* prettylights-syntax-markup-italic */
|
||||||
|
color: #c9d1d9;
|
||||||
|
font-style: italic;
|
||||||
|
}
|
||||||
|
|
||||||
|
.hljs-strong {
|
||||||
|
/* prettylights-syntax-markup-bold */
|
||||||
|
color: #c9d1d9;
|
||||||
|
font-weight: bold;
|
||||||
|
}
|
||||||
|
|
||||||
|
.hljs-addition {
|
||||||
|
/* prettylights-syntax-markup-inserted */
|
||||||
|
color: #aff5b4;
|
||||||
|
background-color: #033a16;
|
||||||
|
}
|
||||||
|
|
||||||
|
.hljs-deletion {
|
||||||
|
/* prettylights-syntax-markup-deleted */
|
||||||
|
color: #ffdcd7;
|
||||||
|
background-color: #67060c;
|
||||||
|
}
|
||||||
|
|
||||||
|
img {
|
||||||
|
opacity: 0.75;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
@ -0,0 +1,24 @@
|
||||||
|
.collaboration-cursor__caret {
|
||||||
|
border-left: 1px solid #0d0d0d;
|
||||||
|
border-right: 1px solid #0d0d0d;
|
||||||
|
margin-left: -1px;
|
||||||
|
margin-right: -1px;
|
||||||
|
pointer-events: none;
|
||||||
|
position: relative;
|
||||||
|
word-break: normal;
|
||||||
|
}
|
||||||
|
|
||||||
|
.collaboration-cursor__label {
|
||||||
|
border-radius: 3px 3px 3px 0;
|
||||||
|
color: #0d0d0d;
|
||||||
|
font-size: 12px;
|
||||||
|
font-style: normal;
|
||||||
|
font-weight: 600;
|
||||||
|
left: -1px;
|
||||||
|
line-height: normal;
|
||||||
|
padding: 0.1rem 0.3rem;
|
||||||
|
position: absolute;
|
||||||
|
top: -1.4em;
|
||||||
|
user-select: none;
|
||||||
|
white-space: nowrap;
|
||||||
|
}
|
||||||
|
|
@ -0,0 +1,16 @@
|
||||||
|
.color {
|
||||||
|
white-space: nowrap;
|
||||||
|
|
||||||
|
&::before {
|
||||||
|
background-color: var(--color);
|
||||||
|
border: 1px solid rgba(128, 128, 128, 0.3);
|
||||||
|
border-radius: 2px;
|
||||||
|
content: ' ';
|
||||||
|
display: inline-block;
|
||||||
|
height: 1em;
|
||||||
|
margin-bottom: 0.15em;
|
||||||
|
margin-right: 0.1em;
|
||||||
|
vertical-align: middle;
|
||||||
|
width: 1em;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
@ -0,0 +1,40 @@
|
||||||
|
.ProseMirror {
|
||||||
|
h1 {
|
||||||
|
font-size: 1.87em;
|
||||||
|
margin: 26px 0 12px 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
h2 {
|
||||||
|
font-size: 1.6em;
|
||||||
|
margin: 21px 0 12px 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
h3 {
|
||||||
|
font-size: 1.3em;
|
||||||
|
margin: 16px 0 12px 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
h4 {
|
||||||
|
font-size: 1.1em;
|
||||||
|
margin: 14px 0 12px 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
h5 {
|
||||||
|
font-size: 1em;
|
||||||
|
margin: 5px 0 12px 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
h6 {
|
||||||
|
font-size: 1em;
|
||||||
|
margin: 0 0 12px 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
h1:first-child,
|
||||||
|
h2:first-child,
|
||||||
|
h3:first-child,
|
||||||
|
h4:first-child,
|
||||||
|
h5:first-child,
|
||||||
|
h6:first-child {
|
||||||
|
margin-top: 0;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
@ -0,0 +1,14 @@
|
||||||
|
@import './base.scss';
|
||||||
|
@import './code.scss';
|
||||||
|
@import './collaboration.scss';
|
||||||
|
@import './color.scss';
|
||||||
|
@import './heading.scss';
|
||||||
|
@import './katex.scss';
|
||||||
|
@import './list.scss';
|
||||||
|
@import './menu.scss';
|
||||||
|
@import './mind.scss';
|
||||||
|
@import './placeholder.scss';
|
||||||
|
@import './search.scss';
|
||||||
|
@import './selection.scss';
|
||||||
|
@import './table.scss';
|
||||||
|
@import './title.scss';
|
||||||
|
|
@ -1,15 +1,13 @@
|
||||||
.katex {
|
.katex {
|
||||||
|
font-size: 1em;
|
||||||
text-rendering: auto;
|
text-rendering: auto;
|
||||||
font: normal 1.21em;
|
|
||||||
line-height: 1.2;
|
|
||||||
text-indent: 0;
|
|
||||||
}
|
}
|
||||||
.katex * {
|
.katex * {
|
||||||
-ms-high-contrast-adjust: none !important;
|
-ms-high-contrast-adjust: none !important;
|
||||||
border-color: currentColor;
|
border-color: currentColor;
|
||||||
}
|
}
|
||||||
.katex .katex-version:after {
|
.katex .katex-version:after {
|
||||||
content: "0.15.2";
|
content: '0.15.2';
|
||||||
}
|
}
|
||||||
.katex .katex-mathml {
|
.katex .katex-mathml {
|
||||||
clip: rect(1px, 1px, 1px, 1px);
|
clip: rect(1px, 1px, 1px, 1px);
|
||||||
|
|
@ -811,7 +809,7 @@
|
||||||
}
|
}
|
||||||
.katex .stretchy:after,
|
.katex .stretchy:after,
|
||||||
.katex .stretchy:before {
|
.katex .stretchy:before {
|
||||||
content: "";
|
content: '';
|
||||||
}
|
}
|
||||||
.katex .hide-tail {
|
.katex .hide-tail {
|
||||||
overflow: hidden;
|
overflow: hidden;
|
||||||
|
|
@ -888,11 +886,11 @@
|
||||||
padding: 0 0.03889em;
|
padding: 0 0.03889em;
|
||||||
}
|
}
|
||||||
.katex .eqn-num:before {
|
.katex .eqn-num:before {
|
||||||
content: "(" counter(katexEqnNo) ")";
|
content: '(' counter(katexEqnNo) ')';
|
||||||
counter-increment: katexEqnNo;
|
counter-increment: katexEqnNo;
|
||||||
}
|
}
|
||||||
.katex .mml-eqn-num:before {
|
.katex .mml-eqn-num:before {
|
||||||
content: "(" counter(mmlEqnNo) ")";
|
content: '(' counter(mmlEqnNo) ')';
|
||||||
counter-increment: mmlEqnNo;
|
counter-increment: mmlEqnNo;
|
||||||
}
|
}
|
||||||
.katex .mtr-glue {
|
.katex .mtr-glue {
|
||||||
|
|
@ -940,6 +938,3 @@
|
||||||
padding-left: 2em;
|
padding-left: 2em;
|
||||||
text-align: left;
|
text-align: left;
|
||||||
}
|
}
|
||||||
body {
|
|
||||||
counter-reset: katexEqnNo mmlEqnNo;
|
|
||||||
}
|
|
||||||
|
|
@ -0,0 +1,106 @@
|
||||||
|
.ProseMirror {
|
||||||
|
ol,
|
||||||
|
ul {
|
||||||
|
padding-left: 28px;
|
||||||
|
}
|
||||||
|
|
||||||
|
li > ul,
|
||||||
|
li > ol,
|
||||||
|
ul > ul,
|
||||||
|
ol > ol {
|
||||||
|
margin-top: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
ul {
|
||||||
|
list-style-type: disc;
|
||||||
|
}
|
||||||
|
|
||||||
|
ol,
|
||||||
|
ol ol ol ol,
|
||||||
|
ol ol ol ol ol ol ol,
|
||||||
|
ol ol ol ol ol ol ol ol ol ol {
|
||||||
|
list-style-type: decimal;
|
||||||
|
}
|
||||||
|
|
||||||
|
ol ol,
|
||||||
|
ol ol ol ol ol,
|
||||||
|
ol ol ol ol ol ol ol ol,
|
||||||
|
ol ol ol ol ol ol ol ol ol ol ol {
|
||||||
|
list-style-type: lower-alpha;
|
||||||
|
}
|
||||||
|
|
||||||
|
ol ol ol,
|
||||||
|
ol ol ol ol ol ol,
|
||||||
|
ol ol ol ol ol ol ol ol ol,
|
||||||
|
ol ol ol ol ol ol ol ol ol ol ol ol {
|
||||||
|
list-style-type: lower-roman;
|
||||||
|
}
|
||||||
|
|
||||||
|
ul[data-type='taskList'] {
|
||||||
|
list-style: none;
|
||||||
|
padding: 0;
|
||||||
|
|
||||||
|
p {
|
||||||
|
margin: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
li {
|
||||||
|
position: relative;
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
padding-left: 16px;
|
||||||
|
cursor: pointer;
|
||||||
|
|
||||||
|
> span {
|
||||||
|
position: absolute;
|
||||||
|
left: 0;
|
||||||
|
top: 6px;
|
||||||
|
display: block;
|
||||||
|
width: 16px;
|
||||||
|
height: 16px;
|
||||||
|
border: 1px solid var(--semi-color-border);
|
||||||
|
border-radius: 2px;
|
||||||
|
background-color: #fff;
|
||||||
|
|
||||||
|
&::after {
|
||||||
|
content: ' ';
|
||||||
|
position: absolute;
|
||||||
|
left: 4.071429px;
|
||||||
|
top: -0.357143px;
|
||||||
|
width: 6.714286px;
|
||||||
|
height: 12.142857px;
|
||||||
|
border: 2px solid #fff;
|
||||||
|
border-top: 0;
|
||||||
|
border-left: 0;
|
||||||
|
transition: all 0.1s cubic-bezier(0.71, -0.46, 0.88, 0.6), opacity 0.1s;
|
||||||
|
transform: rotate(45deg) scale(0);
|
||||||
|
opacity: 0;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
> div {
|
||||||
|
flex: 1 1 auto;
|
||||||
|
padding-left: 0.5rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
&[data-checked='true'] {
|
||||||
|
color: var(--semi-color-text-2);
|
||||||
|
|
||||||
|
> span {
|
||||||
|
background-color: var(--semi-color-primary);
|
||||||
|
|
||||||
|
&::after {
|
||||||
|
opacity: 1;
|
||||||
|
transform: rotate(45deg) scale(1);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
> div {
|
||||||
|
p {
|
||||||
|
text-decoration: line-through;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
@ -0,0 +1,23 @@
|
||||||
|
.bubble-menu {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
padding: 4px;
|
||||||
|
border-radius: 3px;
|
||||||
|
box-shadow: var(--box-shadow);
|
||||||
|
background-color: var(--semi-color-nav-bg);
|
||||||
|
overflow-x: auto;
|
||||||
|
}
|
||||||
|
|
||||||
|
.bubble-memu-table-cell {
|
||||||
|
display: flex;
|
||||||
|
padding: 4px;
|
||||||
|
border-radius: 3px;
|
||||||
|
box-shadow: var(--box-shadow);
|
||||||
|
background-color: var(--semi-color-nav-bg);
|
||||||
|
|
||||||
|
&.row {
|
||||||
|
column-gap: 8px;
|
||||||
|
flex-direction: column;
|
||||||
|
transform: translate(0, 70%);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
@ -14,7 +14,6 @@
|
||||||
height: 100%;
|
height: 100%;
|
||||||
} /*box-shadow:0 0 2px #000;*/
|
} /*box-shadow:0 0 2px #000;*/
|
||||||
.jsmind-inner {
|
.jsmind-inner {
|
||||||
moz-user-select: -moz-none;
|
|
||||||
-moz-user-select: none;
|
-moz-user-select: none;
|
||||||
-o-user-select: none;
|
-o-user-select: none;
|
||||||
-khtml-user-select: none;
|
-khtml-user-select: none;
|
||||||
|
|
@ -111,12 +110,6 @@ jmnodes.theme-primary jmnode.selected {
|
||||||
background-color: #f1c40f;
|
background-color: #f1c40f;
|
||||||
color: #fff;
|
color: #fff;
|
||||||
}
|
}
|
||||||
jmnodes.theme-primary jmnode.root {
|
|
||||||
}
|
|
||||||
jmnodes.theme-primary jmexpander {
|
|
||||||
}
|
|
||||||
jmnodes.theme-primary jmexpander:hover {
|
|
||||||
}
|
|
||||||
|
|
||||||
/* warning theme */
|
/* warning theme */
|
||||||
jmnodes.theme-warning jmnode {
|
jmnodes.theme-warning jmnode {
|
||||||
|
|
@ -132,12 +125,6 @@ jmnodes.theme-warning jmnode.selected {
|
||||||
background-color: #11f;
|
background-color: #11f;
|
||||||
color: #fff;
|
color: #fff;
|
||||||
}
|
}
|
||||||
jmnodes.theme-warning jmnode.root {
|
|
||||||
}
|
|
||||||
jmnodes.theme-warning jmexpander {
|
|
||||||
}
|
|
||||||
jmnodes.theme-warning jmexpander:hover {
|
|
||||||
}
|
|
||||||
|
|
||||||
/* danger theme */
|
/* danger theme */
|
||||||
jmnodes.theme-danger jmnode {
|
jmnodes.theme-danger jmnode {
|
||||||
|
|
@ -153,12 +140,6 @@ jmnodes.theme-danger jmnode.selected {
|
||||||
background-color: #11f;
|
background-color: #11f;
|
||||||
color: #fff;
|
color: #fff;
|
||||||
}
|
}
|
||||||
jmnodes.theme-danger jmnode.root {
|
|
||||||
}
|
|
||||||
jmnodes.theme-danger jmexpander {
|
|
||||||
}
|
|
||||||
jmnodes.theme-danger jmexpander:hover {
|
|
||||||
}
|
|
||||||
|
|
||||||
/* success theme */
|
/* success theme */
|
||||||
jmnodes.theme-success jmnode {
|
jmnodes.theme-success jmnode {
|
||||||
|
|
@ -174,12 +155,6 @@ jmnodes.theme-success jmnode.selected {
|
||||||
background-color: #11f;
|
background-color: #11f;
|
||||||
color: #fff;
|
color: #fff;
|
||||||
}
|
}
|
||||||
jmnodes.theme-success jmnode.root {
|
|
||||||
}
|
|
||||||
jmnodes.theme-success jmexpander {
|
|
||||||
}
|
|
||||||
jmnodes.theme-success jmexpander:hover {
|
|
||||||
}
|
|
||||||
|
|
||||||
/* info theme */
|
/* info theme */
|
||||||
jmnodes.theme-info jmnode {
|
jmnodes.theme-info jmnode {
|
||||||
|
|
@ -195,12 +170,6 @@ jmnodes.theme-info jmnode.selected {
|
||||||
background-color: #11f;
|
background-color: #11f;
|
||||||
color: #fff;
|
color: #fff;
|
||||||
}
|
}
|
||||||
jmnodes.theme-info jmnode.root {
|
|
||||||
}
|
|
||||||
jmnodes.theme-info jmexpander {
|
|
||||||
}
|
|
||||||
jmnodes.theme-info jmexpander:hover {
|
|
||||||
}
|
|
||||||
|
|
||||||
/* greensea theme */
|
/* greensea theme */
|
||||||
jmnodes.theme-greensea jmnode {
|
jmnodes.theme-greensea jmnode {
|
||||||
|
|
@ -214,12 +183,6 @@ jmnodes.theme-greensea jmnode.selected {
|
||||||
background-color: #11f;
|
background-color: #11f;
|
||||||
color: #fff;
|
color: #fff;
|
||||||
}
|
}
|
||||||
jmnodes.theme-greensea jmnode.root {
|
|
||||||
}
|
|
||||||
jmnodes.theme-greensea jmexpander {
|
|
||||||
}
|
|
||||||
jmnodes.theme-greensea jmexpander:hover {
|
|
||||||
}
|
|
||||||
|
|
||||||
/* nephrite theme */
|
/* nephrite theme */
|
||||||
jmnodes.theme-nephrite jmnode {
|
jmnodes.theme-nephrite jmnode {
|
||||||
|
|
@ -233,12 +196,6 @@ jmnodes.theme-nephrite jmnode.selected {
|
||||||
background-color: #11f;
|
background-color: #11f;
|
||||||
color: #fff;
|
color: #fff;
|
||||||
}
|
}
|
||||||
jmnodes.theme-nephrite jmnode.root {
|
|
||||||
}
|
|
||||||
jmnodes.theme-nephrite jmexpander {
|
|
||||||
}
|
|
||||||
jmnodes.theme-nephrite jmexpander:hover {
|
|
||||||
}
|
|
||||||
|
|
||||||
/* belizehole theme */
|
/* belizehole theme */
|
||||||
jmnodes.theme-belizehole jmnode {
|
jmnodes.theme-belizehole jmnode {
|
||||||
|
|
@ -252,12 +209,6 @@ jmnodes.theme-belizehole jmnode.selected {
|
||||||
background-color: #11f;
|
background-color: #11f;
|
||||||
color: #fff;
|
color: #fff;
|
||||||
}
|
}
|
||||||
jmnodes.theme-belizehole jmnode.root {
|
|
||||||
}
|
|
||||||
jmnodes.theme-belizehole jmexpander {
|
|
||||||
}
|
|
||||||
jmnodes.theme-belizehole jmexpander:hover {
|
|
||||||
}
|
|
||||||
|
|
||||||
/* wisteria theme */
|
/* wisteria theme */
|
||||||
jmnodes.theme-wisteria jmnode {
|
jmnodes.theme-wisteria jmnode {
|
||||||
|
|
@ -271,12 +222,6 @@ jmnodes.theme-wisteria jmnode.selected {
|
||||||
background-color: #11f;
|
background-color: #11f;
|
||||||
color: #fff;
|
color: #fff;
|
||||||
}
|
}
|
||||||
jmnodes.theme-wisteria jmnode.root {
|
|
||||||
}
|
|
||||||
jmnodes.theme-wisteria jmexpander {
|
|
||||||
}
|
|
||||||
jmnodes.theme-wisteria jmexpander:hover {
|
|
||||||
}
|
|
||||||
|
|
||||||
/* asphalt theme */
|
/* asphalt theme */
|
||||||
jmnodes.theme-asphalt jmnode {
|
jmnodes.theme-asphalt jmnode {
|
||||||
|
|
@ -290,12 +235,6 @@ jmnodes.theme-asphalt jmnode.selected {
|
||||||
background-color: #11f;
|
background-color: #11f;
|
||||||
color: #fff;
|
color: #fff;
|
||||||
}
|
}
|
||||||
jmnodes.theme-asphalt jmnode.root {
|
|
||||||
}
|
|
||||||
jmnodes.theme-asphalt jmexpander {
|
|
||||||
}
|
|
||||||
jmnodes.theme-asphalt jmexpander:hover {
|
|
||||||
}
|
|
||||||
|
|
||||||
/* orange theme */
|
/* orange theme */
|
||||||
jmnodes.theme-orange jmnode {
|
jmnodes.theme-orange jmnode {
|
||||||
|
|
@ -309,12 +248,6 @@ jmnodes.theme-orange jmnode.selected {
|
||||||
background-color: #11f;
|
background-color: #11f;
|
||||||
color: #fff;
|
color: #fff;
|
||||||
}
|
}
|
||||||
jmnodes.theme-orange jmnode.root {
|
|
||||||
}
|
|
||||||
jmnodes.theme-orange jmexpander {
|
|
||||||
}
|
|
||||||
jmnodes.theme-orange jmexpander:hover {
|
|
||||||
}
|
|
||||||
|
|
||||||
/* pumpkin theme */
|
/* pumpkin theme */
|
||||||
jmnodes.theme-pumpkin jmnode {
|
jmnodes.theme-pumpkin jmnode {
|
||||||
|
|
@ -328,12 +261,6 @@ jmnodes.theme-pumpkin jmnode.selected {
|
||||||
background-color: #11f;
|
background-color: #11f;
|
||||||
color: #fff;
|
color: #fff;
|
||||||
}
|
}
|
||||||
jmnodes.theme-pumpkin jmnode.root {
|
|
||||||
}
|
|
||||||
jmnodes.theme-pumpkin jmexpander {
|
|
||||||
}
|
|
||||||
jmnodes.theme-pumpkin jmexpander:hover {
|
|
||||||
}
|
|
||||||
|
|
||||||
/* pomegranate theme */
|
/* pomegranate theme */
|
||||||
jmnodes.theme-pomegranate jmnode {
|
jmnodes.theme-pomegranate jmnode {
|
||||||
|
|
@ -347,12 +274,6 @@ jmnodes.theme-pomegranate jmnode.selected {
|
||||||
background-color: #11f;
|
background-color: #11f;
|
||||||
color: #fff;
|
color: #fff;
|
||||||
}
|
}
|
||||||
jmnodes.theme-pomegranate jmnode.root {
|
|
||||||
}
|
|
||||||
jmnodes.theme-pomegranate jmexpander {
|
|
||||||
}
|
|
||||||
jmnodes.theme-pomegranate jmexpander:hover {
|
|
||||||
}
|
|
||||||
|
|
||||||
/* clouds theme */
|
/* clouds theme */
|
||||||
jmnodes.theme-clouds jmnode {
|
jmnodes.theme-clouds jmnode {
|
||||||
|
|
@ -366,12 +287,6 @@ jmnodes.theme-clouds jmnode.selected {
|
||||||
background-color: #11f;
|
background-color: #11f;
|
||||||
color: #fff;
|
color: #fff;
|
||||||
}
|
}
|
||||||
jmnodes.theme-clouds jmnode.root {
|
|
||||||
}
|
|
||||||
jmnodes.theme-clouds jmexpander {
|
|
||||||
}
|
|
||||||
jmnodes.theme-clouds jmexpander:hover {
|
|
||||||
}
|
|
||||||
|
|
||||||
/* asbestos theme */
|
/* asbestos theme */
|
||||||
jmnodes.theme-asbestos jmnode {
|
jmnodes.theme-asbestos jmnode {
|
||||||
|
|
@ -385,9 +300,3 @@ jmnodes.theme-asbestos jmnode.selected {
|
||||||
background-color: #11f;
|
background-color: #11f;
|
||||||
color: #fff;
|
color: #fff;
|
||||||
}
|
}
|
||||||
jmnodes.theme-asbestos jmnode.root {
|
|
||||||
}
|
|
||||||
jmnodes.theme-asbestos jmexpander {
|
|
||||||
}
|
|
||||||
jmnodes.theme-asbestos jmexpander:hover {
|
|
||||||
}
|
|
||||||
|
|
@ -0,0 +1,19 @@
|
||||||
|
.ProseMirror {
|
||||||
|
.is-empty {
|
||||||
|
position: relative;
|
||||||
|
|
||||||
|
&.has-focus {
|
||||||
|
&::before {
|
||||||
|
content: attr(data-placeholder);
|
||||||
|
float: left;
|
||||||
|
color: #aaa;
|
||||||
|
pointer-events: none;
|
||||||
|
height: 0;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
&.node-codeBlock::before {
|
||||||
|
transform: translate(10px, 10px);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
@ -0,0 +1,9 @@
|
||||||
|
.ProseMirror {
|
||||||
|
.search-result {
|
||||||
|
background: rgb(255, 217, 0);
|
||||||
|
}
|
||||||
|
|
||||||
|
.search-result-current {
|
||||||
|
background: rgb(255, 0, 0);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
@ -0,0 +1,91 @@
|
||||||
|
.ProseMirror {
|
||||||
|
hr.selected-node {
|
||||||
|
background-color: var(--node-selected-border-color);
|
||||||
|
}
|
||||||
|
|
||||||
|
.node-status {
|
||||||
|
.semi-tag-default {
|
||||||
|
height: 27px;
|
||||||
|
border: 1px solid var(--node-border-color);
|
||||||
|
}
|
||||||
|
|
||||||
|
&.selected-node {
|
||||||
|
.semi-tag-default {
|
||||||
|
border: 1px solid var(--node-selected-border-color);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.node-codeBlock,
|
||||||
|
.node-katex,
|
||||||
|
.node-documentChildren,
|
||||||
|
.node-documentReference {
|
||||||
|
.render-wrapper {
|
||||||
|
border: 1px solid var(--node-border-color);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.node-codeBlock,
|
||||||
|
.node-katex {
|
||||||
|
.render-wrapper {
|
||||||
|
border-radius: var(--border-radius);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.node-attachment,
|
||||||
|
.node-banner,
|
||||||
|
.node-iframe,
|
||||||
|
.node-image,
|
||||||
|
.node-katex,
|
||||||
|
.node-mind,
|
||||||
|
.node-codeBlock,
|
||||||
|
.node-documentChildren,
|
||||||
|
.node-documentReference {
|
||||||
|
&:not(.has-focus) {
|
||||||
|
::selection {
|
||||||
|
background-color: transparent;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.render-wrapper {
|
||||||
|
position: relative;
|
||||||
|
user-select: text;
|
||||||
|
|
||||||
|
&:hover {
|
||||||
|
border: 1px solid var(--node-hover-border-color);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
&.selected-node {
|
||||||
|
.render-wrapper {
|
||||||
|
border: 1px solid var(--node-selected-border-color) !important;
|
||||||
|
|
||||||
|
&:hover {
|
||||||
|
border-color: var(--node-selected-border-color);
|
||||||
|
box-shadow: none;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.node-image,
|
||||||
|
.node-attachment,
|
||||||
|
.node-iframe,
|
||||||
|
.node-mind,
|
||||||
|
.node-banner {
|
||||||
|
margin-top: 0.75em;
|
||||||
|
}
|
||||||
|
|
||||||
|
.tableWrapper {
|
||||||
|
::selection {
|
||||||
|
background-color: transparent;
|
||||||
|
}
|
||||||
|
|
||||||
|
&.selected-node {
|
||||||
|
td,
|
||||||
|
th {
|
||||||
|
border-color: var(--node-selected-border-color);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
@ -0,0 +1,108 @@
|
||||||
|
.ProseMirror {
|
||||||
|
.tableWrapper {
|
||||||
|
max-width: 100%;
|
||||||
|
overflow: auto;
|
||||||
|
margin-top: 0.75em;
|
||||||
|
|
||||||
|
&.has-focus {
|
||||||
|
padding: 1em 0 0 1em;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
table {
|
||||||
|
border-collapse: collapse;
|
||||||
|
table-layout: fixed;
|
||||||
|
|
||||||
|
td,
|
||||||
|
th {
|
||||||
|
position: relative;
|
||||||
|
border-width: 1px;
|
||||||
|
border-style: solid;
|
||||||
|
border-color: var(--semi-color-fill-2);
|
||||||
|
box-sizing: border-box;
|
||||||
|
min-width: 1em;
|
||||||
|
padding: 3px 5px;
|
||||||
|
vertical-align: top;
|
||||||
|
overflow: visible;
|
||||||
|
|
||||||
|
> * {
|
||||||
|
margin-bottom: 0;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
th {
|
||||||
|
font-weight: bold;
|
||||||
|
background-color: var(--semi-color-fill-0);
|
||||||
|
}
|
||||||
|
|
||||||
|
.selectedCell {
|
||||||
|
border-style: double;
|
||||||
|
border-color: rgb(0 101 255);
|
||||||
|
background: var(--semi-color-info-light-hover);
|
||||||
|
}
|
||||||
|
|
||||||
|
.grip-column {
|
||||||
|
position: absolute;
|
||||||
|
z-index: 10;
|
||||||
|
display: block;
|
||||||
|
width: 100%;
|
||||||
|
height: 0.7em;
|
||||||
|
left: 0;
|
||||||
|
top: -1em;
|
||||||
|
margin-bottom: 3px;
|
||||||
|
cursor: pointer;
|
||||||
|
background: #ced4da;
|
||||||
|
|
||||||
|
&:hover,
|
||||||
|
&.selected {
|
||||||
|
background: var(--semi-color-info);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.grip-row {
|
||||||
|
position: absolute;
|
||||||
|
z-index: 10;
|
||||||
|
display: block;
|
||||||
|
height: 100%;
|
||||||
|
width: 0.7em;
|
||||||
|
top: 0;
|
||||||
|
left: -1em;
|
||||||
|
margin-right: 3px;
|
||||||
|
cursor: pointer;
|
||||||
|
background: #ced4da;
|
||||||
|
|
||||||
|
&:hover,
|
||||||
|
&.selected {
|
||||||
|
background: var(--semi-color-info);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.grip-table {
|
||||||
|
position: absolute;
|
||||||
|
z-index: 10;
|
||||||
|
display: block;
|
||||||
|
width: 0.8em;
|
||||||
|
height: 0.8em;
|
||||||
|
top: -1em;
|
||||||
|
left: -1em;
|
||||||
|
border-radius: 50%;
|
||||||
|
cursor: pointer;
|
||||||
|
background: #ced4da;
|
||||||
|
|
||||||
|
&:hover,
|
||||||
|
&.selected {
|
||||||
|
background: var(--semi-color-info);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.column-resize-handle {
|
||||||
|
background-color: #adf;
|
||||||
|
bottom: -2px;
|
||||||
|
position: absolute;
|
||||||
|
right: -2px;
|
||||||
|
pointer-events: none;
|
||||||
|
top: 0;
|
||||||
|
width: 4px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
@ -0,0 +1,17 @@
|
||||||
|
.ProseMirror {
|
||||||
|
.title {
|
||||||
|
font-size: 2.4em;
|
||||||
|
font-weight: bold;
|
||||||
|
color: var(--semi-color-text-0);
|
||||||
|
margin: 10px 0 22px;
|
||||||
|
border-bottom: 1px solid var(--semi-color-border);
|
||||||
|
|
||||||
|
&.is-empty::before {
|
||||||
|
content: attr(data-placeholder);
|
||||||
|
float: left;
|
||||||
|
color: #aaa;
|
||||||
|
pointer-events: none;
|
||||||
|
height: 0;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
@ -1,74 +0,0 @@
|
||||||
.bubble-menu {
|
|
||||||
display: flex;
|
|
||||||
align-items: center;
|
|
||||||
padding: 4px;
|
|
||||||
border-radius: 3px;
|
|
||||||
box-shadow: var(--box-shadow);
|
|
||||||
background-color: var(--semi-color-nav-bg);
|
|
||||||
overflow-x: auto;
|
|
||||||
}
|
|
||||||
|
|
||||||
.table-controller-wrapper {
|
|
||||||
display: flex;
|
|
||||||
padding: 4px;
|
|
||||||
border-radius: 3px;
|
|
||||||
box-shadow: var(--box-shadow);
|
|
||||||
background-color: var(--semi-color-nav-bg);
|
|
||||||
|
|
||||||
&.row {
|
|
||||||
column-gap: 8px;
|
|
||||||
flex-direction: column;
|
|
||||||
transform: translate(0, 70%);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.resizeable-image-container {
|
|
||||||
width: 100%;
|
|
||||||
font-size: 0;
|
|
||||||
|
|
||||||
&.left {
|
|
||||||
text-align: left;
|
|
||||||
}
|
|
||||||
|
|
||||||
&.center {
|
|
||||||
text-align: center;
|
|
||||||
}
|
|
||||||
&.right {
|
|
||||||
text-align: right;
|
|
||||||
}
|
|
||||||
|
|
||||||
img {
|
|
||||||
display: inline-block;
|
|
||||||
height: auto;
|
|
||||||
}
|
|
||||||
|
|
||||||
.resizeable-image-small {
|
|
||||||
max-width: 200px;
|
|
||||||
}
|
|
||||||
.resizeable-image-medium {
|
|
||||||
width: 50%;
|
|
||||||
}
|
|
||||||
.resizeable-image-large {
|
|
||||||
width: 100%;
|
|
||||||
}
|
|
||||||
.resizeable-image-float-none {
|
|
||||||
float: none;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.color {
|
|
||||||
white-space: nowrap;
|
|
||||||
|
|
||||||
&::before {
|
|
||||||
background-color: var(--color);
|
|
||||||
border: 1px solid rgba(128, 128, 128, 0.3);
|
|
||||||
border-radius: 2px;
|
|
||||||
content: ' ';
|
|
||||||
display: inline-block;
|
|
||||||
height: 1em;
|
|
||||||
margin-bottom: 0.15em;
|
|
||||||
margin-right: 0.1em;
|
|
||||||
vertical-align: middle;
|
|
||||||
width: 1em;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
@ -1,131 +0,0 @@
|
||||||
body[theme-mode="dark"] {
|
|
||||||
/*!
|
|
||||||
Theme: GitHub Dark
|
|
||||||
Description: Dark theme as seen on github.com
|
|
||||||
Author: github.com
|
|
||||||
Maintainer: @Hirse
|
|
||||||
Updated: 2021-05-15
|
|
||||||
|
|
||||||
Outdated base version: https://github.com/primer/github-syntax-dark
|
|
||||||
Current colors taken from GitHub's CSS
|
|
||||||
*/
|
|
||||||
|
|
||||||
.hljs {
|
|
||||||
color: #c9d1d9;
|
|
||||||
background: #0d1117;
|
|
||||||
}
|
|
||||||
|
|
||||||
.hljs-doctag,
|
|
||||||
.hljs-keyword,
|
|
||||||
.hljs-meta .hljs-keyword,
|
|
||||||
.hljs-template-tag,
|
|
||||||
.hljs-template-variable,
|
|
||||||
.hljs-type,
|
|
||||||
.hljs-variable.language_ {
|
|
||||||
/* prettylights-syntax-keyword */
|
|
||||||
color: #ff7b72;
|
|
||||||
}
|
|
||||||
|
|
||||||
.hljs-title,
|
|
||||||
.hljs-title.class_,
|
|
||||||
.hljs-title.class_.inherited__,
|
|
||||||
.hljs-title.function_ {
|
|
||||||
/* prettylights-syntax-entity */
|
|
||||||
color: #d2a8ff;
|
|
||||||
}
|
|
||||||
|
|
||||||
.hljs-attr,
|
|
||||||
.hljs-attribute,
|
|
||||||
.hljs-literal,
|
|
||||||
.hljs-meta,
|
|
||||||
.hljs-number,
|
|
||||||
.hljs-operator,
|
|
||||||
.hljs-variable,
|
|
||||||
.hljs-selector-attr,
|
|
||||||
.hljs-selector-class,
|
|
||||||
.hljs-selector-id {
|
|
||||||
/* prettylights-syntax-constant */
|
|
||||||
color: #79c0ff;
|
|
||||||
}
|
|
||||||
|
|
||||||
.hljs-regexp,
|
|
||||||
.hljs-string,
|
|
||||||
.hljs-meta .hljs-string {
|
|
||||||
/* prettylights-syntax-string */
|
|
||||||
color: #a5d6ff;
|
|
||||||
}
|
|
||||||
|
|
||||||
.hljs-built_in,
|
|
||||||
.hljs-symbol {
|
|
||||||
/* prettylights-syntax-variable */
|
|
||||||
color: #ffa657;
|
|
||||||
}
|
|
||||||
|
|
||||||
.hljs-comment,
|
|
||||||
.hljs-code,
|
|
||||||
.hljs-formula {
|
|
||||||
/* prettylights-syntax-comment */
|
|
||||||
color: #8b949e;
|
|
||||||
}
|
|
||||||
|
|
||||||
.hljs-name,
|
|
||||||
.hljs-quote,
|
|
||||||
.hljs-selector-tag,
|
|
||||||
.hljs-selector-pseudo {
|
|
||||||
/* prettylights-syntax-entity-tag */
|
|
||||||
color: #7ee787;
|
|
||||||
}
|
|
||||||
|
|
||||||
.hljs-subst {
|
|
||||||
/* prettylights-syntax-storage-modifier-import */
|
|
||||||
color: #c9d1d9;
|
|
||||||
}
|
|
||||||
|
|
||||||
.hljs-section {
|
|
||||||
/* prettylights-syntax-markup-heading */
|
|
||||||
color: #1f6feb;
|
|
||||||
font-weight: bold;
|
|
||||||
}
|
|
||||||
|
|
||||||
.hljs-bullet {
|
|
||||||
/* prettylights-syntax-markup-list */
|
|
||||||
color: #f2cc60;
|
|
||||||
}
|
|
||||||
|
|
||||||
.hljs-emphasis {
|
|
||||||
/* prettylights-syntax-markup-italic */
|
|
||||||
color: #c9d1d9;
|
|
||||||
font-style: italic;
|
|
||||||
}
|
|
||||||
|
|
||||||
.hljs-strong {
|
|
||||||
/* prettylights-syntax-markup-bold */
|
|
||||||
color: #c9d1d9;
|
|
||||||
font-weight: bold;
|
|
||||||
}
|
|
||||||
|
|
||||||
.hljs-addition {
|
|
||||||
/* prettylights-syntax-markup-inserted */
|
|
||||||
color: #aff5b4;
|
|
||||||
background-color: #033a16;
|
|
||||||
}
|
|
||||||
|
|
||||||
.hljs-deletion {
|
|
||||||
/* prettylights-syntax-markup-deleted */
|
|
||||||
color: #ffdcd7;
|
|
||||||
background-color: #67060c;
|
|
||||||
}
|
|
||||||
|
|
||||||
.hljs-char.escape_,
|
|
||||||
.hljs-link,
|
|
||||||
.hljs-params,
|
|
||||||
.hljs-property,
|
|
||||||
.hljs-punctuation,
|
|
||||||
.hljs-tag {
|
|
||||||
/* purposely ignored */
|
|
||||||
}
|
|
||||||
|
|
||||||
img {
|
|
||||||
opacity: 0.75;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
@ -1,125 +0,0 @@
|
||||||
/*!
|
|
||||||
Theme: GitHub
|
|
||||||
Description: Light theme as seen on github.com
|
|
||||||
Author: github.com
|
|
||||||
Maintainer: @Hirse
|
|
||||||
Updated: 2021-05-15
|
|
||||||
|
|
||||||
Outdated base version: https://github.com/primer/github-syntax-light
|
|
||||||
Current colors taken from GitHub's CSS
|
|
||||||
*/
|
|
||||||
|
|
||||||
.hljs {
|
|
||||||
color: #24292e;
|
|
||||||
background: #ffffff;
|
|
||||||
}
|
|
||||||
|
|
||||||
.hljs-doctag,
|
|
||||||
.hljs-keyword,
|
|
||||||
.hljs-meta .hljs-keyword,
|
|
||||||
.hljs-template-tag,
|
|
||||||
.hljs-template-variable,
|
|
||||||
.hljs-type,
|
|
||||||
.hljs-variable.language_ {
|
|
||||||
/* prettylights-syntax-keyword */
|
|
||||||
color: #d73a49;
|
|
||||||
}
|
|
||||||
|
|
||||||
.hljs-title,
|
|
||||||
.hljs-title.class_,
|
|
||||||
.hljs-title.class_.inherited__,
|
|
||||||
.hljs-title.function_ {
|
|
||||||
/* prettylights-syntax-entity */
|
|
||||||
color: #6f42c1;
|
|
||||||
}
|
|
||||||
|
|
||||||
.hljs-attr,
|
|
||||||
.hljs-attribute,
|
|
||||||
.hljs-literal,
|
|
||||||
.hljs-meta,
|
|
||||||
.hljs-number,
|
|
||||||
.hljs-operator,
|
|
||||||
.hljs-variable,
|
|
||||||
.hljs-selector-attr,
|
|
||||||
.hljs-selector-class,
|
|
||||||
.hljs-selector-id {
|
|
||||||
/* prettylights-syntax-constant */
|
|
||||||
color: #005cc5;
|
|
||||||
}
|
|
||||||
|
|
||||||
.hljs-regexp,
|
|
||||||
.hljs-string,
|
|
||||||
.hljs-meta .hljs-string {
|
|
||||||
/* prettylights-syntax-string */
|
|
||||||
color: #032f62;
|
|
||||||
}
|
|
||||||
|
|
||||||
.hljs-built_in,
|
|
||||||
.hljs-symbol {
|
|
||||||
/* prettylights-syntax-variable */
|
|
||||||
color: #e36209;
|
|
||||||
}
|
|
||||||
|
|
||||||
.hljs-comment,
|
|
||||||
.hljs-code,
|
|
||||||
.hljs-formula {
|
|
||||||
/* prettylights-syntax-comment */
|
|
||||||
color: #6a737d;
|
|
||||||
}
|
|
||||||
|
|
||||||
.hljs-name,
|
|
||||||
.hljs-quote,
|
|
||||||
.hljs-selector-tag,
|
|
||||||
.hljs-selector-pseudo {
|
|
||||||
/* prettylights-syntax-entity-tag */
|
|
||||||
color: #22863a;
|
|
||||||
}
|
|
||||||
|
|
||||||
.hljs-subst {
|
|
||||||
/* prettylights-syntax-storage-modifier-import */
|
|
||||||
color: #24292e;
|
|
||||||
}
|
|
||||||
|
|
||||||
.hljs-section {
|
|
||||||
/* prettylights-syntax-markup-heading */
|
|
||||||
color: #005cc5;
|
|
||||||
font-weight: bold;
|
|
||||||
}
|
|
||||||
|
|
||||||
.hljs-bullet {
|
|
||||||
/* prettylights-syntax-markup-list */
|
|
||||||
color: #735c0f;
|
|
||||||
}
|
|
||||||
|
|
||||||
.hljs-emphasis {
|
|
||||||
/* prettylights-syntax-markup-italic */
|
|
||||||
color: #24292e;
|
|
||||||
font-style: italic;
|
|
||||||
}
|
|
||||||
|
|
||||||
.hljs-strong {
|
|
||||||
/* prettylights-syntax-markup-bold */
|
|
||||||
color: #24292e;
|
|
||||||
font-weight: bold;
|
|
||||||
}
|
|
||||||
|
|
||||||
.hljs-addition {
|
|
||||||
/* prettylights-syntax-markup-inserted */
|
|
||||||
color: #22863a;
|
|
||||||
background-color: #f0fff4;
|
|
||||||
}
|
|
||||||
|
|
||||||
.hljs-deletion {
|
|
||||||
/* prettylights-syntax-markup-deleted */
|
|
||||||
color: #b31d28;
|
|
||||||
background-color: #ffeef0;
|
|
||||||
}
|
|
||||||
|
|
||||||
.hljs-char.escape_,
|
|
||||||
.hljs-link,
|
|
||||||
.hljs-params,
|
|
||||||
.hljs-property,
|
|
||||||
.hljs-punctuation,
|
|
||||||
.hljs-tag {
|
|
||||||
/* purposely ignored */
|
|
||||||
}
|
|
||||||
|
|
@ -1,106 +1,7 @@
|
||||||
@import '~@douyinfe/semi-ui/dist/css/semi.min.css';
|
@import '~@douyinfe/semi-ui/dist/css/semi.min.css';
|
||||||
@import './var.scss';
|
@import './var.scss';
|
||||||
@import './extension.scss';
|
@import './reset.scss';
|
||||||
@import './prosemirror.scss';
|
@import './editor/index.scss';
|
||||||
@import './github.scss';
|
|
||||||
@import './github-dark.scss';
|
|
||||||
@import './jsmind.scss';
|
|
||||||
@import './katex.scss';
|
|
||||||
|
|
||||||
/* Box sizing rules */
|
|
||||||
*,
|
|
||||||
*::before,
|
|
||||||
*::after {
|
|
||||||
box-sizing: border-box;
|
|
||||||
}
|
|
||||||
|
|
||||||
/* Remove default margin */
|
|
||||||
body,
|
|
||||||
h1,
|
|
||||||
h2,
|
|
||||||
h3,
|
|
||||||
h4,
|
|
||||||
p,
|
|
||||||
figure,
|
|
||||||
blockquote,
|
|
||||||
dl,
|
|
||||||
dd {
|
|
||||||
margin: 0;
|
|
||||||
}
|
|
||||||
|
|
||||||
/* Remove list styles on ul, ol elements with a list role, which suggests default styling will be removed */
|
|
||||||
ul[role='list'],
|
|
||||||
ol[role='list'] {
|
|
||||||
list-style: none;
|
|
||||||
}
|
|
||||||
|
|
||||||
/* Set core root defaults */
|
|
||||||
html:focus-within {
|
|
||||||
scroll-behavior: smooth;
|
|
||||||
}
|
|
||||||
|
|
||||||
html,
|
|
||||||
body {
|
|
||||||
padding: 0;
|
|
||||||
margin: 0;
|
|
||||||
}
|
|
||||||
|
|
||||||
/* Set core body defaults */
|
|
||||||
body {
|
|
||||||
height: 100vh;
|
|
||||||
height: var(--app-height);
|
|
||||||
text-rendering: optimizeSpeed;
|
|
||||||
line-height: 1.5;
|
|
||||||
|
|
||||||
> div#__next {
|
|
||||||
height: 100%;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
/* A elements that don't have a class get default styles */
|
|
||||||
a:not([class]) {
|
|
||||||
text-decoration-skip-ink: auto;
|
|
||||||
}
|
|
||||||
|
|
||||||
/* Make images easier to work with */
|
|
||||||
img,
|
|
||||||
picture {
|
|
||||||
display: inline-block;
|
|
||||||
max-width: 100%;
|
|
||||||
// display: block;
|
|
||||||
}
|
|
||||||
|
|
||||||
/* Inherit fonts for inputs and buttons */
|
|
||||||
input,
|
|
||||||
button,
|
|
||||||
textarea,
|
|
||||||
select {
|
|
||||||
font: inherit;
|
|
||||||
}
|
|
||||||
|
|
||||||
/* Remove all animations and transitions for people that prefer not to see them */
|
|
||||||
@media (prefers-reduced-motion: reduce) {
|
|
||||||
html:focus-within {
|
|
||||||
scroll-behavior: auto;
|
|
||||||
}
|
|
||||||
*,
|
|
||||||
*::before,
|
|
||||||
*::after {
|
|
||||||
animation-duration: 0.01ms !important;
|
|
||||||
animation-iteration-count: 1 !important;
|
|
||||||
transition-duration: 0.01ms !important;
|
|
||||||
scroll-behavior: auto !important;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
body {
|
|
||||||
overflow-x: hidden;
|
|
||||||
}
|
|
||||||
|
|
||||||
a {
|
|
||||||
color: inherit;
|
|
||||||
text-decoration: none;
|
|
||||||
}
|
|
||||||
|
|
||||||
.container {
|
.container {
|
||||||
margin-right: auto;
|
margin-right: auto;
|
||||||
|
|
@ -178,27 +79,6 @@ a {
|
||||||
color: var(--semi-color-text-0);
|
color: var(--semi-color-text-0);
|
||||||
}
|
}
|
||||||
|
|
||||||
.react-resizable {
|
|
||||||
position: relative;
|
|
||||||
}
|
|
||||||
|
|
||||||
.react-resizable-handle {
|
|
||||||
position: absolute;
|
|
||||||
bottom: -4px;
|
|
||||||
left: 50%;
|
|
||||||
width: 56px;
|
|
||||||
height: 8px;
|
|
||||||
background-color: #d9d9d9;
|
|
||||||
border-radius: 4px;
|
|
||||||
position: absolute;
|
|
||||||
margin-left: -28px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.react-resizable-handle-n,
|
|
||||||
.react-resizable-handle-s {
|
|
||||||
cursor: ns-resize;
|
|
||||||
}
|
|
||||||
|
|
||||||
.semi-spin-wrapper {
|
.semi-spin-wrapper {
|
||||||
display: flex;
|
display: flex;
|
||||||
flex-direction: column;
|
flex-direction: column;
|
||||||
|
|
|
||||||
|
|
@ -1,483 +0,0 @@
|
||||||
.collaboration-cursor__caret {
|
|
||||||
border-left: 1px solid #0d0d0d;
|
|
||||||
border-right: 1px solid #0d0d0d;
|
|
||||||
margin-left: -1px;
|
|
||||||
margin-right: -1px;
|
|
||||||
pointer-events: none;
|
|
||||||
position: relative;
|
|
||||||
word-break: normal;
|
|
||||||
}
|
|
||||||
|
|
||||||
.collaboration-cursor__label {
|
|
||||||
border-radius: 3px 3px 3px 0;
|
|
||||||
color: #0d0d0d;
|
|
||||||
font-size: 12px;
|
|
||||||
font-style: normal;
|
|
||||||
font-weight: 600;
|
|
||||||
left: -1px;
|
|
||||||
line-height: normal;
|
|
||||||
padding: 0.1rem 0.3rem;
|
|
||||||
position: absolute;
|
|
||||||
top: -1.4em;
|
|
||||||
user-select: none;
|
|
||||||
white-space: nowrap;
|
|
||||||
}
|
|
||||||
|
|
||||||
.ProseMirror {
|
|
||||||
color: var(--semi-color-text-0);
|
|
||||||
white-space: break-spaces;
|
|
||||||
word-break: break-word;
|
|
||||||
word-wrap: break-word;
|
|
||||||
font-family: 'Chinese Quote', 'Segoe UI', Roboto, RobotoNum, 'PingFang SC', 'Hiragino Sans GB', 'Microsoft YaHei',
|
|
||||||
'Helvetica Neue', Helvetica, Arial, sans-serif;
|
|
||||||
letter-spacing: 0.008em;
|
|
||||||
line-height: 1.74;
|
|
||||||
outline: none !important;
|
|
||||||
|
|
||||||
&:focus-visible {
|
|
||||||
outline: none;
|
|
||||||
}
|
|
||||||
|
|
||||||
.is-empty {
|
|
||||||
&.has-focus {
|
|
||||||
&::before {
|
|
||||||
content: attr(data-placeholder);
|
|
||||||
float: left;
|
|
||||||
color: #aaa;
|
|
||||||
pointer-events: none;
|
|
||||||
height: 0;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
&.node-codeBlock::before {
|
|
||||||
transform: translate(10px, 10px);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
hr {
|
|
||||||
border: 0;
|
|
||||||
height: 2px;
|
|
||||||
background: var(--semi-color-border);
|
|
||||||
margin: 18px 0;
|
|
||||||
}
|
|
||||||
|
|
||||||
ol,
|
|
||||||
ul {
|
|
||||||
padding-left: 28px;
|
|
||||||
}
|
|
||||||
|
|
||||||
li > ul,
|
|
||||||
li > ol,
|
|
||||||
ul > ul,
|
|
||||||
ol > ol {
|
|
||||||
margin-top: 0;
|
|
||||||
}
|
|
||||||
|
|
||||||
ul {
|
|
||||||
list-style-type: disc;
|
|
||||||
}
|
|
||||||
|
|
||||||
ol,
|
|
||||||
ol ol ol ol,
|
|
||||||
ol ol ol ol ol ol ol,
|
|
||||||
ol ol ol ol ol ol ol ol ol ol {
|
|
||||||
list-style-type: decimal;
|
|
||||||
}
|
|
||||||
|
|
||||||
ol ol,
|
|
||||||
ol ol ol ol ol,
|
|
||||||
ol ol ol ol ol ol ol ol,
|
|
||||||
ol ol ol ol ol ol ol ol ol ol ol {
|
|
||||||
list-style-type: lower-alpha;
|
|
||||||
}
|
|
||||||
|
|
||||||
ol ol ol,
|
|
||||||
ol ol ol ol ol ol,
|
|
||||||
ol ol ol ol ol ol ol ol ol,
|
|
||||||
ol ol ol ol ol ol ol ol ol ol ol ol {
|
|
||||||
list-style-type: lower-roman;
|
|
||||||
}
|
|
||||||
|
|
||||||
.title {
|
|
||||||
font-size: 2.4em;
|
|
||||||
font-weight: bold;
|
|
||||||
color: var(--semi-color-text-0);
|
|
||||||
margin: 10px 0 22px;
|
|
||||||
border-bottom: 1px solid var(--semi-color-border);
|
|
||||||
|
|
||||||
&.is-empty::before {
|
|
||||||
content: attr(data-placeholder);
|
|
||||||
float: left;
|
|
||||||
color: #aaa;
|
|
||||||
pointer-events: none;
|
|
||||||
height: 0;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
h1 {
|
|
||||||
font-size: 1.87em;
|
|
||||||
margin: 26px 0 12px 0;
|
|
||||||
}
|
|
||||||
|
|
||||||
h2 {
|
|
||||||
font-size: 1.6em;
|
|
||||||
margin: 21px 0 12px 0;
|
|
||||||
}
|
|
||||||
|
|
||||||
h3 {
|
|
||||||
font-size: 1.3em;
|
|
||||||
margin: 16px 0 12px 0;
|
|
||||||
}
|
|
||||||
|
|
||||||
h4 {
|
|
||||||
font-size: 1.1em;
|
|
||||||
margin: 14px 0 12px 0;
|
|
||||||
}
|
|
||||||
|
|
||||||
h5 {
|
|
||||||
font-size: 1em;
|
|
||||||
margin: 5px 0 12px 0;
|
|
||||||
}
|
|
||||||
|
|
||||||
h6 {
|
|
||||||
font-size: 1em;
|
|
||||||
margin: 0 0 12px 0;
|
|
||||||
}
|
|
||||||
|
|
||||||
h1:first-child,
|
|
||||||
h2:first-child,
|
|
||||||
h3:first-child,
|
|
||||||
h4:first-child,
|
|
||||||
h5:first-child,
|
|
||||||
h6:first-child {
|
|
||||||
margin-top: 0;
|
|
||||||
}
|
|
||||||
|
|
||||||
a {
|
|
||||||
color: var(--semi-color-link);
|
|
||||||
text-decoration: underline;
|
|
||||||
}
|
|
||||||
|
|
||||||
img {
|
|
||||||
border-radius: var(--border-radius);
|
|
||||||
border: 1px solid var(--semi-color-border);
|
|
||||||
}
|
|
||||||
|
|
||||||
p {
|
|
||||||
font-size: 1em;
|
|
||||||
line-height: 1.714;
|
|
||||||
font-weight: normal;
|
|
||||||
margin-top: 0.75rem;
|
|
||||||
margin-bottom: 0px;
|
|
||||||
letter-spacing: -0.005em;
|
|
||||||
}
|
|
||||||
|
|
||||||
ul[data-type='taskList'] {
|
|
||||||
list-style: none;
|
|
||||||
padding: 0;
|
|
||||||
|
|
||||||
p {
|
|
||||||
margin: 0;
|
|
||||||
}
|
|
||||||
|
|
||||||
li {
|
|
||||||
position: relative;
|
|
||||||
display: flex;
|
|
||||||
align-items: center;
|
|
||||||
padding-left: 16px;
|
|
||||||
cursor: pointer;
|
|
||||||
|
|
||||||
> span {
|
|
||||||
position: absolute;
|
|
||||||
left: 0;
|
|
||||||
top: 6px;
|
|
||||||
display: block;
|
|
||||||
width: 16px;
|
|
||||||
height: 16px;
|
|
||||||
border: 1px solid var(--semi-color-border);
|
|
||||||
border-radius: 2px;
|
|
||||||
background-color: #fff;
|
|
||||||
|
|
||||||
&::after {
|
|
||||||
content: ' ';
|
|
||||||
position: absolute;
|
|
||||||
left: 4.071429px;
|
|
||||||
top: -0.357143px;
|
|
||||||
width: 6.714286px;
|
|
||||||
height: 12.142857px;
|
|
||||||
border: 2px solid #fff;
|
|
||||||
border-top: 0;
|
|
||||||
border-left: 0;
|
|
||||||
transition: all 0.1s cubic-bezier(0.71, -0.46, 0.88, 0.6), opacity 0.1s;
|
|
||||||
transform: rotate(45deg) scale(0);
|
|
||||||
opacity: 0;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
> div {
|
|
||||||
flex: 1 1 auto;
|
|
||||||
padding-left: 0.5rem;
|
|
||||||
}
|
|
||||||
|
|
||||||
&[data-checked='true'] {
|
|
||||||
color: var(--semi-color-text-2);
|
|
||||||
|
|
||||||
> span {
|
|
||||||
background-color: var(--semi-color-primary);
|
|
||||||
|
|
||||||
&::after {
|
|
||||||
opacity: 1;
|
|
||||||
transform: rotate(45deg) scale(1);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
> div {
|
|
||||||
p {
|
|
||||||
text-decoration: line-through;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
blockquote {
|
|
||||||
box-sizing: border-box;
|
|
||||||
padding-left: 10px;
|
|
||||||
border-left: 2px solid var(--semi-color-fill-2);
|
|
||||||
margin: 0.75rem 0;
|
|
||||||
}
|
|
||||||
|
|
||||||
code {
|
|
||||||
cursor: text;
|
|
||||||
font-size: 0.875rem;
|
|
||||||
line-height: 1.5rem;
|
|
||||||
border-radius: var(--border-radius);
|
|
||||||
padding: 4px;
|
|
||||||
line-height: 1.3;
|
|
||||||
background-color: var(--semi-color-fill-1);
|
|
||||||
font-family: Consolas, Menlo, Courier, monospace;
|
|
||||||
}
|
|
||||||
|
|
||||||
pre {
|
|
||||||
position: relative;
|
|
||||||
margin: 0;
|
|
||||||
counter-reset: line 0;
|
|
||||||
display: flex;
|
|
||||||
min-width: 48px;
|
|
||||||
overflow-x: auto;
|
|
||||||
line-height: 1.3;
|
|
||||||
background-color: var(--semi-color-fill-0);
|
|
||||||
|
|
||||||
code {
|
|
||||||
color: inherit;
|
|
||||||
font-size: 0.875rem;
|
|
||||||
line-height: 1.5rem;
|
|
||||||
margin: 8px;
|
|
||||||
padding: 0;
|
|
||||||
white-space: pre;
|
|
||||||
background-color: transparent;
|
|
||||||
|
|
||||||
width: 100%;
|
|
||||||
max-height: 370px;
|
|
||||||
overflow: auto;
|
|
||||||
overscroll-behavior: contain;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.tableWrapper {
|
|
||||||
max-width: 100%;
|
|
||||||
margin: 1em 0;
|
|
||||||
overflow: auto;
|
|
||||||
|
|
||||||
&.has-focus {
|
|
||||||
padding-left: 1em;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
table {
|
|
||||||
border-collapse: collapse;
|
|
||||||
table-layout: fixed;
|
|
||||||
margin: 1em 0;
|
|
||||||
|
|
||||||
td,
|
|
||||||
th {
|
|
||||||
position: relative;
|
|
||||||
border-width: 1px;
|
|
||||||
border-style: solid;
|
|
||||||
border-color: var(--semi-color-fill-2);
|
|
||||||
box-sizing: border-box;
|
|
||||||
min-width: 1em;
|
|
||||||
padding: 3px 5px;
|
|
||||||
vertical-align: top;
|
|
||||||
overflow: visible;
|
|
||||||
|
|
||||||
> * {
|
|
||||||
margin-bottom: 0;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
th {
|
|
||||||
font-weight: bold;
|
|
||||||
background-color: rgb(244, 245, 247);
|
|
||||||
}
|
|
||||||
|
|
||||||
.selectedCell {
|
|
||||||
border-style: double;
|
|
||||||
border-color: rgb(0 101 255);
|
|
||||||
background: var(--semi-color-info-light-hover);
|
|
||||||
}
|
|
||||||
|
|
||||||
.grip-column {
|
|
||||||
position: absolute;
|
|
||||||
z-index: 10;
|
|
||||||
display: block;
|
|
||||||
width: 100%;
|
|
||||||
height: 0.7em;
|
|
||||||
left: 0;
|
|
||||||
top: -1em;
|
|
||||||
margin-bottom: 3px;
|
|
||||||
cursor: pointer;
|
|
||||||
background: #ced4da;
|
|
||||||
|
|
||||||
&:hover,
|
|
||||||
&.selected {
|
|
||||||
background: var(--semi-color-info);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.grip-row {
|
|
||||||
position: absolute;
|
|
||||||
z-index: 10;
|
|
||||||
display: block;
|
|
||||||
height: 100%;
|
|
||||||
width: 0.7em;
|
|
||||||
top: 0;
|
|
||||||
left: -1em;
|
|
||||||
margin-right: 3px;
|
|
||||||
cursor: pointer;
|
|
||||||
background: #ced4da;
|
|
||||||
|
|
||||||
&:hover,
|
|
||||||
&.selected {
|
|
||||||
background: var(--semi-color-info);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.grip-table {
|
|
||||||
position: absolute;
|
|
||||||
z-index: 10;
|
|
||||||
display: block;
|
|
||||||
width: 0.8em;
|
|
||||||
height: 0.8em;
|
|
||||||
top: -1em;
|
|
||||||
left: -1em;
|
|
||||||
border-radius: 50%;
|
|
||||||
cursor: pointer;
|
|
||||||
background: #ced4da;
|
|
||||||
|
|
||||||
&:hover,
|
|
||||||
&.selected {
|
|
||||||
background: var(--semi-color-info);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.column-resize-handle {
|
|
||||||
background-color: #adf;
|
|
||||||
bottom: -2px;
|
|
||||||
position: absolute;
|
|
||||||
right: -2px;
|
|
||||||
pointer-events: none;
|
|
||||||
top: 0;
|
|
||||||
width: 4px;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.search-result {
|
|
||||||
background: rgb(255, 217, 0);
|
|
||||||
}
|
|
||||||
|
|
||||||
.search-result-current {
|
|
||||||
background: rgb(255, 0, 0);
|
|
||||||
}
|
|
||||||
|
|
||||||
/******* 选中样式 *******/
|
|
||||||
hr.selected-node {
|
|
||||||
background-color: rgb(0, 101, 255);
|
|
||||||
}
|
|
||||||
|
|
||||||
.node-status {
|
|
||||||
.semi-tag-default {
|
|
||||||
border: 1px solid var(--semi-color-border);
|
|
||||||
}
|
|
||||||
|
|
||||||
&.selected-node {
|
|
||||||
.semi-tag-default {
|
|
||||||
border: 1px solid rgb(0 101 255);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.node-codeBlock,
|
|
||||||
.node-katex,
|
|
||||||
.node-documentChildren,
|
|
||||||
.node-documentReference {
|
|
||||||
.render-wrapper {
|
|
||||||
border: 1px solid var(--semi-color-border);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.node-codeBlock,
|
|
||||||
.node-katex {
|
|
||||||
.render-wrapper {
|
|
||||||
border-radius: var(--border-radius);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.node-attachment,
|
|
||||||
.node-banner,
|
|
||||||
.node-iframe,
|
|
||||||
.node-image,
|
|
||||||
.node-katex,
|
|
||||||
.node-mind,
|
|
||||||
.node-codeBlock,
|
|
||||||
.node-documentChildren,
|
|
||||||
.node-documentReference {
|
|
||||||
&:not(.has-focus) {
|
|
||||||
::selection {
|
|
||||||
background-color: transparent;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.render-wrapper {
|
|
||||||
position: relative;
|
|
||||||
user-select: text;
|
|
||||||
}
|
|
||||||
|
|
||||||
&.selected-node {
|
|
||||||
.render-wrapper {
|
|
||||||
border: 1px solid rgb(0 101 255) !important;
|
|
||||||
background-color: #e0ebfa;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.tableWrapper {
|
|
||||||
::selection {
|
|
||||||
background-color: transparent;
|
|
||||||
}
|
|
||||||
|
|
||||||
&.selected-node {
|
|
||||||
td,
|
|
||||||
th {
|
|
||||||
border-color: rgb(0 101 255);
|
|
||||||
background-color: #e0ebfa;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
/******* 选中样式 *******/
|
|
||||||
}
|
|
||||||
|
|
||||||
.resize-cursor {
|
|
||||||
cursor: ew-resize;
|
|
||||||
cursor: col-resize;
|
|
||||||
}
|
|
||||||
|
|
@ -0,0 +1,94 @@
|
||||||
|
/* Box sizing rules */
|
||||||
|
*,
|
||||||
|
*::before,
|
||||||
|
*::after {
|
||||||
|
box-sizing: border-box;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Remove default margin */
|
||||||
|
body,
|
||||||
|
h1,
|
||||||
|
h2,
|
||||||
|
h3,
|
||||||
|
h4,
|
||||||
|
p,
|
||||||
|
figure,
|
||||||
|
blockquote,
|
||||||
|
dl,
|
||||||
|
dd {
|
||||||
|
margin: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Remove list styles on ul, ol elements with a list role, which suggests default styling will be removed */
|
||||||
|
ul[role='list'],
|
||||||
|
ol[role='list'] {
|
||||||
|
list-style: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Set core root defaults */
|
||||||
|
html:focus-within {
|
||||||
|
scroll-behavior: smooth;
|
||||||
|
}
|
||||||
|
|
||||||
|
html,
|
||||||
|
body {
|
||||||
|
padding: 0;
|
||||||
|
margin: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Set core body defaults */
|
||||||
|
body {
|
||||||
|
height: 100vh;
|
||||||
|
height: var(--app-height);
|
||||||
|
text-rendering: optimizeSpeed;
|
||||||
|
line-height: 1.5;
|
||||||
|
|
||||||
|
> div#__next {
|
||||||
|
height: 100%;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
/* A elements that don't have a class get default styles */
|
||||||
|
a:not([class]) {
|
||||||
|
text-decoration-skip-ink: auto;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Make images easier to work with */
|
||||||
|
img,
|
||||||
|
picture {
|
||||||
|
display: inline-block;
|
||||||
|
max-width: 100%;
|
||||||
|
// display: block;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Inherit fonts for inputs and buttons */
|
||||||
|
input,
|
||||||
|
button,
|
||||||
|
textarea,
|
||||||
|
select {
|
||||||
|
font: inherit;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Remove all animations and transitions for people that prefer not to see them */
|
||||||
|
@media (prefers-reduced-motion: reduce) {
|
||||||
|
html:focus-within {
|
||||||
|
scroll-behavior: auto;
|
||||||
|
}
|
||||||
|
*,
|
||||||
|
*::before,
|
||||||
|
*::after {
|
||||||
|
animation-duration: 0.01ms !important;
|
||||||
|
animation-iteration-count: 1 !important;
|
||||||
|
transition-duration: 0.01ms !important;
|
||||||
|
scroll-behavior: auto !important;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
body {
|
||||||
|
overflow-x: hidden;
|
||||||
|
}
|
||||||
|
|
||||||
|
a {
|
||||||
|
color: inherit;
|
||||||
|
text-decoration: none;
|
||||||
|
}
|
||||||
|
|
@ -1,4 +1,8 @@
|
||||||
:root {
|
:root {
|
||||||
--border-radius: 4px;
|
--border-radius: 4px;
|
||||||
--box-shadow: rgb(0 0 0 / 10%) 0px 0px 10px;
|
--box-shadow: rgb(0 0 0 / 10%) 0px 0px 10px;
|
||||||
|
|
||||||
|
--node-border-color: rgb(28 31 35 / 8%);
|
||||||
|
--node-hover-border-color: #bacefd; // 自定义节点 hover
|
||||||
|
--node-selected-border-color: rgb(0 101 255); // 自定义节点选中
|
||||||
}
|
}
|
||||||
|
|
|
||||||
|
|
@ -73,6 +73,8 @@ importers:
|
||||||
'@tiptap/extension-paragraph': ^2.0.0-beta.23
|
'@tiptap/extension-paragraph': ^2.0.0-beta.23
|
||||||
'@tiptap/extension-placeholder': ^2.0.0-beta.47
|
'@tiptap/extension-placeholder': ^2.0.0-beta.47
|
||||||
'@tiptap/extension-strike': ^2.0.0-beta.27
|
'@tiptap/extension-strike': ^2.0.0-beta.27
|
||||||
|
'@tiptap/extension-subscript': ^2.0.0-beta.10
|
||||||
|
'@tiptap/extension-superscript': ^2.0.0-beta.10
|
||||||
'@tiptap/extension-table': ^2.0.0-beta.48
|
'@tiptap/extension-table': ^2.0.0-beta.48
|
||||||
'@tiptap/extension-table-cell': ^2.0.0-beta.20
|
'@tiptap/extension-table-cell': ^2.0.0-beta.20
|
||||||
'@tiptap/extension-table-header': ^2.0.0-beta.22
|
'@tiptap/extension-table-header': ^2.0.0-beta.22
|
||||||
|
|
@ -150,6 +152,8 @@ importers:
|
||||||
'@tiptap/extension-paragraph': 2.0.0-beta.23_@tiptap+core@2.0.0-beta.171
|
'@tiptap/extension-paragraph': 2.0.0-beta.23_@tiptap+core@2.0.0-beta.171
|
||||||
'@tiptap/extension-placeholder': 2.0.0-beta.47_@tiptap+core@2.0.0-beta.171
|
'@tiptap/extension-placeholder': 2.0.0-beta.47_@tiptap+core@2.0.0-beta.171
|
||||||
'@tiptap/extension-strike': 2.0.0-beta.27_@tiptap+core@2.0.0-beta.171
|
'@tiptap/extension-strike': 2.0.0-beta.27_@tiptap+core@2.0.0-beta.171
|
||||||
|
'@tiptap/extension-subscript': 2.0.0-beta.10_@tiptap+core@2.0.0-beta.171
|
||||||
|
'@tiptap/extension-superscript': 2.0.0-beta.10_@tiptap+core@2.0.0-beta.171
|
||||||
'@tiptap/extension-table': 2.0.0-beta.48_@tiptap+core@2.0.0-beta.171
|
'@tiptap/extension-table': 2.0.0-beta.48_@tiptap+core@2.0.0-beta.171
|
||||||
'@tiptap/extension-table-cell': 2.0.0-beta.20_@tiptap+core@2.0.0-beta.171
|
'@tiptap/extension-table-cell': 2.0.0-beta.20_@tiptap+core@2.0.0-beta.171
|
||||||
'@tiptap/extension-table-header': 2.0.0-beta.22_@tiptap+core@2.0.0-beta.171
|
'@tiptap/extension-table-header': 2.0.0-beta.22_@tiptap+core@2.0.0-beta.171
|
||||||
|
|
@ -1807,6 +1811,22 @@ packages:
|
||||||
'@tiptap/core': 2.0.0-beta.171
|
'@tiptap/core': 2.0.0-beta.171
|
||||||
dev: false
|
dev: false
|
||||||
|
|
||||||
|
/@tiptap/extension-subscript/2.0.0-beta.10_@tiptap+core@2.0.0-beta.171:
|
||||||
|
resolution: {integrity: sha512-er8/1lp0Rb+SKwEioW0w4oVf3EkdQZ0WS/5kPBG4W0DncfUMT+bw5de76S3kRL9PLZ9UShAL7wuXtuiSi5QsMw==}
|
||||||
|
peerDependencies:
|
||||||
|
'@tiptap/core': ^2.0.0-beta.1
|
||||||
|
dependencies:
|
||||||
|
'@tiptap/core': 2.0.0-beta.171
|
||||||
|
dev: false
|
||||||
|
|
||||||
|
/@tiptap/extension-superscript/2.0.0-beta.10_@tiptap+core@2.0.0-beta.171:
|
||||||
|
resolution: {integrity: sha512-TUUBS8XsD2MorGORYVlhGDH7wcc9diSbHscD4Dnz8pKWVR0JPUd/od4h5qSffDzAOKxtphTiX9LOFWk6zVooKg==}
|
||||||
|
peerDependencies:
|
||||||
|
'@tiptap/core': ^2.0.0-beta.1
|
||||||
|
dependencies:
|
||||||
|
'@tiptap/core': 2.0.0-beta.171
|
||||||
|
dev: false
|
||||||
|
|
||||||
/@tiptap/extension-table-cell/2.0.0-beta.20_@tiptap+core@2.0.0-beta.171:
|
/@tiptap/extension-table-cell/2.0.0-beta.20_@tiptap+core@2.0.0-beta.171:
|
||||||
resolution: {integrity: sha512-IllQyxLQvgm1FAewz3U+DkgNHRthmuVrtUQnG6la45qdUOLCOrpFbRRaQ1LJ/BpbvZ2Xs1o2yAa97BqZOPwovQ==}
|
resolution: {integrity: sha512-IllQyxLQvgm1FAewz3U+DkgNHRthmuVrtUQnG6la45qdUOLCOrpFbRRaQ1LJ/BpbvZ2Xs1o2yAa97BqZOPwovQ==}
|
||||||
peerDependencies:
|
peerDependencies:
|
||||||
|
|
|
||||||
Loading…
Reference in New Issue