lapis-dark.css

/* 
 *   Typora Theme - Lapis - Dark Version / Author - YiNN 
 *   https://github.com/YiNNx/typora-theme-lapis
 */

@import "lapis.css";

:root {
    --text-color: #e4e4e4e3;
    /* Text */
    --primary-color: #8393ad;
    /* Primary Color */
    --bg-color: #1e222a;
    --side-bar-bg-color: #181c24;
    --panel-bg-color: #40464f;
    /* Background */

    --code-color: #abbad4;
    /* Inline Code & Code Block */
    --marker-color: #7d8a9f;
    /* List Marker */
    --highlight-color: #ffffb5c2;
    /* Highlight */
    --header-span-color: #47556d;
    /* h2 Span Color */
    --block-bg-color: #080e1d;
    /* Code Block Background */
    --quote-block-bg-color: #2a2f3b;
    /* Quote Block Background */
    --img-shadow-color: var(--block-bg-color);

    /* Overwrite of Typora Base Color */
    --md-char-color: #7d8a9f7d;
    --heading-char-color: var(--text-color);
    --select-text-bg-color: #dae3ea2e;
    --search-select-bg-color: #346895;
    --item-hover-bg-color: var(--block-bg-color);
    --window-border: 1px solid var(--bg-color);
    --control-text-hover-color: var(--text-color);
    --rawblock-edit-panel-bd: var(--block-bg-color);
}

/*
 * Background Color
 */

content {
    background: var(--bg-color);
}

/*
 * Header
 */
#write h2 {
    color: var(--text-color);
}

/*
 * Mark
 */

mark {
    background: var(--highlight-color);
    border-radius: 1px;
    color: var(--bg-color);
}

/*
 * Quote
 */

#write blockquote,.md-alert {
    background: var(--quote-block-bg-color);
}

.md-alert-text-note {
    color: #83a4c4;
}

.md-alert.md-alert-note {
    background-color: var(--quote-block-bg-color);
    border-left-color: #83a4c4;
}

.md-alert-text-tip {
    color: #81b3a7;
}

.md-alert.md-alert-tip {
    background-color: var(--quote-block-bg-color);
    border-left-color: #81b3a7;
}

.md-alert-text-important {
    color: #968abd;
}

.md-alert.md-alert-important {
    background-color: var(--quote-block-bg-color);
    border-left-color: #968abd;
}

.md-alert-text-caution {
    color: #b8797e;
}

.md-alert.md-alert-caution {
    background-color: var(--quote-block-bg-color);
    border-left-color: #b8797e;
}

.md-alert-text-warning {
    color: #b3a17c;
}

.md-alert.md-alert-warning {
    background-color: var(--quote-block-bg-color);
    border-left-color: #b3a17c;
}



/*
 * Code
 */

#write code {
    color: var(--code-color);
}

#write h2 code {
    background-color: var(--header-span-color);
    color: var(--text-color);
}

/*
 * Table
 */

#write table.md-table tr th,
#write table.md-table tr td {
    border: 1px solid var(--header-span-color);
}

#write table.md-table tr th {
    color: var(--text-color);
}

table.md-table.md-table td {
    background-color: var(--bg-color);
}

#write table.md-table tr td:hover,
#write table.md-table tr th:hover {
    background-color: var(--side-bar-bg-color);
}

/*
 * megamenu
 */

#recent-file-panel {
    color: var(--text-color);
}
#recent-file-panel-action-btn {
    background-color: var(--bg-color);
}
#recent-file-panel-action-btn-container {
    color: rgba(146, 146, 146, 0.56);
}
#recent-file-panel tbody tr:nth-child(2n-1) {
    background-color: var(--panel-bg-color);
}
.megamenu-menu-panel .btn {
    border: 1px solid #9292928f;
}

/*
 * Task List
 */

.task-list-item input:checked::before,
.task-list-item input:before {
    background-color: var(--bg-color);
}

/*
 * Sidebar
 */

#typora-sidebar {
    color: var(--text-color);
    background-color: var(--side-bar-bg-color);
}

/* .typora-sidebar-resizer-bar {
     border-left: 2px solid var(--block-bg-color);
   } */

/*
 * Horizontal Line
 */

#write hr {
    border-top: 1px solid var(--header-span-color);
}

/*
 * Comment
 */

.md-comment {
    color: var(--header-span-color);
}

/*
 * Front Matter
 */

pre.md-meta-block {
    background: var(--quote-block-bg-color);
}

/* 
 * Code Block - Style
 */

.cm-s-inner.CodeMirror {
    color: var(--code-color);
    background-color: var(--block-bg-color);
}

.CodeMirror-gutters {
    border-right: 1px solid #a2b6d452;
}

.CodeMirror-linenumber {
    color: var(--primary-color);
}

/* 
 * Code Block - Color Scheme
 */

.cm-s-inner .cm-keyword {
    color: #66cfe9 !important;
}

.cm-s-inner .cm-operator {
    color: #e7fc4a !important;
}

.cm-s-inner .cm-variable,
.cm-s-inner .cm-builtin,
.cm-s-inner .cm-header,
.cm-s-inner .cm-tag,
.cm-s-inner .cm-property,
.cm-s-inner .cm-quote {
    color: #c2eaff !important;
}

.cm-s-inner .cm-variable-2 {
    color: #8eb0b0 !important;
}

.cm-s-inner .cm-variable-3,
.cm-s-inner .cm-type,
.cm-s-inner .cm-atom {
    color: #debbfb !important;
}

.cm-s-inner .cm-number {
    color: #b0f6ae !important;
}

.cm-s-inner .cm-def,
.cm-s-inner .cm-qualifier {
    color: #f9fbfd !important;
}

.cm-s-inner .cm-string {
    color: #acd9a4 !important;
}

.cm-s-inner .cm-string-2 {
    color: #89acc5 !important;
}

.cm-s-inner .cm-comment {
    color: rgb(168, 168, 168) !important;
}

.cm-s-inner .cm-meta {
    color: #a0b4f6 !important;
}

.cm-s-inner .cm-attribute {
    color: #baacc3 !important;
}

.cm-s-inner .cm-error {
    color: rgba(255, 255, 255, 1) !important;
    background-color: #ffcff140 !important;
}

.cm-s-inner .CodeMirror-matchingbracket {
    text-decoration: underline;
    color: white !important;
}

.CodeMirror div.CodeMirror-cursor {
    border-left: 1px solid var(--primary-color);
    z-index: 3;
}

.cm-s-inner div.CodeMirror-selected {
    background: rgba(167, 178, 189, 0.2) !important;
}

.cm-s-inner.CodeMirror-focused div.CodeMirror-selected {
    background: rgba(167, 178, 189, 0.2) !important;
}

.cm-s-inner .CodeMirror-selected,
.cm-s-inner .CodeMirror-selectedtext {
    background-color: rgba(167, 178, 189, 0.0) !important;
}

.cm-s-inner .CodeMirror-line::-moz-selection,
.cm-s-inner .CodeMirror-line>span::-moz-selection,
.cm-s-inner .CodeMirror-line>span>span::-moz-selection {
    background-color: rgba(167, 178, 189, 0.2);
}

.cm-s-inner .CodeMirror-line::selection,
.cm-s-inner .CodeMirror-line>span::selection,
.cm-s-inner .CodeMirror-line>span>span::selection {
    background-color: rgba(167, 178, 189, 0.2);
}

/*
 * Source Code Mode
 */

cm-s-inner .cm-link,
.cm-s-inner.cm-link {
    color: #42a5f5;
}

.cm-s-typora-default .cm-link {
    color: #42a5f5;
    text-decoration: underline;
}

/* 
 * Preferences
 */

 .typora-sourceview-on #toggle-sourceview-btn {
    background: #41444b;
}

.typora-sourceview-on #toggle-sourceview-btn {
    background: #41444b;
    padding-left: 10px;
    margin-left: -2px;
}

.nav-group-item.active {
    background: #2A2E35 !important;
    color: var(--bg-color);
}

.nav-group-item {
    background: var(--bg-color) !important;
}

.md-def-name:before {
    color: var(--md-char-color);
}

::-webkit-scrollbar-thumb {
    background: var(--block-bg-color);
}

.export-detail, .export-item.active, .export-items-list-control {
    background: #2A2E35 !important;
}