158 lines
3.0 KiB
SCSS
158 lines
3.0 KiB
SCSS
.cm-editor {
|
|
font-size: 18px;
|
|
padding: 0 20px;
|
|
--max-width: 800px;
|
|
|
|
.cm-content {
|
|
margin: auto;
|
|
max-width: var(--max-width);
|
|
}
|
|
|
|
.sb-inline-img {
|
|
max-width: calc(var(--max-width) * 0.9);
|
|
}
|
|
|
|
&.cm-focused {
|
|
outline: none !important;
|
|
}
|
|
|
|
// Weird hack to readjust iOS's safari font-size when contenteditable is disabled
|
|
.ios-safari-readonly {
|
|
font-size: 60%;
|
|
}
|
|
|
|
// Indentation of follow-up lines
|
|
@mixin lineOverflow($baseIndent) {
|
|
text-indent: -1 * ($baseIndent + 2ch);
|
|
padding-left: $baseIndent + 2ch;
|
|
|
|
&.sb-line-task {
|
|
text-indent: -1 * ($baseIndent + 6ch);
|
|
padding-left: $baseIndent + 6ch;
|
|
|
|
.cm-list-bullet::after {
|
|
left: ($baseIndent + 6ch);
|
|
}
|
|
}
|
|
|
|
&.sb-line-blockquote {
|
|
text-indent: -1 * ($baseIndent + 4ch);
|
|
padding-left: $baseIndent + 4ch;
|
|
}
|
|
|
|
.cm-list-bullet::after {
|
|
left: ($baseIndent + 2ch);
|
|
}
|
|
}
|
|
|
|
.sb-line-ul {
|
|
&.sb-line-li-1 {
|
|
@include lineOverflow(0);
|
|
}
|
|
|
|
&.sb-line-li-1.sb-line-li-2 {
|
|
@include lineOverflow(2);
|
|
}
|
|
|
|
&.sb-line-li-1.sb-line-li-2.sb-line-li-3 {
|
|
@include lineOverflow(4);
|
|
}
|
|
|
|
&.sb-line-li-1.sb-line-li-2.sb-line-li-3.sb-line-li-4 {
|
|
@include lineOverflow(6);
|
|
}
|
|
|
|
&.sb-line-li-1.sb-line-li-2.sb-line-li-3.sb-line-li-4.sb-line-li-5 {
|
|
@include lineOverflow(8);
|
|
}
|
|
}
|
|
|
|
.sb-line-ol {
|
|
&.sb-line-li-1 {
|
|
@include lineOverflow(1);
|
|
}
|
|
|
|
&.sb-line-li-1.sb-line-li-2 {
|
|
@include lineOverflow(2);
|
|
}
|
|
|
|
&.sb-line-li-1.sb-line-li-2.sb-line-li-3 {
|
|
@include lineOverflow(4);
|
|
}
|
|
|
|
&.sb-line-li-1.sb-line-li-2.sb-line-li-3.sb-line-li-4 {
|
|
@include lineOverflow(6);
|
|
}
|
|
|
|
&.sb-line-li-1.sb-line-li-2.sb-line-li-3.sb-line-li-4.sb-line-li-5 {
|
|
@include lineOverflow(8);
|
|
}
|
|
}
|
|
|
|
.sb-line-comment {
|
|
text-indent: -1 * 3ch;
|
|
padding-left: 3ch;
|
|
}
|
|
|
|
.cm-list-bullet {
|
|
position: relative;
|
|
visibility: hidden;
|
|
}
|
|
.cm-task-checked {
|
|
text-decoration: line-through !important;
|
|
}
|
|
|
|
.cm-list-bullet::after {
|
|
visibility: visible;
|
|
position: absolute;
|
|
// left: 2ch;
|
|
color: rgb(150, 150, 150);
|
|
content: "\2022"; /* U+2022 BULLET */
|
|
}
|
|
|
|
.sb-directive-start .sb-comment, .sb-directive-end .sb-comment {
|
|
position: relative;
|
|
left: -12px;
|
|
}
|
|
|
|
.sb-directive-start::before {
|
|
content: "#";
|
|
color: gray;
|
|
border: 1px solid gray;
|
|
border-radius: 5px;
|
|
font-size: 62%;
|
|
padding: 2px;
|
|
position: relative;
|
|
left: -20px;
|
|
}
|
|
|
|
// .sb-directive-end {
|
|
// border-top: 1px dotted #6c6c6c;
|
|
// }
|
|
|
|
.sb-directive-outside {
|
|
opacity: 0.4;
|
|
}
|
|
|
|
.sb-blockquote-outside > .sb-meta {
|
|
display: none;
|
|
}
|
|
|
|
.sb-blockquote-outside {
|
|
text-indent: -1ch;
|
|
border-left: 1px solid rgb(74, 74, 74);
|
|
min-height: 1em;
|
|
}
|
|
|
|
.sb-directive-end::before {
|
|
content: "/";
|
|
border-radius: 5px;
|
|
color: gray;
|
|
border: 1px solid gray;
|
|
font-size: 62%;
|
|
padding: 2px;
|
|
position: relative;
|
|
left: -20px;
|
|
}
|
|
}
|