842c2935e9
markdown is currently serialized to html at load time, which makes it near impossible to support arbitrary html in the markdown. This also means we're stringifying to html on every change. This commit moves to Remark's MDAST for local serialization, including parsing from MDAST to Slates's Raw AST. It brings much more control over the editing experience and full support for processing unescaped HTML.
126 lines
1.9 KiB
CSS
126 lines
1.9 KiB
CSS
@import "../../../../UI/theme";
|
|
|
|
.editorControlBar {
|
|
z-index: 1;
|
|
border: 2px solid transparent;
|
|
border-top: 0;
|
|
background-color: var(--controlBGColor);
|
|
}
|
|
|
|
.editorControlBarSticky {
|
|
border-color: var(--textFieldBorderColor);
|
|
}
|
|
|
|
.editor {
|
|
position: relative;
|
|
& h1, & h2, & h3 {
|
|
padding: 0;
|
|
color: #7c8382;
|
|
text-decoration: none;
|
|
border-bottom: none;
|
|
margin-bottom: 20px;
|
|
line-height: 1.45;
|
|
}
|
|
& h1 {
|
|
font-size: 2.5rem;
|
|
}
|
|
& h2 {
|
|
font-size: 2rem;
|
|
}
|
|
& h3 {
|
|
font-size: 1.8rem;
|
|
}
|
|
& p {
|
|
margin-top: 20px;
|
|
margin-bottom: 20px;
|
|
}
|
|
& hr {
|
|
border: 1px solid;
|
|
margin-bottom: 20px;
|
|
}
|
|
& li > p {
|
|
margin: 0;
|
|
}
|
|
& div[data-plugin] {
|
|
background: #fff;
|
|
border: 1px solid #aaa;
|
|
padding: 10px;
|
|
margin-bottom: 20px;
|
|
}
|
|
}
|
|
|
|
.dragging { }
|
|
|
|
.shim {
|
|
position: absolute;
|
|
top: 0;
|
|
right: 0;
|
|
bottom: 0;
|
|
left: 0;
|
|
display: none;
|
|
border: 2px dashed #aaa;
|
|
background: rgba(0,0,0,0.2);
|
|
}
|
|
|
|
.dragging .shim {
|
|
z-index: 1000;
|
|
display: block;
|
|
pointer-events: none;
|
|
}
|
|
|
|
.slateEditor {
|
|
position: relative;
|
|
overflow: hidden;
|
|
overflow-x: auto;
|
|
min-height: var(--richTextEditorMinHeight);
|
|
font-family: var(--fontFamily);
|
|
|
|
& ul,
|
|
& ol {
|
|
padding-left: 30px;
|
|
}
|
|
|
|
& pre {
|
|
white-space: pre-wrap;
|
|
}
|
|
|
|
& pre > code {
|
|
display: block;
|
|
width: 100%;
|
|
overflow-y: auto;
|
|
background-color: #000;
|
|
color: #ccc;
|
|
border-radius: var(--borderRadius);
|
|
padding: 10px;
|
|
}
|
|
|
|
& blockquote {
|
|
padding-left: 1em;
|
|
border-left: 3px solid #eee;
|
|
margin-left: 0; margin-right: 0;
|
|
}
|
|
|
|
& table {
|
|
border-collapse: collapse;
|
|
}
|
|
|
|
& td,
|
|
& th {
|
|
border: 2px solid black;
|
|
padding: 8px;
|
|
text-align: left;
|
|
}
|
|
}
|
|
|
|
.shortcode {
|
|
border: 2px solid black;
|
|
padding: 8px;
|
|
margin: 2px 0;
|
|
cursor: pointer;
|
|
}
|
|
|
|
.shortcodeSelected {
|
|
border-color: var(--primaryColor);
|
|
color: var(--primaryColor);
|
|
}
|