mirror of https://github.com/fantasticit/think.git
feat: improve style
This commit is contained in:
fantasticit
parent
b3fcbd5dca
commit
c1295d8b6c
|
|
@ -60,33 +60,29 @@ export const Emoji = Node.create({
|
|||
new Plugin({
|
||||
key: new PluginKey('emojiPlaceholder'),
|
||||
props: {
|
||||
decorations: (state) => {
|
||||
if (!editor.isEditable) return;
|
||||
|
||||
const parent = findParentNode((node) => node.type.name === 'paragraph')(state.selection);
|
||||
if (!parent) {
|
||||
return;
|
||||
}
|
||||
|
||||
const decorations: Decoration[] = [];
|
||||
const isEmpty = parent && parent.node.content.size === 0;
|
||||
const isSlash = parent && parent.node.textContent === ':';
|
||||
const isTopLevel = state.selection.$from.depth === 1;
|
||||
|
||||
if (isTopLevel) {
|
||||
if (isSlash) {
|
||||
decorations.push(
|
||||
Decoration.node(parent.pos, parent.pos + parent.node.nodeSize, {
|
||||
'class': 'placeholder',
|
||||
'data-placeholder': ` 继续输入进行过滤`,
|
||||
})
|
||||
);
|
||||
}
|
||||
|
||||
return DecorationSet.create(state.doc, decorations);
|
||||
}
|
||||
return null;
|
||||
},
|
||||
// decorations: (state) => {
|
||||
// if (!editor.isEditable) return;
|
||||
// const parent = findParentNode((node) => node.type.name === 'paragraph')(state.selection);
|
||||
// if (!parent) {
|
||||
// return;
|
||||
// }
|
||||
// const decorations: Decoration[] = [];
|
||||
// const isEmpty = parent && parent.node.content.size === 0;
|
||||
// const isSlash = parent && parent.node.textContent === ':';
|
||||
// const isTopLevel = state.selection.$from.depth === 1;
|
||||
// if (isTopLevel) {
|
||||
// if (isSlash) {
|
||||
// decorations.push(
|
||||
// Decoration.node(parent.pos, parent.pos + parent.node.nodeSize, {
|
||||
// 'class': 'placeholder',
|
||||
// 'data-placeholder': ` 继续输入进行过滤`,
|
||||
// })
|
||||
// );
|
||||
// }
|
||||
// return DecorationSet.create(state.doc, decorations);
|
||||
// }
|
||||
// return null;
|
||||
// },
|
||||
},
|
||||
}),
|
||||
];
|
||||
|
|
|
|||
|
|
@ -42,43 +42,38 @@ export const EvokeMenu = Node.create({
|
|||
new Plugin({
|
||||
key: new PluginKey('evokeMenuPlaceholder'),
|
||||
props: {
|
||||
decorations: (state) => {
|
||||
if (!editor.isEditable) return;
|
||||
|
||||
const parent = findParentNode((node) => node.type.name === 'paragraph')(state.selection);
|
||||
if (!parent) {
|
||||
return;
|
||||
}
|
||||
|
||||
const decorations: Decoration[] = [];
|
||||
const isEmpty = parent && parent.node.content.size === 0;
|
||||
const isSlash = parent && parent.node.textContent === '/';
|
||||
const isTopLevel = state.selection.$from.depth === 1;
|
||||
const hasOtherChildren = parent && parent.node.content.childCount > 1;
|
||||
|
||||
if (isTopLevel) {
|
||||
if (isEmpty) {
|
||||
decorations.push(
|
||||
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',
|
||||
'data-placeholder': ` 继续输入进行过滤`,
|
||||
})
|
||||
);
|
||||
}
|
||||
|
||||
return DecorationSet.create(state.doc, decorations);
|
||||
}
|
||||
return null;
|
||||
},
|
||||
// decorations: (state) => {
|
||||
// if (!editor.isEditable) return;
|
||||
// const parent = findParentNode((node) => node.type.name === 'paragraph')(state.selection);
|
||||
// if (!parent) {
|
||||
// return;
|
||||
// }
|
||||
// const decorations: Decoration[] = [];
|
||||
// const isEmpty = parent && parent.node.content.size === 0;
|
||||
// const isSlash = parent && parent.node.textContent === '/';
|
||||
// const isTopLevel = state.selection.$from.depth === 1;
|
||||
// const hasOtherChildren = parent && parent.node.content.childCount > 1;
|
||||
// if (isTopLevel) {
|
||||
// if (isEmpty) {
|
||||
// decorations.push(
|
||||
// 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',
|
||||
// 'data-placeholder': ` 继续输入进行过滤`,
|
||||
// })
|
||||
// );
|
||||
// }
|
||||
// return DecorationSet.create(state.doc, decorations);
|
||||
// }
|
||||
// return null;
|
||||
// },
|
||||
},
|
||||
}),
|
||||
];
|
||||
|
|
|
|||
|
|
@ -105,7 +105,7 @@ export const TableCell = BuiltInTableCell.extend({
|
|||
return !!cells?.some((cell, index) => isRowSelected(index)(editor.state.selection));
|
||||
},
|
||||
init: (dom, editor) => {
|
||||
dom.classList.add('table-controller-wrapper');
|
||||
dom.classList.add('bubble-memu-table-cell');
|
||||
dom.classList.add('row');
|
||||
ReactDOM.render(
|
||||
<>
|
||||
|
|
|
|||
|
|
@ -94,7 +94,7 @@ export const TableHeader = BuiltInTableHeader.extend({
|
|||
return !!cells?.some((cell, index) => isColumnSelected(index)(selection));
|
||||
},
|
||||
init: (dom, editor) => {
|
||||
dom.classList.add('table-controller-wrapper');
|
||||
dom.classList.add('bubble-memu-table-cell');
|
||||
ReactDOM.render(
|
||||
<Space>
|
||||
<Tooltip content="向前插入一列">
|
||||
|
|
|
|||
|
|
@ -21,7 +21,7 @@ import { Table } from '../extensions/table';
|
|||
export const TableBubbleMenu = ({ editor }) => {
|
||||
return (
|
||||
<BubbleMenu
|
||||
className={'bubble-menu table-bubble-menu'}
|
||||
className={'bubble-menu bubble-menu-table'}
|
||||
editor={editor}
|
||||
pluginKey="table-bubble-menu"
|
||||
shouldShow={() => editor.isActive(Table.name)}
|
||||
|
|
|
|||
|
|
@ -2,7 +2,6 @@
|
|||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
margin: 10px 0;
|
||||
padding: 8px 16px;
|
||||
border: 1px solid var(--semi-color-border);
|
||||
border-radius: var(--border-radius);
|
||||
|
|
|
|||
|
|
@ -1,5 +1,4 @@
|
|||
.wrap {
|
||||
margin: 12px 0;
|
||||
line-height: 0;
|
||||
border-radius: var(--border-radius);
|
||||
border: 1px solid var(--semi-color-border);
|
||||
|
|
|
|||
|
|
@ -1,15 +1,10 @@
|
|||
.wrap {
|
||||
margin-top: 12px;
|
||||
margin-top: 0.75em;
|
||||
padding: 12px;
|
||||
border: 1px solid var(--semi-color-border);
|
||||
border-radius: var(--border-radius);
|
||||
|
||||
&.isEditable {
|
||||
background-color: var(--semi-color-fill-0);
|
||||
|
||||
&:hover {
|
||||
background-color: var(--semi-color-fill-1);
|
||||
}
|
||||
|
||||
.itemWrap {
|
||||
pointer-events: none;
|
||||
|
||||
|
|
@ -24,6 +19,7 @@
|
|||
display: flex;
|
||||
align-items: center;
|
||||
margin-top: 12px;
|
||||
padding: 6px;
|
||||
text-decoration: none;
|
||||
color: var(--semi-color-text-1);
|
||||
border-radius: var(--border-radius);
|
||||
|
|
|
|||
|
|
@ -76,8 +76,6 @@ export const DocumentChildrenWrapper = ({ editor, node, updateAttributes }) => {
|
|||
<Text type="tertiary">当前页面无法使用子文档</Text>
|
||||
)}
|
||||
</div>
|
||||
|
||||
<NodeViewContent></NodeViewContent>
|
||||
</NodeViewWrapper>
|
||||
);
|
||||
};
|
||||
|
|
|
|||
|
|
@ -1,23 +1,13 @@
|
|||
.wrap {
|
||||
margin-top: 12px;
|
||||
margin-top: 0.75em;
|
||||
border-radius: var(--border-radius);
|
||||
|
||||
&.isEditable {
|
||||
border-color: transparent !important;
|
||||
padding: 12px;
|
||||
background-color: var(--semi-color-fill-0);
|
||||
|
||||
&:hover {
|
||||
background-color: var(--semi-color-fill-1);
|
||||
}
|
||||
|
||||
.itemWrap {
|
||||
pointer-events: none;
|
||||
margin-top: 12px;
|
||||
|
||||
&:hover {
|
||||
color: var(--semi-color-text-1);
|
||||
border-color: var(--semi-color-border);
|
||||
}
|
||||
}
|
||||
|
||||
.empty {
|
||||
|
|
|
|||
|
|
@ -35,6 +35,7 @@ export const DocumentReferenceWrapper = ({ editor, node, updateAttributes }) =>
|
|||
<Select
|
||||
placeholder="请选择文档"
|
||||
onChange={(v) => selectDoc(v)}
|
||||
style={{ maxWidth: 180 }}
|
||||
{...(wikiId && documentId ? { value: `${wikiId}/${title}/${documentId}` } : {})}
|
||||
>
|
||||
{(tocs || []).map((toc) => (
|
||||
|
|
@ -69,7 +70,6 @@ export const DocumentReferenceWrapper = ({ editor, node, updateAttributes }) =>
|
|||
</div>
|
||||
)}
|
||||
</div>
|
||||
<NodeViewContent></NodeViewContent>
|
||||
</NodeViewWrapper>
|
||||
);
|
||||
};
|
||||
|
|
|
|||
|
|
@ -20,7 +20,6 @@
|
|||
flex: 1;
|
||||
position: relative;
|
||||
width: 100%;
|
||||
// height: 100%;
|
||||
border-radius: var(--border-radius);
|
||||
overflow: hidden;
|
||||
}
|
||||
|
|
|
|||
|
|
@ -2,7 +2,6 @@
|
|||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
margin: 10px 0;
|
||||
padding: 8px 16px;
|
||||
border: 1px solid var(--semi-color-border);
|
||||
border-radius: var(--border-radius);
|
||||
|
|
|
|||
|
|
@ -1,5 +1,6 @@
|
|||
.wrap {
|
||||
margin: 8px 0;
|
||||
display: inline-flex;
|
||||
justify-content: center;
|
||||
padding: 0 8px;
|
||||
transform: translateY(8px);
|
||||
}
|
||||
|
|
|
|||
|
|
@ -28,6 +28,7 @@ export const KatexWrapper = ({ editor, node, updateAttributes }) => {
|
|||
|
||||
return (
|
||||
<NodeViewWrapper as="span" className={cls(styles.wrap, 'render-wrapper')} contentEditable={false}>
|
||||
<NodeViewContent />
|
||||
{isEditable ? (
|
||||
<Popover
|
||||
showArrow
|
||||
|
|
@ -57,7 +58,7 @@ export const KatexWrapper = ({ editor, node, updateAttributes }) => {
|
|||
) : (
|
||||
content
|
||||
)}
|
||||
<NodeViewContent></NodeViewContent>
|
||||
<NodeViewContent />
|
||||
</NodeViewWrapper>
|
||||
);
|
||||
};
|
||||
|
|
|
|||
|
|
@ -1,7 +1,6 @@
|
|||
.wrap {
|
||||
position: relative;
|
||||
max-width: 100%;
|
||||
margin: 12px 0;
|
||||
line-height: 0;
|
||||
overflow: visible;
|
||||
outline: none;
|
||||
|
|
|
|||
|
|
@ -14,6 +14,7 @@ export const StatusWrapper = ({ editor, node, updateAttributes }) => {
|
|||
|
||||
return (
|
||||
<NodeViewWrapper as="span" className={cls(styles.wrap, 'status')}>
|
||||
<NodeViewContent />
|
||||
{isEditable ? (
|
||||
<Popover
|
||||
showArrow
|
||||
|
|
@ -44,7 +45,7 @@ export const StatusWrapper = ({ editor, node, updateAttributes }) => {
|
|||
) : (
|
||||
content
|
||||
)}
|
||||
{/* <NodeViewContent></NodeViewContent> */}
|
||||
<NodeViewContent />
|
||||
</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,13 @@
|
|||
@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 './selection.scss';
|
||||
@import './table.scss';
|
||||
@import './title.scss';
|
||||
|
|
@ -1,15 +1,13 @@
|
|||
.katex {
|
||||
font-size: 1em;
|
||||
text-rendering: auto;
|
||||
font: normal 1.21em;
|
||||
line-height: 1.2;
|
||||
text-indent: 0;
|
||||
}
|
||||
.katex * {
|
||||
-ms-high-contrast-adjust: none !important;
|
||||
border-color: currentColor;
|
||||
}
|
||||
.katex .katex-version:after {
|
||||
content: "0.15.2";
|
||||
content: '0.15.2';
|
||||
}
|
||||
.katex .katex-mathml {
|
||||
clip: rect(1px, 1px, 1px, 1px);
|
||||
|
|
@ -811,7 +809,7 @@
|
|||
}
|
||||
.katex .stretchy:after,
|
||||
.katex .stretchy:before {
|
||||
content: "";
|
||||
content: '';
|
||||
}
|
||||
.katex .hide-tail {
|
||||
overflow: hidden;
|
||||
|
|
@ -888,11 +886,11 @@
|
|||
padding: 0 0.03889em;
|
||||
}
|
||||
.katex .eqn-num:before {
|
||||
content: "(" counter(katexEqnNo) ")";
|
||||
content: '(' counter(katexEqnNo) ')';
|
||||
counter-increment: katexEqnNo;
|
||||
}
|
||||
.katex .mml-eqn-num:before {
|
||||
content: "(" counter(mmlEqnNo) ")";
|
||||
content: '(' counter(mmlEqnNo) ')';
|
||||
counter-increment: mmlEqnNo;
|
||||
}
|
||||
.katex .mtr-glue {
|
||||
|
|
@ -940,6 +938,3 @@
|
|||
padding-left: 2em;
|
||||
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%;
|
||||
} /*box-shadow:0 0 2px #000;*/
|
||||
.jsmind-inner {
|
||||
moz-user-select: -moz-none;
|
||||
-moz-user-select: none;
|
||||
-o-user-select: none;
|
||||
-khtml-user-select: none;
|
||||
|
|
@ -111,12 +110,6 @@ jmnodes.theme-primary jmnode.selected {
|
|||
background-color: #f1c40f;
|
||||
color: #fff;
|
||||
}
|
||||
jmnodes.theme-primary jmnode.root {
|
||||
}
|
||||
jmnodes.theme-primary jmexpander {
|
||||
}
|
||||
jmnodes.theme-primary jmexpander:hover {
|
||||
}
|
||||
|
||||
/* warning theme */
|
||||
jmnodes.theme-warning jmnode {
|
||||
|
|
@ -132,12 +125,6 @@ jmnodes.theme-warning jmnode.selected {
|
|||
background-color: #11f;
|
||||
color: #fff;
|
||||
}
|
||||
jmnodes.theme-warning jmnode.root {
|
||||
}
|
||||
jmnodes.theme-warning jmexpander {
|
||||
}
|
||||
jmnodes.theme-warning jmexpander:hover {
|
||||
}
|
||||
|
||||
/* danger theme */
|
||||
jmnodes.theme-danger jmnode {
|
||||
|
|
@ -153,12 +140,6 @@ jmnodes.theme-danger jmnode.selected {
|
|||
background-color: #11f;
|
||||
color: #fff;
|
||||
}
|
||||
jmnodes.theme-danger jmnode.root {
|
||||
}
|
||||
jmnodes.theme-danger jmexpander {
|
||||
}
|
||||
jmnodes.theme-danger jmexpander:hover {
|
||||
}
|
||||
|
||||
/* success theme */
|
||||
jmnodes.theme-success jmnode {
|
||||
|
|
@ -174,12 +155,6 @@ jmnodes.theme-success jmnode.selected {
|
|||
background-color: #11f;
|
||||
color: #fff;
|
||||
}
|
||||
jmnodes.theme-success jmnode.root {
|
||||
}
|
||||
jmnodes.theme-success jmexpander {
|
||||
}
|
||||
jmnodes.theme-success jmexpander:hover {
|
||||
}
|
||||
|
||||
/* info theme */
|
||||
jmnodes.theme-info jmnode {
|
||||
|
|
@ -195,12 +170,6 @@ jmnodes.theme-info jmnode.selected {
|
|||
background-color: #11f;
|
||||
color: #fff;
|
||||
}
|
||||
jmnodes.theme-info jmnode.root {
|
||||
}
|
||||
jmnodes.theme-info jmexpander {
|
||||
}
|
||||
jmnodes.theme-info jmexpander:hover {
|
||||
}
|
||||
|
||||
/* greensea theme */
|
||||
jmnodes.theme-greensea jmnode {
|
||||
|
|
@ -214,12 +183,6 @@ jmnodes.theme-greensea jmnode.selected {
|
|||
background-color: #11f;
|
||||
color: #fff;
|
||||
}
|
||||
jmnodes.theme-greensea jmnode.root {
|
||||
}
|
||||
jmnodes.theme-greensea jmexpander {
|
||||
}
|
||||
jmnodes.theme-greensea jmexpander:hover {
|
||||
}
|
||||
|
||||
/* nephrite theme */
|
||||
jmnodes.theme-nephrite jmnode {
|
||||
|
|
@ -233,12 +196,6 @@ jmnodes.theme-nephrite jmnode.selected {
|
|||
background-color: #11f;
|
||||
color: #fff;
|
||||
}
|
||||
jmnodes.theme-nephrite jmnode.root {
|
||||
}
|
||||
jmnodes.theme-nephrite jmexpander {
|
||||
}
|
||||
jmnodes.theme-nephrite jmexpander:hover {
|
||||
}
|
||||
|
||||
/* belizehole theme */
|
||||
jmnodes.theme-belizehole jmnode {
|
||||
|
|
@ -252,12 +209,6 @@ jmnodes.theme-belizehole jmnode.selected {
|
|||
background-color: #11f;
|
||||
color: #fff;
|
||||
}
|
||||
jmnodes.theme-belizehole jmnode.root {
|
||||
}
|
||||
jmnodes.theme-belizehole jmexpander {
|
||||
}
|
||||
jmnodes.theme-belizehole jmexpander:hover {
|
||||
}
|
||||
|
||||
/* wisteria theme */
|
||||
jmnodes.theme-wisteria jmnode {
|
||||
|
|
@ -271,12 +222,6 @@ jmnodes.theme-wisteria jmnode.selected {
|
|||
background-color: #11f;
|
||||
color: #fff;
|
||||
}
|
||||
jmnodes.theme-wisteria jmnode.root {
|
||||
}
|
||||
jmnodes.theme-wisteria jmexpander {
|
||||
}
|
||||
jmnodes.theme-wisteria jmexpander:hover {
|
||||
}
|
||||
|
||||
/* asphalt theme */
|
||||
jmnodes.theme-asphalt jmnode {
|
||||
|
|
@ -290,12 +235,6 @@ jmnodes.theme-asphalt jmnode.selected {
|
|||
background-color: #11f;
|
||||
color: #fff;
|
||||
}
|
||||
jmnodes.theme-asphalt jmnode.root {
|
||||
}
|
||||
jmnodes.theme-asphalt jmexpander {
|
||||
}
|
||||
jmnodes.theme-asphalt jmexpander:hover {
|
||||
}
|
||||
|
||||
/* orange theme */
|
||||
jmnodes.theme-orange jmnode {
|
||||
|
|
@ -309,12 +248,6 @@ jmnodes.theme-orange jmnode.selected {
|
|||
background-color: #11f;
|
||||
color: #fff;
|
||||
}
|
||||
jmnodes.theme-orange jmnode.root {
|
||||
}
|
||||
jmnodes.theme-orange jmexpander {
|
||||
}
|
||||
jmnodes.theme-orange jmexpander:hover {
|
||||
}
|
||||
|
||||
/* pumpkin theme */
|
||||
jmnodes.theme-pumpkin jmnode {
|
||||
|
|
@ -328,12 +261,6 @@ jmnodes.theme-pumpkin jmnode.selected {
|
|||
background-color: #11f;
|
||||
color: #fff;
|
||||
}
|
||||
jmnodes.theme-pumpkin jmnode.root {
|
||||
}
|
||||
jmnodes.theme-pumpkin jmexpander {
|
||||
}
|
||||
jmnodes.theme-pumpkin jmexpander:hover {
|
||||
}
|
||||
|
||||
/* pomegranate theme */
|
||||
jmnodes.theme-pomegranate jmnode {
|
||||
|
|
@ -347,12 +274,6 @@ jmnodes.theme-pomegranate jmnode.selected {
|
|||
background-color: #11f;
|
||||
color: #fff;
|
||||
}
|
||||
jmnodes.theme-pomegranate jmnode.root {
|
||||
}
|
||||
jmnodes.theme-pomegranate jmexpander {
|
||||
}
|
||||
jmnodes.theme-pomegranate jmexpander:hover {
|
||||
}
|
||||
|
||||
/* clouds theme */
|
||||
jmnodes.theme-clouds jmnode {
|
||||
|
|
@ -366,12 +287,6 @@ jmnodes.theme-clouds jmnode.selected {
|
|||
background-color: #11f;
|
||||
color: #fff;
|
||||
}
|
||||
jmnodes.theme-clouds jmnode.root {
|
||||
}
|
||||
jmnodes.theme-clouds jmexpander {
|
||||
}
|
||||
jmnodes.theme-clouds jmexpander:hover {
|
||||
}
|
||||
|
||||
/* asbestos theme */
|
||||
jmnodes.theme-asbestos jmnode {
|
||||
|
|
@ -385,9 +300,3 @@ jmnodes.theme-asbestos jmnode.selected {
|
|||
background-color: #11f;
|
||||
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,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,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 './var.scss';
|
||||
@import './extension.scss';
|
||||
@import './prosemirror.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;
|
||||
}
|
||||
@import './reset.scss';
|
||||
@import './editor/index.scss';
|
||||
|
||||
.container {
|
||||
margin-right: auto;
|
||||
|
|
|
|||
|
|
@ -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 {
|
||||
--border-radius: 4px;
|
||||
--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); // 自定义节点选中
|
||||
}
|
||||
|
|
|
|||
Loading…
Reference in New Issue