218 lines
3.2 KiB
CSS
218 lines
3.2 KiB
CSS
:root {
|
|
--ident: 18px;
|
|
/* --editor-font: "Avenir"; */
|
|
--editor-font: "Menlo";
|
|
--top-bar-bg: rgb(41, 41, 41);
|
|
}
|
|
|
|
html,
|
|
body {
|
|
height: 100%;
|
|
margin: 0;
|
|
padding: 0;
|
|
}
|
|
|
|
#top {
|
|
height: 40px;
|
|
background-color: var(--top-bar-bg);
|
|
position: absolute;
|
|
top: 0;
|
|
left: 0;
|
|
right: 0;
|
|
color: #eee;
|
|
}
|
|
|
|
#bottom {
|
|
position: absolute;
|
|
bottom: 0;
|
|
left: 0;
|
|
right: 0;
|
|
height: 25px;
|
|
background-color: var(--top-bar-bg);
|
|
color: #eee;
|
|
margin: 0;
|
|
padding: 5px;
|
|
font-family: var(--editor-font);
|
|
text-align: right;
|
|
}
|
|
|
|
#editor {
|
|
position: absolute;
|
|
top: 40px;
|
|
bottom: 40px;
|
|
left: 0;
|
|
right: 0;
|
|
overflow-y: hidden;
|
|
}
|
|
|
|
.cm-editor {
|
|
width: 100%;
|
|
height: 100%;
|
|
font-size: var(--ident);
|
|
}
|
|
|
|
@media only screen and (max-width: 800px) {
|
|
.cm-editor .cm-content {
|
|
margin: 0 10px !important;
|
|
}
|
|
}
|
|
|
|
.cm-editor .cm-content {
|
|
font-family: var(--editor-font);
|
|
margin: auto;
|
|
max-width: 800px;
|
|
}
|
|
|
|
.cm-editor .cm-selectionBackground {
|
|
background-color: #d7e1f6 !important;
|
|
}
|
|
|
|
.cm-editor .h1 {
|
|
font-size: 1.5em;
|
|
color: #fff;
|
|
font-weight: bold;
|
|
}
|
|
|
|
.cm-editor .cm-line.line-h1 {
|
|
display: block;
|
|
background-color: rgba(0, 15, 52, 0.6);
|
|
}
|
|
|
|
.cm-editor .h1.meta {
|
|
color: orange;
|
|
}
|
|
|
|
.cm-editor .h2 {
|
|
font-size: 1.2em;
|
|
color: #fff;
|
|
font-weight: bold;
|
|
}
|
|
|
|
.cm-editor .cm-line.line-h2 {
|
|
display: block;
|
|
background-color: rgba(0, 15, 52, 0.6);
|
|
}
|
|
|
|
.cm-editor .h2.meta {
|
|
color: orange;
|
|
}
|
|
|
|
/* .cm-editor .cm-line {
|
|
padding-left: 50px;
|
|
max-width: 800px;
|
|
} */
|
|
|
|
.cm-editor .line-code {
|
|
background-color: #efefef;
|
|
margin-left: 30px;
|
|
}
|
|
|
|
.cm-editor .line-fenced-code {
|
|
background-color: #efefef;
|
|
}
|
|
|
|
.cm-editor .meta {
|
|
color: #650007;
|
|
}
|
|
|
|
.cm-editor .line-blockquote {
|
|
background-color: #eee;
|
|
color: #676767;
|
|
text-indent: calc(-1 * (var(--ident) + 3px));
|
|
padding-left: var(--ident);
|
|
}
|
|
|
|
.cm-editor .emphasis {
|
|
font-style: italic;
|
|
}
|
|
|
|
.cm-editor .strong {
|
|
font-weight: 900;
|
|
}
|
|
|
|
.cm-editor .link:not(.meta, .url) {
|
|
color: #0330cb;
|
|
text-decoration: underline;
|
|
}
|
|
|
|
.cm-editor .link.url {
|
|
color: #7e7d7d;
|
|
}
|
|
|
|
.cm-editor .wiki-link-page {
|
|
color: #0330cb;
|
|
text-decoration: underline;
|
|
}
|
|
.cm-editor .wiki-link {
|
|
color: #808080;
|
|
}
|
|
|
|
.cm-editor .mention {
|
|
color: gray;
|
|
}
|
|
|
|
.cm-editor .tag {
|
|
color: #8d8d8d;
|
|
}
|
|
|
|
.cm-editor .line-li {
|
|
text-indent: calc(-1 * var(--ident) - 3px);
|
|
margin-left: var(--ident);
|
|
}
|
|
|
|
.cm-editor .task-marker {
|
|
background-color: #ddd;
|
|
}
|
|
|
|
.current-note {
|
|
font-family: var(--editor-font);
|
|
margin-left: 10px;
|
|
margin-top: 10px;
|
|
font-weight: bold;
|
|
}
|
|
|
|
.filter-container {
|
|
font-family: var(--editor-font);
|
|
display: block;
|
|
border: #333 1px solid;
|
|
z-index: 1000;
|
|
position: absolute;
|
|
left: 8px;
|
|
top: 8px;
|
|
right: 10px;
|
|
}
|
|
|
|
.filter-container .result-list {
|
|
max-height: 200px;
|
|
overflow-y: scroll;
|
|
background-color: white;
|
|
}
|
|
|
|
.filter-container input {
|
|
font-family: var(--editor-font);
|
|
width: 100%;
|
|
/* border: 1px #333 solid; */
|
|
background-color: var(--top-bar-bg);
|
|
color: #eee;
|
|
border: 0;
|
|
padding: 3px;
|
|
outline: 0;
|
|
font-weight: bold;
|
|
}
|
|
|
|
.filter-container .option,
|
|
.filter-container .selected-option {
|
|
padding: 3px 3px 3px 3px;
|
|
cursor: pointer;
|
|
}
|
|
|
|
.filter-container .selected-option {
|
|
background-color: #b1b1b1;
|
|
}
|
|
|
|
.filter-container .hint {
|
|
float: right;
|
|
margin-right: 10px;
|
|
color: #333;
|
|
}
|