diff --git a/web/styles/theme.scss b/web/styles/theme.scss index f8863135..3f4db8e7 100644 --- a/web/styles/theme.scss +++ b/web/styles/theme.scss @@ -129,6 +129,17 @@ background-color: #d7e1f6 !important; } + + .cm-panels-bottom { + background-color: #e1e1e1; + border-top: #cacaca 1px solid; + .cm-vim-panel { + padding: 0 20px; + max-width: var(--editor-width); + margin: auto; + } + } + .cm-editor .cm-tooltip-autocomplete { .cm-completionDetail { font-style: normal; @@ -410,6 +421,7 @@ .cm-line.sb-directive-start, .cm-line.sb-directive-end { color: var(--directive-font-color); + background-color: rgb(233, 233, 233, 50%); padding: 3px; } @@ -540,16 +552,21 @@ html[data-theme="dark"] { #sb-root { - background-color: #000; + background-color: #111; + --directive-font-color: #adadad; color: #fff; } #sb-top { - background-color: rgb(96, 96, 96); + background-color: rgb(38, 38, 38); border-bottom: rgb(62, 62, 62) 1px solid; color: #fff; } + .sb-directive-start { + background-color: rgb(38, 38, 38) !important; + } + .sb-actions button { color: #adadad; } @@ -571,7 +588,9 @@ html[data-theme="dark"] { color: #c7c7c7; } + .sb-meta { + } .sb-modal-box, /* duplicating the class name to increase specificity */ @@ -586,6 +605,20 @@ html[data-theme="dark"] { #sb-editor { + .cm-selectionBackground { + background-color: #d7e1f630 !important; + } + + .cm-panels-bottom { + border-top: rgb(62, 62, 62) 1px solid; + background: rgb(38, 38, 38); + color: white !important; + .cm-vim-panel { + max-width: var(--editor-width); + margin: auto; + } + } + .sb-line-h1, .sb-line-h2, .sb-line-h3, @@ -597,7 +630,7 @@ html[data-theme="dark"] { background-color: rgb(41, 40, 35, 0.5); .sb-frontmatter-marker { - color: #000; + color: #fff; } } @@ -638,4 +671,4 @@ html[data-theme="dark"] { } } -} \ No newline at end of file +}