Fixes #864
Zef Hemel
parent
4390f6ebc2
commit
75d3277885
|
|
@ -132,6 +132,8 @@ export function createEditorState(
|
||||||
{ selector: "ATXHeading2", class: "sb-line-h2" },
|
{ selector: "ATXHeading2", class: "sb-line-h2" },
|
||||||
{ selector: "ATXHeading3", class: "sb-line-h3" },
|
{ selector: "ATXHeading3", class: "sb-line-h3" },
|
||||||
{ selector: "ATXHeading4", class: "sb-line-h4" },
|
{ selector: "ATXHeading4", class: "sb-line-h4" },
|
||||||
|
{ selector: "ATXHeading5", class: "sb-line-h5" },
|
||||||
|
{ selector: "ATXHeading6", class: "sb-line-h6" },
|
||||||
{ selector: "ListItem", class: "sb-line-li", nesting: true },
|
{ selector: "ListItem", class: "sb-line-li", nesting: true },
|
||||||
{ selector: "Blockquote", class: "sb-line-blockquote" },
|
{ selector: "Blockquote", class: "sb-line-blockquote" },
|
||||||
{ selector: "Task", class: "sb-line-task" },
|
{ selector: "Task", class: "sb-line-task" },
|
||||||
|
|
|
||||||
|
|
@ -89,7 +89,8 @@
|
||||||
color: var(--action-button-hover-color);
|
color: var(--action-button-hover-color);
|
||||||
}
|
}
|
||||||
|
|
||||||
.sb-button, .sb-button-primary {
|
.sb-button,
|
||||||
|
.sb-button-primary {
|
||||||
--color: var(--button-color);
|
--color: var(--button-color);
|
||||||
--background-color: var(--button-background-color);
|
--background-color: var(--button-background-color);
|
||||||
--hover-background-color: var(--button-hover-background-color);
|
--hover-background-color: var(--button-hover-background-color);
|
||||||
|
|
@ -205,7 +206,9 @@
|
||||||
.sb-line-h1,
|
.sb-line-h1,
|
||||||
.sb-line-h2,
|
.sb-line-h2,
|
||||||
.sb-line-h3,
|
.sb-line-h3,
|
||||||
.sb-line-h4 {
|
.sb-line-h4,
|
||||||
|
.sb-line-h5,
|
||||||
|
.sb-line-h6 {
|
||||||
// background-color: rgba(0, 30, 77, 0.5);
|
// background-color: rgba(0, 30, 77, 0.5);
|
||||||
color: var(--editor-heading-color);
|
color: var(--editor-heading-color);
|
||||||
}
|
}
|
||||||
|
|
@ -213,218 +216,221 @@
|
||||||
.sb-line-h1 .sb-meta,
|
.sb-line-h1 .sb-meta,
|
||||||
.sb-line-h2 .sb-meta,
|
.sb-line-h2 .sb-meta,
|
||||||
.sb-line-h3 .sb-meta,
|
.sb-line-h3 .sb-meta,
|
||||||
.sb-line-h4 .sb-meta {
|
.sb-line-h4 .sb-meta,
|
||||||
color: var(--editor-heading-meta-color);
|
.sb-line-h5 .sb-meta,
|
||||||
|
.sb-line-h6 .sb-meta,
|
||||||
|
{
|
||||||
|
color: var(--editor-heading-meta-color);
|
||||||
|
}
|
||||||
|
|
||||||
|
.sb-hashtag,
|
||||||
|
.hashtag {
|
||||||
|
color: var(--editor-hashtag-color);
|
||||||
|
background-color: var(--editor-hashtag-background-color);
|
||||||
|
border: 1px solid var(--editor-hashtag-border-color);
|
||||||
|
cursor: pointer;
|
||||||
|
}
|
||||||
|
|
||||||
|
.sb-line-hr {
|
||||||
|
border-top: var(--editor-ruler-color) solid 1px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.sb-naked-url {
|
||||||
|
color: var(--editor-naked-url-color);
|
||||||
|
}
|
||||||
|
|
||||||
|
.sb-named-anchor {
|
||||||
|
color: var(--editor-named-anchor-color);
|
||||||
|
}
|
||||||
|
|
||||||
|
.sb-command-button {
|
||||||
|
font-family: var(--editor-font);
|
||||||
|
color: var(--editor-command-button-color);
|
||||||
|
background-color: var(--editor-command-button-background-color);
|
||||||
|
border: 1px solid var(--editor-command-button-border-color);
|
||||||
|
}
|
||||||
|
|
||||||
|
.sb-command-button:hover {
|
||||||
|
background-color: var(--editor-command-button-hover-background-color);
|
||||||
|
}
|
||||||
|
|
||||||
|
.sb-command-link {
|
||||||
|
&.sb-meta {
|
||||||
|
color: var(--editor-command-button-meta-color);
|
||||||
}
|
}
|
||||||
|
|
||||||
.sb-hashtag,
|
&.sb-command-link-name {
|
||||||
.hashtag {
|
background-color: var(--editor-command-button-color);
|
||||||
color: var(--editor-hashtag-color);
|
|
||||||
background-color: var(--editor-hashtag-background-color);
|
|
||||||
border: 1px solid var(--editor-hashtag-border-color);
|
|
||||||
cursor: pointer;
|
|
||||||
}
|
|
||||||
|
|
||||||
.sb-line-hr {
|
|
||||||
border-top: var(--editor-ruler-color) solid 1px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.sb-naked-url {
|
|
||||||
color: var(--editor-naked-url-color);
|
|
||||||
}
|
|
||||||
|
|
||||||
.sb-named-anchor {
|
|
||||||
color: var(--editor-named-anchor-color);
|
|
||||||
}
|
|
||||||
|
|
||||||
.sb-command-button {
|
|
||||||
font-family: var(--editor-font);
|
|
||||||
color: var(--editor-command-button-color);
|
|
||||||
background-color: var(--editor-command-button-background-color);
|
background-color: var(--editor-command-button-background-color);
|
||||||
border: 1px solid var(--editor-command-button-border-color);
|
border: 1px solid var(--editor-command-button-border-color);
|
||||||
}
|
}
|
||||||
|
|
||||||
.sb-command-button:hover {
|
&.sb-command-link-name:hover {
|
||||||
background-color: var(--editor-command-button-hover-background-color);
|
background-color: var(--editor-command-button-hover-background-color);
|
||||||
}
|
}
|
||||||
|
}
|
||||||
.sb-command-link {
|
|
||||||
&.sb-meta {
|
/* Color list items when the cursor is on it */
|
||||||
color: var(--editor-command-button-meta-color);
|
.sb-li-cursor .sb-meta {
|
||||||
}
|
color: var(--editor-line-meta-color);
|
||||||
|
}
|
||||||
&.sb-command-link-name {
|
|
||||||
background-color: var(--editor-command-button-color);
|
thead tr {
|
||||||
background-color: var(--editor-command-button-background-color);
|
background-color: var(--editor-table-head-background-color);
|
||||||
border: 1px solid var(--editor-command-button-border-color);
|
color: var(--editor-table-head-color);
|
||||||
}
|
}
|
||||||
|
|
||||||
&.sb-command-link-name:hover {
|
tbody tr:nth-of-type(even) {
|
||||||
background-color: var(--editor-command-button-hover-background-color);
|
background-color: var(--editor-table-even-background-color);
|
||||||
}
|
}
|
||||||
}
|
|
||||||
|
.sb-line-blockquote {
|
||||||
/* Color list items when the cursor is on it */
|
background-color: var(--editor-blockquote-background-color);
|
||||||
.sb-li-cursor .sb-meta {
|
color: var(--editor-blockquote-color);
|
||||||
color: var(--editor-line-meta-color);
|
border-left: 1px solid var(--editor-blockquote-border-color);
|
||||||
}
|
}
|
||||||
|
|
||||||
thead tr {
|
.sb-line-code {
|
||||||
background-color: var(--editor-table-head-background-color);
|
background-color: var(--editor-code-background-color);
|
||||||
color: var(--editor-table-head-color);
|
}
|
||||||
}
|
|
||||||
|
.sb-struct {
|
||||||
tbody tr:nth-of-type(even) {
|
color: var(--editor-struct-color);
|
||||||
background-color: var(--editor-table-even-background-color);
|
}
|
||||||
}
|
|
||||||
|
.sb-code {
|
||||||
.sb-line-blockquote {
|
background-color: var(--editor-code-background-color);
|
||||||
background-color: var(--editor-blockquote-background-color);
|
}
|
||||||
color: var(--editor-blockquote-color);
|
|
||||||
border-left: 1px solid var(--editor-blockquote-border-color);
|
.sb-line-fenced-code .sb-code {
|
||||||
}
|
color: var(--editor-code-color);
|
||||||
|
}
|
||||||
.sb-line-code {
|
|
||||||
background-color: var(--editor-code-background-color);
|
.sb-directive-mark {
|
||||||
}
|
color: var(--editor-directive-color);
|
||||||
|
font-weight: bold;
|
||||||
.sb-struct {
|
}
|
||||||
color: var(--editor-struct-color);
|
|
||||||
}
|
.sb-directive {
|
||||||
|
color: var(--editor-directive-color);
|
||||||
.sb-code {
|
font-weight: bold;
|
||||||
background-color: var(--editor-code-background-color);
|
}
|
||||||
}
|
|
||||||
|
.sb-highlight {
|
||||||
.sb-line-fenced-code .sb-code {
|
background-color: var(--editor-highlight-background-color);
|
||||||
color: var(--editor-code-color);
|
}
|
||||||
}
|
|
||||||
|
.sb-line-fenced-code {
|
||||||
.sb-directive-mark {
|
background-color: var(--editor-code-background-color);
|
||||||
color: var(--editor-directive-color);
|
}
|
||||||
font-weight: bold;
|
|
||||||
}
|
.sb-line-fenced-code .sb-comment {
|
||||||
|
color: var(--editor-code-comment-color);
|
||||||
.sb-directive {
|
}
|
||||||
color: var(--editor-directive-color);
|
|
||||||
font-weight: bold;
|
.sb-variableName {
|
||||||
}
|
color: var(--editor-code-variable-color);
|
||||||
|
}
|
||||||
.sb-highlight {
|
|
||||||
background-color: var(--editor-highlight-background-color);
|
.sb-typeName {
|
||||||
}
|
color: var(--editor-code-typename-color);
|
||||||
|
}
|
||||||
.sb-line-fenced-code {
|
|
||||||
background-color: var(--editor-code-background-color);
|
.sb-string,
|
||||||
}
|
.sb-string2 {
|
||||||
|
color: var(--editor-code-string-color);
|
||||||
.sb-line-fenced-code .sb-comment {
|
}
|
||||||
color: var(--editor-code-comment-color);
|
|
||||||
}
|
.sb-number {
|
||||||
|
color: var(--editor-code-number-color);
|
||||||
.sb-variableName {
|
}
|
||||||
color: var(--editor-code-variable-color);
|
|
||||||
}
|
.sb-operator {
|
||||||
|
color: var(--editor-code-operator-color);
|
||||||
.sb-typeName {
|
}
|
||||||
color: var(--editor-code-typename-color);
|
|
||||||
}
|
.sb-meta {
|
||||||
|
color: var(--editor-meta-color);
|
||||||
.sb-string,
|
}
|
||||||
.sb-string2 {
|
|
||||||
color: var(--editor-code-string-color);
|
// Admonitions
|
||||||
}
|
|
||||||
|
.sb-admonition {
|
||||||
.sb-number {
|
border-left-color: var(--admonition-color);
|
||||||
color: var(--editor-code-number-color);
|
}
|
||||||
}
|
|
||||||
|
.sb-admonition-title {
|
||||||
.sb-operator {
|
background-color: color-mix(in srgb, var(--admonition-color), transparent 90%)
|
||||||
color: var(--editor-code-operator-color);
|
}
|
||||||
}
|
|
||||||
|
.sb-admonition-icon {
|
||||||
.sb-meta {
|
background-color: var(--admonition-color);
|
||||||
color: var(--editor-meta-color);
|
}
|
||||||
}
|
|
||||||
|
// Frontmatter
|
||||||
// Admonitions
|
|
||||||
|
.sb-frontmatter {
|
||||||
.sb-admonition {
|
background-color: var(--editor-frontmatter-background-color);
|
||||||
border-left-color: var(--admonition-color);
|
color: var(--editor-frontmatter-color);
|
||||||
}
|
}
|
||||||
|
|
||||||
.sb-admonition-title {
|
.sb-frontmatter-marker {
|
||||||
background-color: color-mix(in srgb, var(--admonition-color), transparent 90%)
|
color: var(--editor-frontmatter-marker-color);
|
||||||
}
|
}
|
||||||
|
|
||||||
.sb-admonition-icon {
|
.sb-emphasis {
|
||||||
background-color: var(--admonition-color);
|
font-style: italic;
|
||||||
}
|
}
|
||||||
|
|
||||||
// Frontmatter
|
.sb-strong {
|
||||||
|
font-weight: 900;
|
||||||
.sb-frontmatter {
|
}
|
||||||
background-color: var(--editor-frontmatter-background-color);
|
|
||||||
color: var(--editor-frontmatter-color);
|
.sb-line-code-outside .sb-code-info {
|
||||||
}
|
color: var(--editor-code-info-color);
|
||||||
|
}
|
||||||
.sb-frontmatter-marker {
|
|
||||||
color: var(--editor-frontmatter-marker-color);
|
a,
|
||||||
}
|
.sb-link:not(.sb-meta, .sb-url) {
|
||||||
|
color: var(--editor-link-color);
|
||||||
.sb-emphasis {
|
}
|
||||||
font-style: italic;
|
|
||||||
}
|
.sb-link.sb-url {
|
||||||
|
color: var(--editor-link-meta-color);
|
||||||
.sb-strong {
|
}
|
||||||
font-weight: 900;
|
|
||||||
}
|
.sb-url:not(.sb-link) {
|
||||||
|
color: var(--editor-link-url-color);
|
||||||
.sb-line-code-outside .sb-code-info {
|
}
|
||||||
color: var(--editor-code-info-color);
|
|
||||||
}
|
.sb-atom {
|
||||||
|
color: var(--editor-code-atom-color);
|
||||||
a,
|
}
|
||||||
.sb-link:not(.sb-meta, .sb-url) {
|
|
||||||
color: var(--editor-link-color);
|
.sb-wiki-link-page {
|
||||||
}
|
color: var(--editor-wiki-link-page-color);
|
||||||
|
background-color: var(--editor-wiki-link-page-background-color);
|
||||||
.sb-link.sb-url {
|
}
|
||||||
color: var(--editor-link-meta-color);
|
|
||||||
}
|
a.sb-wiki-link-page-missing,
|
||||||
|
.sb-wiki-link-page-missing>.sb-wiki-link-page {
|
||||||
.sb-url:not(.sb-link) {
|
color: var(--editor-wiki-link-page-missing-color);
|
||||||
color: var(--editor-link-url-color);
|
background-color: var(--editor-wiki-link-page-background-color);
|
||||||
}
|
}
|
||||||
|
|
||||||
.sb-atom {
|
.sb-wiki-link {
|
||||||
color: var(--editor-code-atom-color);
|
color: var(--editor-wiki-link-page-color); // #8f96c2;
|
||||||
}
|
}
|
||||||
|
|
||||||
.sb-wiki-link-page {
|
.sb-task-mark {
|
||||||
color: var(--editor-wiki-link-page-color);
|
color: var(--editor-task-marker-color);
|
||||||
background-color: var(--editor-wiki-link-page-background-color);
|
}
|
||||||
}
|
|
||||||
|
.sb-task-state {
|
||||||
a.sb-wiki-link-page-missing,
|
color: var(--editor-task-state-color);
|
||||||
.sb-wiki-link-page-missing>.sb-wiki-link-page {
|
}
|
||||||
color: var(--editor-wiki-link-page-missing-color);
|
|
||||||
background-color: var(--editor-wiki-link-page-background-color);
|
.sb-line-comment {
|
||||||
}
|
background-color: var(--editor-code-comment-color); // rgba(255, 255, 0, 0.5);
|
||||||
|
}
|
||||||
.sb-wiki-link {
|
|
||||||
color: var(--editor-wiki-link-page-color); // #8f96c2;
|
|
||||||
}
|
|
||||||
|
|
||||||
.sb-task-mark {
|
|
||||||
color: var(--editor-task-marker-color);
|
|
||||||
}
|
|
||||||
|
|
||||||
.sb-task-state {
|
|
||||||
color: var(--editor-task-state-color);
|
|
||||||
}
|
|
||||||
|
|
||||||
.sb-line-comment {
|
|
||||||
background-color: var(--editor-code-comment-color); // rgba(255, 255, 0, 0.5);
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
|
|
@ -20,7 +20,9 @@
|
||||||
&.sb-line-h1,
|
&.sb-line-h1,
|
||||||
&.sb-line-h2,
|
&.sb-line-h2,
|
||||||
&.sb-line-h3,
|
&.sb-line-h3,
|
||||||
&.sb-line-h4 {
|
&.sb-line-h4,
|
||||||
|
&.sb-line-h5,
|
||||||
|
&.sb-line-h6 {
|
||||||
font-weight: bold;
|
font-weight: bold;
|
||||||
padding: 2px;
|
padding: 2px;
|
||||||
}
|
}
|
||||||
|
|
@ -42,7 +44,9 @@
|
||||||
font-size: 1.1em;
|
font-size: 1.1em;
|
||||||
}
|
}
|
||||||
|
|
||||||
.sb-line-h4 {
|
.sb-line-h4,
|
||||||
|
.sb-line-h5,
|
||||||
|
.sb-line-h6 {
|
||||||
font-size: 1em;
|
font-size: 1em;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
@ -234,6 +238,14 @@
|
||||||
text-indent: -5ch;
|
text-indent: -5ch;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.sb-header-inside.sb-line-h5 {
|
||||||
|
text-indent: -6ch;
|
||||||
|
}
|
||||||
|
|
||||||
|
.sb-header-inside.sb-line-h6 {
|
||||||
|
text-indent: -7ch;
|
||||||
|
}
|
||||||
|
|
||||||
.sb-checkbox>input[type="checkbox"] {
|
.sb-checkbox>input[type="checkbox"] {
|
||||||
width: 3ch;
|
width: 3ch;
|
||||||
}
|
}
|
||||||
|
|
|
||||||
Loading…
Reference in New Issue