/* Special Font */ body { font-family: "Gloria Hallelujah", "Dank Mono",'Inter', -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif, "NotoColorEmoji", "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Microsoft YaHei Light", sans-serif; } .cm-s-obsidian { font-family: "Dank Mono",'Inter', -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif, "NotoColorEmoji","Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Microsoft YaHei Light", sans-serif; font-size: 16px; } .markdown-preview-view code { font-family: "Dank Mono",'Inter', -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif, "NotoColorEmoji","Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Microsoft YaHei Light", sans-serif; font-size: 16px; } .workspace { font-family: "Dank Mono",'Inter', -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif, "NotoColorEmoji","Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Microsoft YaHei Light", sans-serif; font-size: 16px; } /* Scrollbar */ ::-webkit-scrollbar { background-color: transparent; } /* App scrollbar weirdness */ .app-container { height: 99%; } /**/ /* Empty pane */ .workspace-leaf-content[data-type="empty"] { background-color: var(--background-primary); } /**/ /**/ /* Editor Section */ /**/ /* Line size */ .cm-s-obsidian pre.HyperMD-header { line-height: 1!important; } /* Selection */ .theme-light { --text-selection: rgba(112, 93, 207, 0.5); } .theme-dark { --text-selection: rgba(112, 93, 207, 0.5); } ::selection { background-color: #705dcf!important; color: white!important; } /* Title */ /* Current main pane */ .view-header-title { color: #705dcf; text-align: center; } .workspace-leaf.mod-active .view-header { text-align: center; } /* Other pane */ .workspace-leaf-header-title-container { text-align: center; } /* Headers */ span.cm-formatting.cm-formatting-header.cm-formatting-header-1.cm-header.cm-header-1 { color: #705dcf; } span.cm-formatting.cm-formatting-header.cm-formatting-header-2.cm-header.cm-header-2 { color: #705dcf; } span.cm-formatting.cm-formatting-header.cm-formatting-header-3.cm-header.cm-header-3 { color: #705dcf; } span.cm-formatting.cm-formatting-header.cm-formatting-header-4.cm-header.cm-header-4 { color: #705dcf; } span.cm-formatting.cm-formatting-header.cm-formatting-header-5.cm-header.cm-header-5 { color: #705dcf; } span.cm-formatting.cm-formatting-header.cm-formatting-header-6.cm-header.cm-header-6 { color: #705dcf; } /* Header folder icon */ .CodeMirror-foldgutter-open, .CodeMirror-foldgutter-folded { color: #3e3471; } .CodeMirror-foldgutter-open, .CodeMirror-foldgutter-folded { color: #705dcf; } /* Cursor */ .cm-fat-cursor .CodeMirror-cursor { background: #3e3471; } .cm-animate-fat-cursor { background-color: #3e3471; } /* Selection in popup ([[]] autocomplete)*/ .suggestion-item.is-selected { background-color: #3e3471; color: white; } .theme-light .suggestion-shortcut { color: var(--text-normal); } /* Inner and Outer links */ .cm-url { color: lightblue!important; } .markdown-highlighting .internal-link .cl-underlined-text { color: var(--text-accent)!important; } .markdown-highlighting .link .cl-underlined-text { color: lightblue!important; } /* Blockquote */ .preview blockquote { background-color: var(--background-modifier-border); border: 1px solid var(--text-muted); } /* Highlights and Bold */ strong { font-size: larger; color: var(--text-normal); } mark { background-color: darkgoldenrod; } .markdown-highlighting .tag { color: var(--text-accent)!important; } /* Tables */ .markdown-preview-view th { background-color: #3e3471; color: white } .cm-s-obsidian pre.HyperMD-table-row span.cm-hmd-table-sep { color: unset; } .cm-s-obsidian pre.HyperMD-table-row-1 > span { color: unset; } /* Status bar */ .theme-dark .status-bar-item { color: white; } .theme-light .status-bar-item { color: black; } /**/ /* Preview section */ /**/ /* Centered preview */ .markdown-preview-view { position: relative; height: 100%; /* border-right-width: 7rem; border-left-width: 7rem; border-style: solid; border-color: #262140; */ } .markdown-embed-title { color: #705dcf; } .markdown-preview-view .markdown-embed { background-color: var(--background-primary-alt); margin-top: 0.5rem; margin-bottom: 0.5rem; } .markdown-preview-view .internal-link { color: #705dcf; } .markdown-preview-view a { color: lightblue; } /**/ /* Side panel section */ /**/ /* Plugin Title and Description */ .plugin-name { color: var(--text-normal); } .plugin-description { color: var(--text-normal) } /* Files title and Buttons */ .nav-file-title-content, .nav-folder-title-content { color: var(--text-normal); } .nav-action-button { color: var(--text-normal); } /* File explorer navigation selection */ .nav-file.is-active > .nav-file-title, .nav-file.is-active > .nav-folder-title, .nav-file.is-active > .nav-folder-collapse-indicator, .nav-folder.is-active > .nav-file-title, .nav-folder.is-active > .nav-folder-title, .nav-folder.is-active > .nav-folder-collapse-indicator { background-color: #3e3471; color: white; } body:not(.is-grabbing) .nav-file-title:hover, body:not(.is-grabbing) .nav-folder-title:hover { background-color: #3e3471; color: white; } .nav-file-title-content, .nav-folder-title-content { color:unset; } .nav-folder.mod-root > .nav-file-title:hover, .nav-folder.mod-root > .nav-folder-title:hover { color: var(--text-normal); } body:not(.is-grabbing) .nav-file-title:hover .nav-folder-collapse-indicator, body:not(.is-grabbing) .nav-folder-title:hover .nav-folder-collapse-indicator { background-color: #3e3471; color: white; } .nav-file-title, .nav-folder-title, .nav-folder-collapse-indicator { color: var(--text-normal); } /* File explorer alternate background .nav-file:nth-child(even) { background-color: var(--background-primary); } .nav-folder:nth-child(even) { background-color: var(--background-primary); } .nav-file:nth-child(odd) { background-color: #262140; } .nav-folder:nth-child(odd) { background-color: #262140; } /**/ /* File explorer menu*/ .menu-item:hover { background-color: #3e3471; color: white; } /* Backlinks Color and Text */ .search-result-file-matched-text { background-color: #3e3471; color: white; } .search-result-file-title { color: #705dcf; } .search-result-file-matches { color: var(--text-normal); } .search-result-file-title:hover { background-color: #3e3471; color: white; } .search-result-file-match:hover { background-color: #3e3471; color: white; } /* Folder arrow */ .nav-folder.is-collapsed .nav-folder-collapse-indicator { color: #705dcf; } .nav-folder-collapse-indicator { color: #705dcf; } /* Tag Selection */ .tag-pane-tag:hover { background-color: #3e3471; color: white; } .theme-light .tag-pane-tag-count { color: var(--text-normal) } /* Title */ .side-dock-title { color: #705dcf; } /* Ribon */ .side-dock-ribbon { background-color: #3e3471!important; color: var(--text-muted) } .side-dock-ribbon-tab, .side-dock-ribbon-action { color: white; } .theme-dark .side-dock-ribbon-tab.is-active { color: white; } .theme-dark .side-dock-ribbon-tab.is-before-active { color: white; } .theme-light .side-dock-ribbon-tab.is-active { color: var(--text-normal); } .theme-light .side-dock-ribbon-tab.is-before-active { color: white; } .side-dock-ribbon-tab-inner { color: unset; } .side-dock-ribbon-before.is-before-active .side-dock-ribbon-tab-inner, .side-dock-ribbon-after.is-after-active .side-dock-ribbon-tab-inner, .side-dock-ribbon-tab.is-before-active .side-dock-ribbon-tab-inner, .side-dock-ribbon-tab.is-after-active .side-dock-ribbon-tab-inner { background-color: #3e3471; } .side-dock-ribbon-tab, .side-dock-ribbon-before, .side-dock-ribbon-after, .side-dock-ribbon-tab-inner { transition: none; } /**/ /* Settings panel Section */ /**/ .vertical-tab-nav-item.is-active { background-color: #3e3471; color:white; } .horizontal-tab-nav-item:hover, .vertical-tab-nav-item:hover { background-color: #3e3471; color: white; } .vertical-tab-nav-item.is-active { background-color: #3e3471; } .vertical-tab-nav-item.is-active { border-left-color: #3e3471; } /* Centered editor with side border .markdown-source-view { position: relative; height: 100%; border-right-width: 7rem; border-left-width: 7rem; border-style: solid; border-color: #262140; } /* Graph View */ .graph-view.color-fill { color: #705dcf; } .graph-view.color-circle { color: #3e3471; } .graph-view.color-line { color: #3e3471; } .graph-view.color-text { color: var(--text-normal); } .graph-view.color-fill-highlight { color: #3e3471; } .graph-view.color-line-highlight { color: #705dcf; } /**/ /* Focus Mode .cm-s-obsidian, .cm-s-obsidian div:not(.CodeMirror-activeline) > .CodeMirror-line span.cm-link, .cm-s-obsidian div:not(.CodeMirror-activeline) > .CodeMirror-line span.cm-hmd-internal-link, .cm-s-obsidian div:not(.CodeMirror-activeline) > .CodeMirror-line span.cm-url, .cm-s-obsidian div:not(.CodeMirror-activeline) > .CodeMirror-line span.cm-hmd-escape-backslash, .cm-s-obsidian div:not(.CodeMirror-activeline) > .CodeMirror-line span.cm-inline-code, .cm-s-obsidian div:not(.CodeMirror-activeline) > pre.CodeMirror-line.HyperMD-codeblock, .cm-s-obsidian div:not(.CodeMirror-activeline) > .CodeMirror-line span.cm-hashtag, .cm-s-obsidian div:not(.CodeMirror-activeline) > .CodeMirror-line span.cm-builtin, .cm-s-obsidian div:not(.CodeMirror-activeline) > .CodeMirror-line span.cm-hr, .cm-s-obsidian div:not(.CodeMirror-activeline) > .CodeMirror-line span.cm-footref, .cm-s-obsidian div:not(.CodeMirror-activeline) > .CodeMirror-line pre.HyperMD-footnote span.cm-hmd-footnote, .cm-s-obsidian div:not(.CodeMirror-activeline) > .CodeMirror-line span.cm-formatting-highlight, .cm-s-obsidian div:not(.CodeMirror-activeline) > .CodeMirror-line span.cm-highlight, .cm-s-obsidian div:not(.CodeMirror-activeline) > .CodeMirror-line span.cm-formatting-list, .cm-s-obsidian div:not(.CodeMirror-activeline) > .CodeMirror-line span.cm-formatting-task, .cm-s-obsidian div:not(.CodeMirror-activeline) > .CodeMirror-line span.cm-quote, .cm-s-obsidian div:not(.CodeMirror-activeline) > .CodeMirror-line span.cm-math, .cm-s-obsidian div:not(.CodeMirror-activeline) > .CodeMirror-line span.hmd-fold-math-placeholder { color: var(--text-faint); } .cm-s-obsidian div:not(.CodeMirror-activeline) > .CodeMirror-line span.cm-formatting-highlight, .cm-s-obsidian div:not(.CodeMirror-activeline) > .CodeMirror-line span.cm-highlight { background-color: transparent; } .CodeMirror-activeline { color: var(--text-normal); } /**/ /* Andy Matuschak mode! V2! for 0.7.0! (so... 2.7?) */ /* Now with my own tweaks .mod-root.workspace-split.mod-vertical { overflow-x:auto; --header-width: 36px; } .mod-root.workspace-split.mod-vertical > div { min-width: calc(700px + var(--header-width)); box-shadow: 0px 0px 20px 20px rgba(0,0,0,0.25); position:sticky; left:0; } .mod-root.workspace-split.mod-vertical > div:nth-child(10n-8) { left: calc(var(--header-width) * 0); min-width: calc(100% - var(--size)); --size: calc(var(--header-width) * 1); } .mod-root.workspace-split.mod-vertical > div:nth-child(10n-7) { left: calc(var(--header-width) * 1); min-width: calc(100% - var(--size)); --size: calc(var(--header-width) * 1); } .mod-root.workspace-split.mod-vertical > div:nth-child(10n-6) { left: calc(var(--header-width) * 2); min-width: calc(100% - var(--size)); --size: calc(var(--header-width) * 2); } .mod-root.workspace-split.mod-vertical > div:nth-child(10n-5) { left: calc(var(--header-width) * 3); min-width: calc(100% - var(--size)); --size: calc(var(--header-width) * 3); } .mod-root.workspace-split.mod-vertical > div:nth-child(10n-4) { left: calc(var(--header-width) * 4); min-width: calc(100% - var(--size)); --size: calc(var(--header-width) * 4); } .mod-root.workspace-split.mod-vertical > div:nth-child(10n-3) { left: calc(var(--header-width) * 5); min-width: calc(100% - var(--size)); --size: calc(var(--header-width) * 5); } .mod-root.workspace-split.mod-vertical > div:nth-child(10n-2) { left: calc(var(--header-width) * 6); min-width: calc(100% - var(--size)); --size: calc(var(--header-width) * 6); } .mod-root.workspace-split.mod-vertical > div:nth-child(10n-1) { left: calc(var(--header-width) * 7); min-width: calc(100% - var(--size)); --size: calc(var(--header-width) * 7); } .mod-root.workspace-split.mod-vertical > div:nth-child(10n+0) { left: calc(var(--header-width) * 8); min-width: calc(100% - var(--size)); --size: calc(var(--header-width) * 8); } .mod-root.workspace-split.mod-vertical > div:nth-child(10n+1) { left: calc(var(--header-width) * 9); min-width: calc(100% - var(--size)); --size: calc(var(--header-width) * 9); } .workspace-leaf-content { padding-left: var(--header-width); position: relative; } .view-header { writing-mode: vertical-lr; border-right: 1px solid var(--background-secondary-alt); border-left: 2px solid var(--background-secondary-alt); border-top: none; border-bottom: none; height: auto; width: var(--header-width); position: absolute; left:0; top:0; bottom:0; } .workspace-leaf.mod-active .view-header { border-right: 2px solid var(--interactive-accent); border-bottom: none; } .view-header-title-container { height: unset; padding-left: unset; padding-top: 5px; } .view-header-title-container:after { width: 100%; height: 30px; top:unset; bottom: 0; background: linear-gradient(to bottom, transparent, var(--background-secondary)); } .workspace-leaf.mod-active .view-header-title-container:after { background: linear-gradient(to bottom, transparent, var(--background-primary-alt)); } .view-header-icon, .view-actions { padding: 10px 5px; } .view-action { margin: 8px 0; } .view-content { height: 100%; } .workspace-fake-target-overlay { background-color: var(--background-primary); } /**/