generated from DNDs/dnd-template
2791 lines
66 KiB
CSS
2791 lines
66 KiB
CSS
|
/* Ono-Sendai for Obsidian - v20220601 v0.9.01 by _ph / www.hpx1.com */
|
||
|
|
/* consider leaving credits or putting a thank you if you use this theme as a starter kit */
|
||
|
|
/* free to use, share and modify - PRs and updates are welcome */
|
||
|
|
|
||
|
|
:root {
|
||
|
|
--default-font: Cairo;
|
||
|
|
}
|
||
|
|
|
||
|
|
body {
|
||
|
|
font-size: 13px;
|
||
|
|
font-family: Cairo, Roboto, Inter, Segoe ui, sans-serif;
|
||
|
|
--font-monospace: Fira Code, Source Code Pro, monospace;
|
||
|
|
line-height: 1.65em;
|
||
|
|
}
|
||
|
|
.CodeMirror pre.CodeMirror-line {
|
||
|
|
font-size: 13px;
|
||
|
|
font-family: Fira Code, Source Code Pro, monospace;
|
||
|
|
}
|
||
|
|
|
||
|
|
/* ======= DARK ==============*/
|
||
|
|
|
||
|
|
.theme-dark {
|
||
|
|
--background-primary: #17191a; /* standard: #17191a pro mode: #000000 */
|
||
|
|
--background-modifier-border: rgb(0, 0, 0);
|
||
|
|
--background-modifier-cover: rgba(5, 20, 1, 0.842);
|
||
|
|
--background-primary-alt: rgb(5, 5, 5);
|
||
|
|
--background-secondary: #0f5172; /*#0f5172;*/
|
||
|
|
--background-secondary-alt: rgb(0, 0, 0);
|
||
|
|
--background-accent: rgb(38, 72, 95);
|
||
|
|
--background-modifier-box-shadow: rgba(0, 0, 0, 0.5);
|
||
|
|
--text-accent: #28b0ff;
|
||
|
|
--text-accent2: #00ff37;
|
||
|
|
--text-accent-hover: #77d47c;
|
||
|
|
--text-normal: #dcddde;
|
||
|
|
--text-muted:#898b85;
|
||
|
|
--text-faint: #666;
|
||
|
|
--text-error: #ff0000;
|
||
|
|
--text-error-hover: #990000;
|
||
|
|
--text-matched: #bbce16;
|
||
|
|
--text-on-accent: #dcddde;
|
||
|
|
--text-selection: rgba(6, 66, 113, 0.99);
|
||
|
|
--text-highlight-bg: #1c2b0b;
|
||
|
|
--interactive-normal: #2a2a2a;
|
||
|
|
--interactive-hover: #286c91;
|
||
|
|
--interactive-accent: rgb(32, 171, 233);
|
||
|
|
--interactive-accent-rgb: 32, 171, 233;
|
||
|
|
--interactive-accent-hover: #1da3d6;
|
||
|
|
--scrollbar-active-thumb-bg: rgba(255, 255, 255, 0.2);
|
||
|
|
--scrollbar-bg: rgba(255, 255, 255, 0);
|
||
|
|
--scrollbar-thumb-bg: rgb(20, 50, 70);
|
||
|
|
--scrollbar-active-thumb-bg:#ff3392;
|
||
|
|
--accent-strong: #e60953;
|
||
|
|
--accent-mild: #d39f2f;
|
||
|
|
--bw: #ffffff;
|
||
|
|
--border: #0c496d;
|
||
|
|
--border-accent: #a00f3f;
|
||
|
|
--border-muted: #272727;
|
||
|
|
--tagsbgcolor: rgb(10, 54, 134);
|
||
|
|
--tagspanetag:rgb(238, 54, 238);
|
||
|
|
--graph-circle:#ff2882;
|
||
|
|
--graph-line: #0c496d;
|
||
|
|
--graph-bg: black;
|
||
|
|
--graph-text:#ff3333;
|
||
|
|
--graphtag: #0b9ba5;
|
||
|
|
--graph-attach: #4cf15a;
|
||
|
|
--graph-menutext:#898b85;
|
||
|
|
--checkboxbg: -23deg;
|
||
|
|
}
|
||
|
|
|
||
|
|
/* ======= LIGHT==============*/
|
||
|
|
|
||
|
|
.theme-light {
|
||
|
|
--background-primary: #d1cabf;
|
||
|
|
--background-primary-alt: #e0ded2;
|
||
|
|
--background-secondary: #eeb157;
|
||
|
|
--background-secondary-alt: #beb6aa;
|
||
|
|
--background-accent: rgb(136, 43, 90);
|
||
|
|
--background-modifier-border: rgb(75, 110, 139);
|
||
|
|
--background-modifier-cover: rgba(163, 221, 158, 0.842);
|
||
|
|
--background-modifier-form-field: rgb(189, 216, 218);
|
||
|
|
--background-modifier-form-field-highlighted: rgb(182, 213, 221);
|
||
|
|
--background-modifier-box-shadow: rgba(0, 0, 0, 0.1);
|
||
|
|
--background-modifier-success: #a4e7c3;
|
||
|
|
--background-modifier-error: #e68787;
|
||
|
|
--background-modifier-error-rgb: 230, 135, 135;
|
||
|
|
--background-modifier-error-hover: #ff9494;
|
||
|
|
--background-modifier-cover: rgba(0, 0, 0, 0.8);
|
||
|
|
--text-accent: #914a29;
|
||
|
|
--text-accent2: #4d5c8b;
|
||
|
|
--text-accent-hover: #cc0202;
|
||
|
|
--text-normal: #2e3338;
|
||
|
|
--text-muted: #694f3a;
|
||
|
|
--text-faint: #9c735c;
|
||
|
|
--text-error: #0d6f8d;
|
||
|
|
--text-error-hover: #cb2c2;
|
||
|
|
--text-highlight-bg: rgba(232, 255, 27, 0.76);
|
||
|
|
--text-selection: rgba(247, 220, 162, 0.99);
|
||
|
|
--text-on-accent: #f2f2f2;
|
||
|
|
--text-matched: #b90303;
|
||
|
|
--interactive-normal: #f2f3f5;
|
||
|
|
--interactive-hover: #e9e9e9;
|
||
|
|
--interactive-accent: rgb(226, 72, 34);
|
||
|
|
--interactive-accent-rgb: 226, 72, 34;
|
||
|
|
--interactive-accent-hover: #f3bf14;
|
||
|
|
--scrollbar-active-thumb-bg: rgb(247, 214, 29);
|
||
|
|
--scrollbar-bg: rgba(0, 0, 0, 0);
|
||
|
|
--scrollbar-thumb-bg: #914a29;
|
||
|
|
--scrollbar-active-thumb-bg:#ff3333;
|
||
|
|
--accent-strong: #1a7ca3;
|
||
|
|
--accent-mild: #912771;
|
||
|
|
--bw: #000000;
|
||
|
|
--border: #664424;
|
||
|
|
--border-accent: #a00f3f;
|
||
|
|
--border-muted: #272727;
|
||
|
|
--tagsbgcolor: rgb(141, 81, 128);
|
||
|
|
--tagspanetag:rgb(53, 53, 53);
|
||
|
|
--graph-circle:#0cd2ec;
|
||
|
|
--graph-line: #11683f;
|
||
|
|
--graph-bg: black;
|
||
|
|
--graph-text:#ff3333;
|
||
|
|
--graphtag: #d8fa41;
|
||
|
|
--graph-menutext:#898b85;
|
||
|
|
--graph-attach: #77f581;
|
||
|
|
--checkboxbg: 183deg;
|
||
|
|
}
|
||
|
|
|
||
|
|
/* code block remove shadow */
|
||
|
|
|
||
|
|
.theme-light code[class*="language-"],
|
||
|
|
.theme-light pre[class*="language-"] {
|
||
|
|
background: var(--background-primary-alt);
|
||
|
|
text-shadow: 0px 0px white;
|
||
|
|
font-family: var(--font-monospace);
|
||
|
|
text-align: left;
|
||
|
|
white-space: pre;
|
||
|
|
word-spacing: normal;
|
||
|
|
word-break: normal;
|
||
|
|
word-wrap: normal;
|
||
|
|
line-height: 1.5;
|
||
|
|
}
|
||
|
|
|
||
|
|
/* code block:remove white bg on operators */
|
||
|
|
|
||
|
|
.theme-light .token.operator {
|
||
|
|
background: hsla(0, 0%, 100%, 0);
|
||
|
|
}
|
||
|
|
/* =========== code ========*/
|
||
|
|
.markdown-preview-view code {
|
||
|
|
color: var(--accent-strong);
|
||
|
|
font-family: var(--font-monospace);
|
||
|
|
background-color: var(--background-primary-alt);
|
||
|
|
border-radius: 4px;
|
||
|
|
padding: 2px 4px;
|
||
|
|
font-size: 0.85em;
|
||
|
|
font-weight: 500;
|
||
|
|
}
|
||
|
|
|
||
|
|
.markdown-preview-view pre {
|
||
|
|
padding: 6px 10px;
|
||
|
|
background-color: var(--background-primary-alt);
|
||
|
|
border-radius: 4px;
|
||
|
|
white-space: pre-wrap;
|
||
|
|
}
|
||
|
|
|
||
|
|
/* ====== Tag Pills ======== */
|
||
|
|
|
||
|
|
.tag:not(.token) {
|
||
|
|
background-color: var(--tagsbgcolor);
|
||
|
|
border: none;
|
||
|
|
color: white !important;
|
||
|
|
font-size: 11px;
|
||
|
|
line-height: 1.6em;
|
||
|
|
padding: 0px 7px 1px 7px;
|
||
|
|
text-align: center;
|
||
|
|
text-decoration: none !important;
|
||
|
|
display: inline-block;
|
||
|
|
margin: 0px 4px;
|
||
|
|
cursor: pointer;
|
||
|
|
border-radius: 14px;
|
||
|
|
}
|
||
|
|
|
||
|
|
.tag:hover {
|
||
|
|
color: white;
|
||
|
|
background-color: var(--text-accent-hover);
|
||
|
|
}
|
||
|
|
|
||
|
|
.tag[href^="#obsidian"] {
|
||
|
|
background-color: #4d3ca6;
|
||
|
|
}
|
||
|
|
|
||
|
|
.tag[href^="#important"] {
|
||
|
|
background-color: red;
|
||
|
|
}
|
||
|
|
|
||
|
|
.tag[href^="#complete"] {
|
||
|
|
background-color: green;
|
||
|
|
}
|
||
|
|
|
||
|
|
.tag[href^="#inprogress"] {
|
||
|
|
background-color: orange;
|
||
|
|
}
|
||
|
|
|
||
|
|
/*=== trace indentation lines by death_au === */
|
||
|
|
|
||
|
|
.cm-hmd-list-indent .cm-tab,
|
||
|
|
ul ul {
|
||
|
|
position: relative;
|
||
|
|
}
|
||
|
|
|
||
|
|
.cm-hmd-list-indent .cm-tab::before,
|
||
|
|
ul ul::before {
|
||
|
|
content: "";
|
||
|
|
border-left: 1px solid var(--border);
|
||
|
|
/*rgba(20,122,255,0.3);
|
||
|
|
*/
|
||
|
|
position: absolute;
|
||
|
|
}
|
||
|
|
|
||
|
|
.cm-hmd-list-indent .cm-tab::before {
|
||
|
|
left: 0;
|
||
|
|
top: -5px;
|
||
|
|
bottom: -4px;
|
||
|
|
}
|
||
|
|
|
||
|
|
ul ul::before {
|
||
|
|
left: -15px;
|
||
|
|
top: 0;
|
||
|
|
bottom: 0;
|
||
|
|
}
|
||
|
|
|
||
|
|
/*==============TRANSCLUSION TWEAKS=============*/
|
||
|
|
.internal-embed {
|
||
|
|
display: block;
|
||
|
|
max-height: 100%;
|
||
|
|
max-width: 100%;
|
||
|
|
position:relative;
|
||
|
|
}
|
||
|
|
.markdown-embed-title {
|
||
|
|
font-family: sans-serif;
|
||
|
|
font-size: 10px;
|
||
|
|
color: var(--text-accent);
|
||
|
|
line-height: 10px;
|
||
|
|
width: 100%;
|
||
|
|
text-align: left;
|
||
|
|
font-weight: 100;
|
||
|
|
margin: 0px -0px -40px 0px;
|
||
|
|
}
|
||
|
|
|
||
|
|
.markdown-preview-view .markdown-embed {
|
||
|
|
background-color: var(--background-primary);
|
||
|
|
border-radius: 0px;
|
||
|
|
border: 0;
|
||
|
|
border-left: 1px solid var(--background-accent);
|
||
|
|
margin: 0px -10px;
|
||
|
|
}
|
||
|
|
|
||
|
|
.markdown-embed {
|
||
|
|
display: block;
|
||
|
|
top: 0px;
|
||
|
|
}
|
||
|
|
|
||
|
|
.markdown-embed > .markdown-embed-content {
|
||
|
|
display: inline;
|
||
|
|
max-height: 100%;
|
||
|
|
max-width: 100%;
|
||
|
|
margin: 0px 0px -15px -10px;
|
||
|
|
padding: 20px 0px 0px 0px;
|
||
|
|
overflow: hidden;
|
||
|
|
}
|
||
|
|
|
||
|
|
.markdown-embed-content > * {
|
||
|
|
display: block;
|
||
|
|
max-height: 100%;
|
||
|
|
max-width: 100%;
|
||
|
|
margin: 10px 0px 5px 0px;
|
||
|
|
}
|
||
|
|
|
||
|
|
.markdown-embed-link {
|
||
|
|
top: -3px;
|
||
|
|
left: -24px;
|
||
|
|
color: var(--text-error);
|
||
|
|
cursor: pointer;
|
||
|
|
position: absolute;
|
||
|
|
}
|
||
|
|
.markdown-embed-link::before{
|
||
|
|
content : ">>";
|
||
|
|
color: var(--text-error);
|
||
|
|
font-size: 12px;
|
||
|
|
font-weight: 700;
|
||
|
|
}
|
||
|
|
|
||
|
|
div.markdown-embed-link > .link {
|
||
|
|
width: 0px;
|
||
|
|
height: 0px;
|
||
|
|
}
|
||
|
|
|
||
|
|
.file-embed-link {
|
||
|
|
top: 10px;
|
||
|
|
left: -10px;
|
||
|
|
color: var(--accent-strong);
|
||
|
|
cursor: pointer;
|
||
|
|
position: relative;
|
||
|
|
}
|
||
|
|
|
||
|
|
.internal-embed,
|
||
|
|
.internal-embed > .markdown-embed > .markdown-embed-content {
|
||
|
|
display: block;
|
||
|
|
max-height: 100%;
|
||
|
|
max-width: 100%;
|
||
|
|
left: 0px;
|
||
|
|
}
|
||
|
|
|
||
|
|
.markdown-preview-view .file-embed {
|
||
|
|
background-color: var(--background-primary);
|
||
|
|
border-radius: 4px;
|
||
|
|
border: 2px solid var(--text-selection);
|
||
|
|
padding: 5px 20px 5px 20px;
|
||
|
|
margin: 10px 0px 10px 0px;
|
||
|
|
}
|
||
|
|
|
||
|
|
.file-embed-title {
|
||
|
|
font-size: 12px;
|
||
|
|
height: 40px;
|
||
|
|
text-overflow: ellipsis;
|
||
|
|
overflow: hidden;
|
||
|
|
white-space: nowrap;
|
||
|
|
}
|
||
|
|
|
||
|
|
/* ==============headings=================*/
|
||
|
|
h1 {
|
||
|
|
font-size: 30px;
|
||
|
|
line-height: 40px;
|
||
|
|
padding-bottom: 10px;
|
||
|
|
border-bottom: 1px solid var(--text-accent);
|
||
|
|
color: var(--text-normal);
|
||
|
|
font-family: Cairo, Roboto, Inter, Mod, 'Segoe UI', Consolas, Inter, sans-serif ;
|
||
|
|
}
|
||
|
|
h2 {
|
||
|
|
font-size: 26px;
|
||
|
|
line-height: 36px;
|
||
|
|
padding-top: 0px;
|
||
|
|
padding-bottom: 6px;
|
||
|
|
padding-left: 0px;
|
||
|
|
border-bottom: 1px solid var(--text-faint);
|
||
|
|
color: var(--text-accent2);
|
||
|
|
font-family: Cairo, Roboto, Inter, 'Segoe UI', Consolas, Hector, kayak sans, sans-serif ;
|
||
|
|
}
|
||
|
|
h3 {
|
||
|
|
font-size: 20px;
|
||
|
|
line-height: 22px;
|
||
|
|
padding-left:10px;
|
||
|
|
}
|
||
|
|
h4 {
|
||
|
|
font-size: 18px;
|
||
|
|
padding-left:30px;
|
||
|
|
}
|
||
|
|
h5 {
|
||
|
|
font-size: 15px;
|
||
|
|
padding-left:50px;
|
||
|
|
}
|
||
|
|
h6 {
|
||
|
|
font-size: 15px;
|
||
|
|
color: var(--text-muted);
|
||
|
|
padding-left:70px;
|
||
|
|
}
|
||
|
|
/* ==============hr=============*/
|
||
|
|
hr {
|
||
|
|
height: 1px;
|
||
|
|
border: none;
|
||
|
|
background-color: var(--text-accent);
|
||
|
|
}
|
||
|
|
|
||
|
|
p {padding-left: 10px;}
|
||
|
|
/* ==============checkboxes=============*/
|
||
|
|
.markdown-embed-content .task-list-item-checkbox,
|
||
|
|
.markdown-preview-view .task-list-item-checkbox {
|
||
|
|
filter: hue-rotate(var(--checkboxbg));
|
||
|
|
}
|
||
|
|
|
||
|
|
/* ===========================*/
|
||
|
|
/* ====== GUI tweaks =========*/
|
||
|
|
/* ===========================*/
|
||
|
|
|
||
|
|
|
||
|
|
.workspace-tabs .workspace-leaf {
|
||
|
|
background-color: var(--background-secondary-alt);
|
||
|
|
}
|
||
|
|
|
||
|
|
/* ===== snappier animations ==== */
|
||
|
|
|
||
|
|
.workspace-tab-header,
|
||
|
|
.workspace-tab-header-inner,
|
||
|
|
.workspace-tab-container-before,
|
||
|
|
.workspace-tab-container-after {
|
||
|
|
transition: background-color 100ms linear;
|
||
|
|
}
|
||
|
|
|
||
|
|
/* ===== icons / ribbons =========*/
|
||
|
|
/* smaller icons*/
|
||
|
|
.workspace-ribbon-collapse-btn svg,
|
||
|
|
.side-dock-actions svg,
|
||
|
|
.side-dock-settings svg,
|
||
|
|
.view-action svg {
|
||
|
|
width: 12px;
|
||
|
|
height: 12px;
|
||
|
|
}
|
||
|
|
|
||
|
|
.view-action {
|
||
|
|
width: 15px;
|
||
|
|
height: 21px;
|
||
|
|
color: var(--text-muted);
|
||
|
|
stroke-width: 3px;
|
||
|
|
top: -2px;
|
||
|
|
}
|
||
|
|
|
||
|
|
.view-header-icon > svg {
|
||
|
|
width: 12px;
|
||
|
|
height: 12px;
|
||
|
|
}
|
||
|
|
|
||
|
|
.workspace-tab-header-inner-icon > svg {
|
||
|
|
width: 12px;
|
||
|
|
height: 12px;
|
||
|
|
}
|
||
|
|
.workspace-ribbon-collapse-btn {
|
||
|
|
margin-top: 0px;
|
||
|
|
padding: 0px 4px 64px 8px;
|
||
|
|
cursor: pointer;
|
||
|
|
color: var(--text-faint);
|
||
|
|
transform: none;
|
||
|
|
transition: transform 100ms ease-in-out;
|
||
|
|
color: var(--text-accent);
|
||
|
|
}
|
||
|
|
|
||
|
|
.workspace-ribbon.is-collapsed {
|
||
|
|
background-color: var(--background-secondary-alt);
|
||
|
|
}
|
||
|
|
|
||
|
|
.workspace-ribbon.mod-left.is-collapsed {
|
||
|
|
border-right-color: var(--background-secondary-alt);
|
||
|
|
}
|
||
|
|
|
||
|
|
.workspace-ribbon.mod-right.is-collapsed {
|
||
|
|
border-left-color: var(--background-secondary-alt);
|
||
|
|
}
|
||
|
|
/* ======= remove right ribbon collapsed =====*/
|
||
|
|
.workspace-ribbon.mod-right {
|
||
|
|
right: 0;
|
||
|
|
height: 22px;
|
||
|
|
width: 34px;
|
||
|
|
}
|
||
|
|
.workspace-split.mod-right-split {
|
||
|
|
margin-right: 0px;
|
||
|
|
}
|
||
|
|
.workspace-ribbon.side-dock-ribbon.mod-right .workspace-ribbon-collapse-btn {
|
||
|
|
margin-top: 0px;
|
||
|
|
padding: 0px 1px 1px 10px;
|
||
|
|
cursor: pointer;
|
||
|
|
color: var(--text-faint);
|
||
|
|
transform: none;
|
||
|
|
transition: transform 100ms ease-in-out;
|
||
|
|
color: var(--text-accent);
|
||
|
|
}
|
||
|
|
/* ===== thinner & snappier horiz resize handle =========*/
|
||
|
|
|
||
|
|
.workspace-split.mod-horizontal > * > .workspace-leaf-resize-handle {
|
||
|
|
bottom: 0;
|
||
|
|
left: 0;
|
||
|
|
height: 3px;
|
||
|
|
width: 100%;
|
||
|
|
cursor: row-resize;
|
||
|
|
}
|
||
|
|
|
||
|
|
.workspace-leaf-resize-handle {
|
||
|
|
transition: background-color 80ms linear;
|
||
|
|
}
|
||
|
|
|
||
|
|
/* ==== align top tab header with header title ==== */
|
||
|
|
|
||
|
|
/* ========== left sidebar ==============*/
|
||
|
|
.workspace-ribbon.mod-left {
|
||
|
|
left: 0px;
|
||
|
|
top: 0px;
|
||
|
|
border-right: 1px solid var(--background-primary);
|
||
|
|
}
|
||
|
|
.side-dock-ribbon-tab:hover, .side-dock-ribbon-action:hover {
|
||
|
|
color: var(--text-error);
|
||
|
|
}
|
||
|
|
|
||
|
|
.side-dock-ribbon-action {
|
||
|
|
padding: 8px 0;
|
||
|
|
margin: 0px 0px 6px 0;
|
||
|
|
}
|
||
|
|
|
||
|
|
.nav-action-button > svg {
|
||
|
|
width: 14px;
|
||
|
|
height: 14px;
|
||
|
|
}
|
||
|
|
|
||
|
|
.nav-action-button {
|
||
|
|
color: var(--text-accent2);
|
||
|
|
padding: 0px 30px 0 10px;
|
||
|
|
cursor: pointer;
|
||
|
|
}
|
||
|
|
div[aria-label="New note"],
|
||
|
|
div[aria-label="New folder"],
|
||
|
|
div[aria-label^="Star/unstar current"] {
|
||
|
|
color: var(--accent-strong);
|
||
|
|
}
|
||
|
|
.nav-files-container {
|
||
|
|
flex-grow: 1;
|
||
|
|
overflow-y: auto;
|
||
|
|
padding-left: 7px; /* reduce to 0 for more space */
|
||
|
|
padding-bottom: 10px;
|
||
|
|
margin-bottom: 10px;
|
||
|
|
}
|
||
|
|
.workspace-tab-header.is-active {
|
||
|
|
background-color: var(--background-secondary-alt);
|
||
|
|
color: var(--text-normal);
|
||
|
|
}
|
||
|
|
|
||
|
|
div[aria-label="Insert template"] {
|
||
|
|
color:red;
|
||
|
|
}
|
||
|
|
div[aria-label="Settings"] {
|
||
|
|
color:var(--text-accent2);
|
||
|
|
}
|
||
|
|
|
||
|
|
/* ----file xplor : smaller & bold vault title--- */
|
||
|
|
|
||
|
|
.nav-folder.mod-root > .nav-folder-title {
|
||
|
|
padding-left: 0px;
|
||
|
|
font-size: 12px;
|
||
|
|
font-weight: bolder;
|
||
|
|
top: 0px;
|
||
|
|
cursor: default;
|
||
|
|
position: sticky;
|
||
|
|
z-index: 900;
|
||
|
|
background-color: var(--background-secondary-alt);
|
||
|
|
}
|
||
|
|
|
||
|
|
/* ---tab header -----------*/
|
||
|
|
workspace-tab-header {
|
||
|
|
color: var(--text-normal);
|
||
|
|
text-align: center;
|
||
|
|
stroke-width: 2px;
|
||
|
|
}
|
||
|
|
.workspace-tab-header:hover {
|
||
|
|
color: var(--text-error);
|
||
|
|
text-align: center;
|
||
|
|
stroke-width: 2px;
|
||
|
|
}
|
||
|
|
|
||
|
|
/*----file explorer smaller fonts & line height----*/
|
||
|
|
|
||
|
|
.nav-file-title,
|
||
|
|
.nav-folder-title {
|
||
|
|
font-size: 12px;
|
||
|
|
line-height: 14px;
|
||
|
|
cursor: pointer;
|
||
|
|
position: relative;
|
||
|
|
border-width: 1px;
|
||
|
|
border-style: solid;
|
||
|
|
border-color: transparent;
|
||
|
|
border-image: initial;
|
||
|
|
border-radius: 0px;
|
||
|
|
padding: 1px 14px 0px 20px;
|
||
|
|
color: var(--text-accent)
|
||
|
|
}
|
||
|
|
|
||
|
|
.nav-file-tag {
|
||
|
|
background-color: var(--background-secondary-alt);
|
||
|
|
top: -1px;
|
||
|
|
color: var(--accent-mild);
|
||
|
|
}
|
||
|
|
|
||
|
|
/*-------search pane---------*/
|
||
|
|
input[type="text"],
|
||
|
|
input[type="email"],
|
||
|
|
input[type="password"],
|
||
|
|
input[type="number"] {
|
||
|
|
font-family: Barlow, Cairo, 'Inter', sans-serif;
|
||
|
|
padding: 5px 8px;
|
||
|
|
font-size: 14px;
|
||
|
|
border-radius: 4px;
|
||
|
|
}
|
||
|
|
.search-input {
|
||
|
|
display: block;
|
||
|
|
margin: 0 auto 10px auto;
|
||
|
|
width: calc(100% - 20px);
|
||
|
|
}
|
||
|
|
|
||
|
|
/*---- nav arrows adjust location ----*/
|
||
|
|
|
||
|
|
.nav-folder-collapse-indicator {
|
||
|
|
position: absolute;
|
||
|
|
left: 8px;
|
||
|
|
top: 4px;
|
||
|
|
transition: transform 20ms linear 0s;
|
||
|
|
}
|
||
|
|
.nav-folder-collapse-indicator::after {
|
||
|
|
position: absolute;
|
||
|
|
content : "\\";
|
||
|
|
left: 8px;
|
||
|
|
top: -1px;
|
||
|
|
color: var(--text-accent2);
|
||
|
|
font-size: 15px;
|
||
|
|
transition: transform 10ms linear 0s;
|
||
|
|
}
|
||
|
|
.nav-folder-collapse-indicator svg {
|
||
|
|
display: none;
|
||
|
|
color:var(--accent-strong);
|
||
|
|
height:7px;
|
||
|
|
width:87x;
|
||
|
|
}
|
||
|
|
.nav-folder.is-collapsed .nav-folder-collapse-indicator {
|
||
|
|
transform: translateX(0px) translateY(0px) rotate(0deg);
|
||
|
|
}
|
||
|
|
|
||
|
|
/* ====== scrollbars:no rounded corners =========*/
|
||
|
|
|
||
|
|
::-webkit-scrollbar-thumb {
|
||
|
|
-webkit-border-radius: 0px;
|
||
|
|
background-color: var(--scrollbar-thumb-bg);
|
||
|
|
}
|
||
|
|
|
||
|
|
::-webkit-scrollbar-thumb:active {
|
||
|
|
-webkit-border-radius: 0px;
|
||
|
|
background-color: var(--scrollbar-active-thumb-bg);
|
||
|
|
}
|
||
|
|
|
||
|
|
::-webkit-scrollbar {
|
||
|
|
background-color: var(--scrollbar-bg);
|
||
|
|
width: 10px;
|
||
|
|
height: 10px;
|
||
|
|
-webkit-border-radius: 100px;
|
||
|
|
}
|
||
|
|
/*==== tabs =====*/
|
||
|
|
|
||
|
|
.workspace-tab-container-before,
|
||
|
|
.workspace-tab-container-after {
|
||
|
|
width: 0px;
|
||
|
|
height: 100%;
|
||
|
|
}
|
||
|
|
|
||
|
|
/* ===== view header color ==========*/
|
||
|
|
|
||
|
|
.workspace-split.mod-root > .workspace-leaf:first-of-type:last-of-type .view-header {
|
||
|
|
background-color: var(--background-secondary-alt);
|
||
|
|
border-bottom: 2.5px solid var(--text-accent);
|
||
|
|
}
|
||
|
|
.workspace-split.mod-root > .workspace-leaf:last-of-type .workspace-leaf-content {
|
||
|
|
border-top-right-radius: 0px;
|
||
|
|
}
|
||
|
|
|
||
|
|
.workspace-split.mod-root > .workspace-leaf:first-of-type .workspace-leaf-content {
|
||
|
|
border-top-left-radius: 0px;
|
||
|
|
}
|
||
|
|
|
||
|
|
.workspace-split.mod-root > .workspace-leaf:first-of-type:last-of-type.mod-active .view-header-title-container:after {
|
||
|
|
background: none;
|
||
|
|
}
|
||
|
|
|
||
|
|
/*==== separators =====*/
|
||
|
|
.workspace-split.mod-root .workspace-split.mod-vertical .workspace-leaf-content {
|
||
|
|
padding-right: 0px;
|
||
|
|
}
|
||
|
|
.workspace-leaf-resize-handle {
|
||
|
|
background-color: var(--background-secondary-alt);
|
||
|
|
}
|
||
|
|
|
||
|
|
.workspace-leaf-resize-handle:hover {
|
||
|
|
background-color: rgba(var(--interactive-accent-rgb), 0.8);
|
||
|
|
}
|
||
|
|
.workspace-split.mod-vertical > * > .workspace-leaf-resize-handle, .workspace-split.mod-left-split > .workspace-leaf-resize-handle, .workspace-split.mod-right-split > .workspace-leaf-resize-handle {
|
||
|
|
right: 0;
|
||
|
|
top: 0px;
|
||
|
|
width: 4px;
|
||
|
|
height: 100%;
|
||
|
|
cursor: col-resize;
|
||
|
|
}
|
||
|
|
/* a bit more padding on the left side */
|
||
|
|
|
||
|
|
.markdown-preview-view {
|
||
|
|
padding: 20px 30px 30px 45px;
|
||
|
|
}
|
||
|
|
|
||
|
|
.side-dock-collapsible-section-header {
|
||
|
|
font-size: 12px;
|
||
|
|
padding: 4px 14px 0 22px;
|
||
|
|
user-select: none;
|
||
|
|
cursor: pointer;
|
||
|
|
position: relative;
|
||
|
|
}
|
||
|
|
.side-dock-collapsible-section-header.is-collapsed .side-dock-collapsible-section-header-indicator {
|
||
|
|
transform: translateX(-9px) translateY(7px) rotate(-90deg);
|
||
|
|
}
|
||
|
|
.side-dock-collapsible-section-header-indicator {
|
||
|
|
color: var(--accent-strong);
|
||
|
|
position: absolute;
|
||
|
|
left: 9px;
|
||
|
|
top: 3px;
|
||
|
|
width: 9px;
|
||
|
|
height: 9px;
|
||
|
|
transition: transform 150ms ease-in-out;
|
||
|
|
}
|
||
|
|
.side-dock-collapsible-section-header-indicator svg {
|
||
|
|
width: 8px;
|
||
|
|
height: 8px;
|
||
|
|
}
|
||
|
|
.search-result-container {
|
||
|
|
padding: 0px 4px 4px 4px;
|
||
|
|
}
|
||
|
|
.search-result-collapse-indicator {
|
||
|
|
position: absolute;
|
||
|
|
left: 0;
|
||
|
|
top: -3px;
|
||
|
|
color: var(--accent-strong);
|
||
|
|
transition: transform 100ms ease-in-out;
|
||
|
|
padding: 5px;
|
||
|
|
}
|
||
|
|
.search-result-collapse-indicator svg {
|
||
|
|
width: 8px;
|
||
|
|
height: 8px;
|
||
|
|
}
|
||
|
|
|
||
|
|
.search-result-file-title {
|
||
|
|
font-size: 14px;
|
||
|
|
color: var(--text-accent);
|
||
|
|
border-radius: 0px;
|
||
|
|
border-top: 0px solid var(--background-modifier-border);
|
||
|
|
padding: 2px 12px 0px 18px;
|
||
|
|
}
|
||
|
|
|
||
|
|
.search-result-file-matches {
|
||
|
|
color: var(--text-muted);
|
||
|
|
font-size: 12px;
|
||
|
|
line-height: 16px;
|
||
|
|
padding: 2px 0px;
|
||
|
|
margin-bottom: -6px;
|
||
|
|
border-bottom: 0px;
|
||
|
|
}
|
||
|
|
.search-result-file-match{
|
||
|
|
color: var(--text-muted);
|
||
|
|
font-size: 12px;
|
||
|
|
line-height: 16px;
|
||
|
|
padding: 1px 0px 12px 0;
|
||
|
|
margin-bottom: 4px;
|
||
|
|
border-bottom: 0px;
|
||
|
|
border-bottom: 1px solid black;
|
||
|
|
}
|
||
|
|
|
||
|
|
.search-result-file-match:not(:first-child) {
|
||
|
|
margin-top: 0px;
|
||
|
|
}
|
||
|
|
|
||
|
|
.search-result-file-matched-text {
|
||
|
|
color: var(--text-matched);
|
||
|
|
background-color: var(--text-highlight-bg);
|
||
|
|
}
|
||
|
|
|
||
|
|
.search-info-more-matches {
|
||
|
|
color: var(--text-faint);
|
||
|
|
text-decoration: overline;
|
||
|
|
font-size: 10px;
|
||
|
|
line-height: 16px;
|
||
|
|
}
|
||
|
|
|
||
|
|
.search-empty-state {
|
||
|
|
color: var(--text-error);
|
||
|
|
font-size: 12px;
|
||
|
|
margin: 0 20px 12px 20px;
|
||
|
|
}
|
||
|
|
/* the small text ... and XX matches */
|
||
|
|
.search-result-count {
|
||
|
|
color: var(--text-accent2)
|
||
|
|
}
|
||
|
|
/*========= remove rounded corners =======*/
|
||
|
|
|
||
|
|
.workspace-tab-header.is-active {
|
||
|
|
border-radius: 0px;
|
||
|
|
}
|
||
|
|
|
||
|
|
.workspace-tab-container-before.is-before-active .workspace-tab-header-inner,
|
||
|
|
.workspace-tab-header.is-before-active .workspace-tab-header-inner {
|
||
|
|
border-radius: 0px;
|
||
|
|
}
|
||
|
|
|
||
|
|
.workspace-tab-container-after.is-after-active .workspace-tab-header-inner,
|
||
|
|
.workspace-tab-header.is-after-active .workspace-tab-header-inner {
|
||
|
|
border-bottom-left-radius: 0px;
|
||
|
|
}
|
||
|
|
|
||
|
|
.workspace-split.mod-left-split .workspace-tabs .workspace-leaf {
|
||
|
|
border-top-left-radius: 0px;
|
||
|
|
border-top-right-radius: 0px;
|
||
|
|
}
|
||
|
|
|
||
|
|
/*======= flat status bar ====*/
|
||
|
|
|
||
|
|
.status-bar {
|
||
|
|
background-color: var(--background-secondary-alt);
|
||
|
|
border-top: 0px solid var(--background-modifier-border);
|
||
|
|
color: var(--text-accent);
|
||
|
|
display: flex;
|
||
|
|
font-size: 12px;
|
||
|
|
justify-content: flex-end;
|
||
|
|
line-height: 22px;
|
||
|
|
max-height: 22px;
|
||
|
|
padding: 0 0px;
|
||
|
|
user-select: none;
|
||
|
|
z-index: var(--layer-status-bar);
|
||
|
|
}
|
||
|
|
.status-bar::after {
|
||
|
|
content: ": :";
|
||
|
|
position: absolute;
|
||
|
|
left: 30px;
|
||
|
|
color: var(--text-error);
|
||
|
|
font-size:12px;
|
||
|
|
font-weight: 900;
|
||
|
|
}
|
||
|
|
|
||
|
|
/*====tooltips======*/
|
||
|
|
.tooltip {
|
||
|
|
animation: pop-down 40ms forwards ease-in-out;
|
||
|
|
background-color: var(--accent-strong);
|
||
|
|
border-radius: 1px;
|
||
|
|
color: #dcddde;
|
||
|
|
font-size: 14px;
|
||
|
|
left: 50%;
|
||
|
|
line-height: 20px;
|
||
|
|
max-width: 400px;
|
||
|
|
padding: 5px 14px;
|
||
|
|
position: fixed;
|
||
|
|
text-align: center;
|
||
|
|
transform: translateX(-50%);
|
||
|
|
white-space: nowrap;
|
||
|
|
z-index: var(--layer-tooltip);
|
||
|
|
pointer-events: none;
|
||
|
|
}
|
||
|
|
.tooltip .tooltip-arrow {
|
||
|
|
position: absolute;
|
||
|
|
top: -5px;
|
||
|
|
left: 50%;
|
||
|
|
width: 0;
|
||
|
|
margin-left: -5px;
|
||
|
|
border-bottom: 5px solid rgba(0, 0, 0, 0.9);
|
||
|
|
border-right: 5px solid transparent;
|
||
|
|
border-left: 5px solid transparent;
|
||
|
|
content: " ";
|
||
|
|
font-size: 0;
|
||
|
|
line-height: 0;
|
||
|
|
}
|
||
|
|
/* ======= graph view ==============*/
|
||
|
|
.graph-view.color-fill {
|
||
|
|
color: var(--graph-circle);
|
||
|
|
}
|
||
|
|
|
||
|
|
.graph-view.color-circle {
|
||
|
|
color: var(--graph-circle);
|
||
|
|
}
|
||
|
|
|
||
|
|
.graph-view.color-line {
|
||
|
|
color: var(--graph-line);
|
||
|
|
}
|
||
|
|
|
||
|
|
.graph-view.color-text {
|
||
|
|
color: var(--graph-text);
|
||
|
|
}
|
||
|
|
|
||
|
|
.graph-view.color-fill-highlight {
|
||
|
|
color: var(--interactive-accent);
|
||
|
|
}
|
||
|
|
|
||
|
|
.graph-view.color-line-highlight {
|
||
|
|
color: rgb(var(--interactive-accent-rgb));
|
||
|
|
}
|
||
|
|
|
||
|
|
.graph-view.color-fill-tag {
|
||
|
|
color: var(--graphtag) !important;
|
||
|
|
}
|
||
|
|
.graph-view.color-fill-attachment {
|
||
|
|
color: var(--graph-attach) !important;
|
||
|
|
}
|
||
|
|
.graph-view.color-fill-unresolved {
|
||
|
|
color: var(--text-muted);
|
||
|
|
opacity: 0.4;
|
||
|
|
}
|
||
|
|
.graph-view.color-arrow {
|
||
|
|
color: var(--graph-line);
|
||
|
|
opacity: 1;
|
||
|
|
}
|
||
|
|
.graph-controls {
|
||
|
|
position: absolute;
|
||
|
|
left: 6px;
|
||
|
|
top: 6px;
|
||
|
|
padding: 2px 10px 8px 0px;
|
||
|
|
background-color: rgba(3, 10, 20, 0.7);
|
||
|
|
min-width: 100px;
|
||
|
|
max-width: 240px;
|
||
|
|
border: 1px solid var(--background-modifier-border);
|
||
|
|
border-radius: 0px;
|
||
|
|
max-height: calc(100% - 16px);
|
||
|
|
overflow: auto;
|
||
|
|
}
|
||
|
|
.graph-controls-button.mod-close svg,
|
||
|
|
.graph-controls-button.mod-reset svg {
|
||
|
|
width:12px;
|
||
|
|
height:12px;
|
||
|
|
}
|
||
|
|
.graph-controls-button.mod-open svg {
|
||
|
|
width:14px;
|
||
|
|
height:14px;
|
||
|
|
}
|
||
|
|
.graph-controls.is-close {
|
||
|
|
min-width: inherit;
|
||
|
|
background-color: transparent;
|
||
|
|
border: 1px solid transparent;
|
||
|
|
padding: 6px 8px 2px 8px;
|
||
|
|
}
|
||
|
|
.graph-controls.is-close svg {
|
||
|
|
color:var(--text-muted);
|
||
|
|
}
|
||
|
|
.collapsible-item-children {
|
||
|
|
margin-left: 8px;
|
||
|
|
}
|
||
|
|
.graph-controls input[type='text'],
|
||
|
|
.graph-controls input[type='range'] {
|
||
|
|
width: 100%;
|
||
|
|
font-size: 10px;
|
||
|
|
}
|
||
|
|
.graph-controls .setting-item {
|
||
|
|
padding: 7px 0;
|
||
|
|
}
|
||
|
|
.graph-controls .setting-item.mod-slider .setting-item-control,
|
||
|
|
.graph-controls .setting-item.mod-search-setting .setting-item-control {
|
||
|
|
padding-top: 0px;
|
||
|
|
}
|
||
|
|
.graph-controls .setting-item.mod-toggle .setting-item-control {
|
||
|
|
padding-top: 0;
|
||
|
|
margin-top: 0px;
|
||
|
|
}
|
||
|
|
.graph-controls .setting-item-name {
|
||
|
|
font-size: 10px;
|
||
|
|
color: var(--graph-menutext);
|
||
|
|
display: inline-block;
|
||
|
|
}
|
||
|
|
.setting-item-description {
|
||
|
|
color: var(--graph-menutext);
|
||
|
|
font-size: 10px;
|
||
|
|
}
|
||
|
|
.setting-item {
|
||
|
|
border-top: none;
|
||
|
|
}
|
||
|
|
.graph-controls .collapsible-item-children {
|
||
|
|
margin-top: 0px;
|
||
|
|
}
|
||
|
|
.graph-control-section-header {
|
||
|
|
font-weight: 600;
|
||
|
|
font-size: 10px;
|
||
|
|
color: var(--graph-menutext);
|
||
|
|
}
|
||
|
|
.graph-control-section:not(:last-child) .collapsible-item-children {
|
||
|
|
margin-top: 0px;
|
||
|
|
margin-bottom: 2px;
|
||
|
|
border-bottom: none;
|
||
|
|
}
|
||
|
|
.graph-controls .setting-item {
|
||
|
|
padding: 0;
|
||
|
|
}
|
||
|
|
.graph-controls input[type='range'] {
|
||
|
|
-webkit-appearance: none;
|
||
|
|
background-color: var(--background-secondary);
|
||
|
|
border-radius: 2px;
|
||
|
|
height: 2px;
|
||
|
|
}
|
||
|
|
.graph-controls input[type='range']::-webkit-slider-thumb {
|
||
|
|
width: 13px;
|
||
|
|
height: 9px;
|
||
|
|
border-radius: 20%;
|
||
|
|
border-left: 4px solid var(--text-accent2);
|
||
|
|
cursor: pointer;
|
||
|
|
top: -2px;
|
||
|
|
}
|
||
|
|
.graph-controls .checkbox-container {
|
||
|
|
cursor: pointer;
|
||
|
|
background-color: var(--text-faint);
|
||
|
|
border-radius: 3px;
|
||
|
|
display: inline-block;
|
||
|
|
height: 12px;
|
||
|
|
position: relative;
|
||
|
|
top: 6px;
|
||
|
|
user-select: none;
|
||
|
|
width: 26px;
|
||
|
|
box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.15);
|
||
|
|
transition: background 0.15s ease-in-out, box-shadow 0.15s ease-in-out, border 0.15s ease-in-out, opacity 0.15s ease-in-out, -webkit-box-shadow 0.15s ease-in-out;
|
||
|
|
}
|
||
|
|
.graph-controls .checkbox-container.is-enabled {
|
||
|
|
background-color: var(--interactive-accent);
|
||
|
|
}
|
||
|
|
.graph-controls .checkbox-container:after {
|
||
|
|
pointer-events: none;
|
||
|
|
content: '';
|
||
|
|
display: block;
|
||
|
|
position: absolute;
|
||
|
|
background-color: var(--text-on-accent);
|
||
|
|
width: 12px;
|
||
|
|
height: 10px;
|
||
|
|
margin: 1px 2px 1px 3px;
|
||
|
|
border-radius: 2px;
|
||
|
|
transition: transform 0.15s ease-in-out, width 0.1s ease-in-out, left 0.1s ease-in-out, -webkit-transform 0.15s ease-in-out;
|
||
|
|
left: -4px;
|
||
|
|
transform: translate3d(3px, 0, 0);
|
||
|
|
box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.15);
|
||
|
|
}
|
||
|
|
.graph-controls .checkbox-container.is-enabled:after {
|
||
|
|
transform: translate3d(14px, 0, 0);
|
||
|
|
}
|
||
|
|
|
||
|
|
.view-content > iframe {
|
||
|
|
background-color: var(--graph-bg);
|
||
|
|
}
|
||
|
|
/*===== local graph =====*/
|
||
|
|
/*
|
||
|
|
input[type='range'] {
|
||
|
|
width: 100px;
|
||
|
|
height: 2px;
|
||
|
|
background-color: var(--text-accent);
|
||
|
|
border-radius: 0px;
|
||
|
|
top:7px;
|
||
|
|
position:absolute;
|
||
|
|
}
|
||
|
|
input[type='range']::-webkit-slider-thumb {
|
||
|
|
width: 4px;
|
||
|
|
height: 12px;
|
||
|
|
border-radius: 0%;
|
||
|
|
border-left: 4px solid var(--text-accent2);
|
||
|
|
background: var(--text-accent2);
|
||
|
|
cursor: pointer;
|
||
|
|
}
|
||
|
|
.local-graph-jumps-slider-container {
|
||
|
|
position: absolute;
|
||
|
|
left: 14px;
|
||
|
|
top: 10px;
|
||
|
|
width:120px;
|
||
|
|
height: 20px;
|
||
|
|
padding: 0px 0px 0px 8px;
|
||
|
|
border-radius: 0px;
|
||
|
|
background-color: rgba(0, 0, 0, 0.8);
|
||
|
|
}
|
||
|
|
*/
|
||
|
|
/*==== codemirror line numbers gutter edit mode ====*/
|
||
|
|
.cm-s-obsidian .CodeMirror-gutters {
|
||
|
|
position: absolute;
|
||
|
|
min-height: 100%;
|
||
|
|
z-index: 3;
|
||
|
|
padding-right: 0px;
|
||
|
|
}
|
||
|
|
|
||
|
|
.cm-s-obsidian .CodeMirror-linenumber {
|
||
|
|
color: var(--text-accent);
|
||
|
|
opacity: 0.4;
|
||
|
|
font-size: 11px;
|
||
|
|
font-family: Cairo, Fira Code, Consolas, monospace;
|
||
|
|
padding: 0 0px 0 0px;
|
||
|
|
min-width: 20px;
|
||
|
|
text-align: right;
|
||
|
|
white-space: nowrap;
|
||
|
|
}
|
||
|
|
|
||
|
|
.CodeMirror-foldgutter-open, .CodeMirror-foldgutter-folded {
|
||
|
|
cursor: pointer;
|
||
|
|
font-size: 20px;
|
||
|
|
position:absolute;
|
||
|
|
left: 2px !important;
|
||
|
|
top:-4px !important;
|
||
|
|
width: 18px;
|
||
|
|
}
|
||
|
|
|
||
|
|
/* ==== fold icons ==== */
|
||
|
|
.CodeMirror-guttermarker-subtle {
|
||
|
|
color: var(--text-accent2);
|
||
|
|
}
|
||
|
|
/*-- wider folding zone--*/
|
||
|
|
.CodeMirror-foldgutter {
|
||
|
|
width: 2.5em;
|
||
|
|
}
|
||
|
|
/* === show margins in editor mode === */
|
||
|
|
.CodeMirror-lines {
|
||
|
|
border-right: 1px solid var(--border);
|
||
|
|
border-left: 1px solid var(--border);
|
||
|
|
}
|
||
|
|
|
||
|
|
/*============bigger link popup preview ================*/
|
||
|
|
|
||
|
|
.popover.hover-popover {
|
||
|
|
position: absolute;
|
||
|
|
z-index: var(--layer-popover);
|
||
|
|
max-height: 780px; /* was 300 */
|
||
|
|
min-height: 100px;
|
||
|
|
width: 550px;
|
||
|
|
overflow: hidden;
|
||
|
|
padding: 0;
|
||
|
|
border-bottom: none;
|
||
|
|
transform: scale(0.9);
|
||
|
|
}
|
||
|
|
|
||
|
|
.popover {
|
||
|
|
background-color: var(--background-secondary-alt);
|
||
|
|
border: 1px solid var(--text-accent);
|
||
|
|
box-shadow: 3px 3px 1px var(--text-accent);
|
||
|
|
border-radius: 0px;
|
||
|
|
padding: 15px 20px 10px 20px;
|
||
|
|
position: relative;
|
||
|
|
font-weight: 400;
|
||
|
|
-webkit-text-stroke: 0.0px;
|
||
|
|
-webkit-font-smoothing: none;
|
||
|
|
color:var(--text-normal);
|
||
|
|
overflow-y: scroll;
|
||
|
|
}
|
||
|
|
/* --- the bottom gradient ---*/
|
||
|
|
.popover.hover-popover:after {
|
||
|
|
content: "";
|
||
|
|
position: absolute;
|
||
|
|
width: 100%;
|
||
|
|
height: 0px; /* 50px */
|
||
|
|
bottom: 0;
|
||
|
|
left: 0;
|
||
|
|
right: 0;
|
||
|
|
background: linear-gradient(
|
||
|
|
to bottom,
|
||
|
|
transparent,
|
||
|
|
var(--background-primary) 80%,
|
||
|
|
var(--background-primary)
|
||
|
|
);
|
||
|
|
}
|
||
|
|
|
||
|
|
/* =========== footnotes ========= */
|
||
|
|
|
||
|
|
.markdown-preview-view .mod-highlighted {
|
||
|
|
transition: background-color 1s ease;
|
||
|
|
background-color: var(--text-highlight-bg);
|
||
|
|
color: var(--text-matched);
|
||
|
|
}
|
||
|
|
|
||
|
|
.footnotes {
|
||
|
|
text-align: justify;
|
||
|
|
hyphens: auto;
|
||
|
|
font-size: 12px;
|
||
|
|
}
|
||
|
|
|
||
|
|
sup {
|
||
|
|
vertical-align: top;
|
||
|
|
font-size: 11px;
|
||
|
|
display: inline-block;
|
||
|
|
position: relative;
|
||
|
|
margin: -4px 0 0 3px;
|
||
|
|
}
|
||
|
|
sub {
|
||
|
|
vertical-align: bottom;
|
||
|
|
font-size: 11px;
|
||
|
|
display: inline-block;
|
||
|
|
position: relative;
|
||
|
|
margin: 0px 0 -4px 3px;
|
||
|
|
}
|
||
|
|
/* =========== highlights ========= */
|
||
|
|
.markdown-preview-view mark {
|
||
|
|
background-color: var(--text-highlight-bg);
|
||
|
|
color: var(--text-accent2);
|
||
|
|
}
|
||
|
|
.cm-s-obsidian span.cm-formatting-highlight, .cm-s-obsidian span.cm-highlight {
|
||
|
|
background-color: var(--text-highlight-bg);
|
||
|
|
color: var(--text-accent2);
|
||
|
|
}
|
||
|
|
/* =========== quotes ====== */
|
||
|
|
.cm-s-obsidian span.cm-quote {
|
||
|
|
color: var(--accent-mild);
|
||
|
|
}
|
||
|
|
/* =========== quote block ========= */
|
||
|
|
/* Add quotation character before quote */
|
||
|
|
blockquote.rq:before {
|
||
|
|
font: Barlow;
|
||
|
|
content: "\02033"; /* \275D \0022 \02033 \02DD \201F \201D \030B \02BA*/
|
||
|
|
font-size: 5em;
|
||
|
|
color: var(--text-accent);
|
||
|
|
vertical-align: -0.1em;
|
||
|
|
line-height: 2px;
|
||
|
|
padding: 20px 10px 0 0px;
|
||
|
|
float: left;
|
||
|
|
}
|
||
|
|
blockquote.rq:after {
|
||
|
|
font: Barlow;
|
||
|
|
content: "\02033"; /* \275D \0022 \02033 \02DD \201F \201D \030B \02BA*/
|
||
|
|
font-size: 5em;
|
||
|
|
color: var(--text-accent);
|
||
|
|
float: right;
|
||
|
|
padding: 16px 0px 0 10px;
|
||
|
|
}
|
||
|
|
.markdown-preview-view blockquote {
|
||
|
|
border-radius: 0;
|
||
|
|
border: 0px solid var(--background-modifier-border);
|
||
|
|
background-color: var(--background-primary-alt);
|
||
|
|
border-left: 5px solid var(--accent-strong);
|
||
|
|
padding: 14px 10px 10px 10px;
|
||
|
|
display: block;
|
||
|
|
margin-block-start: 0.5em;
|
||
|
|
margin-block-end: 1em;
|
||
|
|
margin-inline-start: 20px;
|
||
|
|
margin-inline-end: 80px;
|
||
|
|
text-align: justify;
|
||
|
|
hyphens: auto;
|
||
|
|
}
|
||
|
|
.markdown-preview-view blockquote.rq {
|
||
|
|
border-left: 5px solid var(--text-accent);
|
||
|
|
border-radius: 0;
|
||
|
|
border: 0px solid var(--background-modifier-border);
|
||
|
|
background-color: var(--background-primary-alt);
|
||
|
|
border-left: 5px solid var(--text-accent);
|
||
|
|
padding: 14px 22px 14px 22px;
|
||
|
|
display: block;
|
||
|
|
margin-block-start: 0.5em;
|
||
|
|
margin-block-end: 1em;
|
||
|
|
margin-inline-start: 20px;
|
||
|
|
margin-inline-end: 80px;
|
||
|
|
text-align: justify;
|
||
|
|
hyphens: auto;
|
||
|
|
}
|
||
|
|
blockquote.mild {
|
||
|
|
border-left: 5px solid var(--accent-mild);
|
||
|
|
padding: 14px 22px 14px 22px;
|
||
|
|
}
|
||
|
|
|
||
|
|
/*=============== lists bullets ================*/
|
||
|
|
ul {
|
||
|
|
list-style-type: disc;
|
||
|
|
}
|
||
|
|
ul ul {
|
||
|
|
list-style-type: disc;
|
||
|
|
}
|
||
|
|
ul ul ul {
|
||
|
|
list-style-type: circle;
|
||
|
|
}
|
||
|
|
|
||
|
|
/*=============== tables align ================*/
|
||
|
|
tbody {
|
||
|
|
display: table-row-group;
|
||
|
|
vertical-align: top;
|
||
|
|
border-color: inherit;
|
||
|
|
}
|
||
|
|
table {
|
||
|
|
display: table;
|
||
|
|
border-collapse: separate;
|
||
|
|
border-spacing: 2px;
|
||
|
|
border-color: rgb(153, 15, 15);
|
||
|
|
}
|
||
|
|
.markdown-preview-view th, .markdown-preview-view td {
|
||
|
|
padding: 4px 10px;
|
||
|
|
border: 1px solid var(--text-faint);
|
||
|
|
}
|
||
|
|
.markdown-preview-view th {
|
||
|
|
font-weight: 800;
|
||
|
|
background-color: var(--background-secondary-alt);
|
||
|
|
}
|
||
|
|
/* ===== links ====*/
|
||
|
|
.cm-s-obsidian span.cm-url {
|
||
|
|
color: var(--text-accent2);
|
||
|
|
text-decoration: underline;
|
||
|
|
word-break: break-all;
|
||
|
|
}
|
||
|
|
|
||
|
|
/*=============== menu mods smaller headings etc================*/
|
||
|
|
.workspace-leaf {
|
||
|
|
display: flex;
|
||
|
|
flex-direction: column;
|
||
|
|
position: relative;
|
||
|
|
will-change: transform;
|
||
|
|
min-height: 20px;
|
||
|
|
background-color: var(--background-primary);
|
||
|
|
}
|
||
|
|
.workspace-leaf-content[data-type='backlink'] .view-content {
|
||
|
|
padding: 0;
|
||
|
|
overflow: hidden;
|
||
|
|
display: flex;
|
||
|
|
flex-direction: column;
|
||
|
|
min-height: 20px;
|
||
|
|
}
|
||
|
|
.nav-header {
|
||
|
|
padding: 0px 4px 1px 8px;
|
||
|
|
}
|
||
|
|
.nav-buttons-container {
|
||
|
|
display: flex;
|
||
|
|
justify-content: left;
|
||
|
|
padding-bottom: 0px;
|
||
|
|
border-bottom: 1px solid var(--background-modifier-border);
|
||
|
|
margin-bottom: 2px;
|
||
|
|
padding-top: 6px;
|
||
|
|
}
|
||
|
|
.nav-buttons-container.has-separator {
|
||
|
|
border-bottom: 0px solid var(--background-modifier-border);
|
||
|
|
padding-bottom: 6px;
|
||
|
|
margin-bottom: -2px;
|
||
|
|
}
|
||
|
|
/* smaller menu backlinks etc */
|
||
|
|
|
||
|
|
.workspace-leaf-content[data-type='search'] .nav-action-button.is-active {
|
||
|
|
background-color: var(--text-highlight-bg);
|
||
|
|
color: var(--text-accent2);
|
||
|
|
}
|
||
|
|
.workspace-leaf-content[data-type='search'] .nav-action-button {
|
||
|
|
padding: 2px 10px 0px 10px;
|
||
|
|
margin: 0px 3px 3px 2px;
|
||
|
|
border-radius: 4px;
|
||
|
|
}
|
||
|
|
/* smaller tabs */
|
||
|
|
.workspace-tab-header-container {
|
||
|
|
display: flex;
|
||
|
|
background-color: var(--background-secondary-alt);
|
||
|
|
height: 25px;
|
||
|
|
padding-top: 0px;
|
||
|
|
}
|
||
|
|
.workspace-tab-header-inner {
|
||
|
|
padding: 0px 0px;
|
||
|
|
height: 100%;
|
||
|
|
display: flex;
|
||
|
|
}
|
||
|
|
|
||
|
|
div[aria-label="文件管理器"],
|
||
|
|
div[aria-label="File explorer"],
|
||
|
|
div[aria-label="搜索"],
|
||
|
|
div[aria-label="Search"],
|
||
|
|
div[aria-label^="星标"],
|
||
|
|
div[aria-label^="Starred"] {
|
||
|
|
padding: 0px 5px 0px 20px;
|
||
|
|
background-color: var(--background-secondary-alt);
|
||
|
|
}
|
||
|
|
/*======== replace icons in tab header with text =========*/
|
||
|
|
div[aria-label="文件管理器"] .workspace-tab-header-inner-icon,
|
||
|
|
div[aria-label="File explorer"] .workspace-tab-header-inner-icon {
|
||
|
|
display: none;
|
||
|
|
}
|
||
|
|
div[aria-label="文件管理器"] .workspace-tab-header-inner:after,
|
||
|
|
div[aria-label="File explorer"] .workspace-tab-header-inner:after {
|
||
|
|
content: "FILES";
|
||
|
|
font-size:12px;
|
||
|
|
font-weight: 700;
|
||
|
|
margin-left:-8px;
|
||
|
|
}
|
||
|
|
|
||
|
|
div[aria-label="搜索"] .workspace-tab-header-inner-icon,
|
||
|
|
div[aria-label="Search"] .workspace-tab-header-inner-icon {
|
||
|
|
display: none;
|
||
|
|
}
|
||
|
|
div[aria-label="搜索"] .workspace-tab-header-inner:after,
|
||
|
|
div[aria-label="Search"] .workspace-tab-header-inner:after {
|
||
|
|
content: "SEARCH";
|
||
|
|
font-size:12px;
|
||
|
|
font-weight: 700;
|
||
|
|
margin-left:-8px;
|
||
|
|
}
|
||
|
|
div[aria-label="星标"] .workspace-tab-header-inner-icon,
|
||
|
|
div[aria-label="Starred"] .workspace-tab-header-inner-icon {
|
||
|
|
display: none;
|
||
|
|
}
|
||
|
|
div[aria-label="星标"] .workspace-tab-header-inner:after,
|
||
|
|
div[aria-label="Starred"] .workspace-tab-header-inner:after {
|
||
|
|
content: "STAR";
|
||
|
|
font-size:12px;
|
||
|
|
font-weight: 700;
|
||
|
|
margin-left:-8px;
|
||
|
|
}
|
||
|
|
|
||
|
|
.workspace-tab-container-before.is-before-active,
|
||
|
|
.workspace-tab-container-after.is-after-active,
|
||
|
|
.workspace-tab-header.is-before-active,
|
||
|
|
.workspace-tab-header.is-after-active {
|
||
|
|
background-color: var(--background-secondary-alt);
|
||
|
|
}
|
||
|
|
|
||
|
|
.workspace-tabs {
|
||
|
|
background-color: var(--background-secondary-alt);
|
||
|
|
overflow: hidden;
|
||
|
|
padding: 0px 4px 28px 0;
|
||
|
|
position: relative;
|
||
|
|
}
|
||
|
|
|
||
|
|
/* ========= tag pane ===================*/
|
||
|
|
.workspace-leaf-content[data-type='tag'] {
|
||
|
|
padding: 10px 10px;
|
||
|
|
overflow: auto;
|
||
|
|
}
|
||
|
|
.workspace-tab-header[aria-label="标签面板"] > .workspace-tab-header-inner > .workspace-tab-header-inner-icon svg,
|
||
|
|
.workspace-tab-header[aria-label="Tag pane"] > .workspace-tab-header-inner > .workspace-tab-header-inner-icon svg {
|
||
|
|
display: none;
|
||
|
|
}
|
||
|
|
|
||
|
|
.workspace-tab-header[aria-label="标签面板"] > .workspace-tab-header-inner > .workspace-tab-header-inner-icon::before,
|
||
|
|
.workspace-tab-header[aria-label="Tag pane"] > .workspace-tab-header-inner > .workspace-tab-header-inner-icon::before {
|
||
|
|
content: "TAGS";
|
||
|
|
font-size: 12px;
|
||
|
|
font-weight: 900;
|
||
|
|
display: block;
|
||
|
|
top: 0px;
|
||
|
|
left: 5px;
|
||
|
|
position: relative;
|
||
|
|
padding: 0 5px;
|
||
|
|
}
|
||
|
|
.workspace-tab-header[aria-label="标签面板"] > .workspace-tab-header-inner > .workspace-tab-header-inner-icon:hover,
|
||
|
|
.workspace-tab-header[aria-label="Tag pane"] > .workspace-tab-header-inner > .workspace-tab-header-inner-icon:hover {
|
||
|
|
color :red;
|
||
|
|
}
|
||
|
|
.tag-pane-tag {
|
||
|
|
font-size: 11px;
|
||
|
|
line-height: 20px;
|
||
|
|
color: var(--tagspanetag)
|
||
|
|
}
|
||
|
|
|
||
|
|
.tag-pane-tag-count {
|
||
|
|
top: 2px;
|
||
|
|
right: 10px;
|
||
|
|
font-size: 11px;
|
||
|
|
background-color: var(--background-secondary-alt);
|
||
|
|
line-height: 12px;
|
||
|
|
border-radius: 3px;
|
||
|
|
padding: 2px 4px;
|
||
|
|
color:var(--text-accent2)
|
||
|
|
}
|
||
|
|
|
||
|
|
.pane-clickable-item {
|
||
|
|
padding: 0px 15px;
|
||
|
|
}
|
||
|
|
/*==== outline pane ====*/
|
||
|
|
.workspace-tab-header[aria-label*="大纲"] > .workspace-tab-header-inner > .workspace-tab-header-inner-icon svg,
|
||
|
|
.workspace-tab-header[aria-label^="Outline"] > .workspace-tab-header-inner > .workspace-tab-header-inner-icon svg {
|
||
|
|
display: none;
|
||
|
|
color:red;
|
||
|
|
}
|
||
|
|
.workspace-tab-header[aria-label*="大纲"] > .workspace-tab-header-inner > .workspace-tab-header-inner-icon::before,
|
||
|
|
.workspace-tab-header[aria-label^="Outline"] > .workspace-tab-header-inner > .workspace-tab-header-inner-icon::before {
|
||
|
|
content: "OUTLINE";
|
||
|
|
font-size: 12px;
|
||
|
|
font-weight: 900;
|
||
|
|
display: block;
|
||
|
|
top: 0px;
|
||
|
|
left: 5px;
|
||
|
|
position: relative;
|
||
|
|
padding: 0 8px;
|
||
|
|
}
|
||
|
|
.workspace-tab-header[aria-label*="大纲"] > .workspace-tab-header-inner > .workspace-tab-header-inner-icon:hover,
|
||
|
|
.workspace-tab-header[aria-label^="Outline"] > .workspace-tab-header-inner > .workspace-tab-header-inner-icon:hover {
|
||
|
|
color :red;
|
||
|
|
}
|
||
|
|
|
||
|
|
.outline .pane-clickable-item {
|
||
|
|
cursor: pointer;
|
||
|
|
user-select: none;
|
||
|
|
color: var(--text-accent2);
|
||
|
|
padding: 0px 15px;
|
||
|
|
border-radius: 3px;
|
||
|
|
font-size: 12px;
|
||
|
|
position: relative;
|
||
|
|
}
|
||
|
|
|
||
|
|
/*===== backlinks pane =======*/
|
||
|
|
.workspace-tab-header[aria-label*="反向链接"] > .workspace-tab-header-inner > .workspace-tab-header-inner-icon svg,
|
||
|
|
.workspace-tab-header[aria-label^="Backlinks"] > .workspace-tab-header-inner > .workspace-tab-header-inner-icon svg {
|
||
|
|
display: none;
|
||
|
|
color:red;
|
||
|
|
}
|
||
|
|
.workspace-tab-header[aria-label*="反向链接"] > .workspace-tab-header-inner > .workspace-tab-header-inner-icon::before,
|
||
|
|
.workspace-tab-header[aria-label^="Backlinks"] > .workspace-tab-header-inner > .workspace-tab-header-inner-icon::before {
|
||
|
|
content: "BACKLINKS";
|
||
|
|
font-size: 12px;
|
||
|
|
font-weight: 900;
|
||
|
|
display: block;
|
||
|
|
top: 0px;
|
||
|
|
left: 5px;
|
||
|
|
position: relative;
|
||
|
|
padding: 0 10px;
|
||
|
|
}
|
||
|
|
.workspace-tab-header[aria-label^="反向链接"] > .workspace-tab-header-inner > .workspace-tab-header-inner-icon:hover,
|
||
|
|
.workspace-tab-header[aria-label^="Backlinks"] > .workspace-tab-header-inner > .workspace-tab-header-inner-icon:hover {
|
||
|
|
color :red;
|
||
|
|
}
|
||
|
|
|
||
|
|
.workspace-leaf-content[data-type='backlink'] .nav-action-button {
|
||
|
|
padding: 2px 8px 0px 8px;
|
||
|
|
margin: 0px 20px 3px 3px;
|
||
|
|
border-radius: 4px;
|
||
|
|
}
|
||
|
|
.workspace-leaf-content[data-type='backlink'] .nav-action-button.is-active {
|
||
|
|
background-color: var(--text-highlight-bg);
|
||
|
|
color: var(--text-accent2);
|
||
|
|
padding: 2px 8px 0px 8px;
|
||
|
|
margin: 0px 20px 3px 3px;
|
||
|
|
}
|
||
|
|
|
||
|
|
/*====== view header =====*/
|
||
|
|
|
||
|
|
.workspace-leaf.mod-active .view-header-title::selection {
|
||
|
|
background-color: var(--text-highlight-bg);
|
||
|
|
color: var(--interactive-accent);
|
||
|
|
}
|
||
|
|
.view-header-icon {
|
||
|
|
padding: 0px 10px;
|
||
|
|
color: var(--text-muted);
|
||
|
|
cursor: grab;
|
||
|
|
position: relative;
|
||
|
|
top: 2px;
|
||
|
|
height: 20px;
|
||
|
|
background-color: var(--background-primary);
|
||
|
|
}
|
||
|
|
.view-header {
|
||
|
|
height: 22px; /*36*/
|
||
|
|
display: flex;
|
||
|
|
border-top: 0px solid var(--background-secondary-alt);
|
||
|
|
border-bottom: 0 px solid var(--background-secondary-alt);
|
||
|
|
background-color: transparent;
|
||
|
|
}
|
||
|
|
.view-header-title-container {
|
||
|
|
background-color: var(--background-secondary-alt);
|
||
|
|
flex-grow: 1;
|
||
|
|
height: 22px;
|
||
|
|
line-height: 22px;
|
||
|
|
overflow: hidden;
|
||
|
|
padding-left: 0px;
|
||
|
|
position: relative;
|
||
|
|
}
|
||
|
|
.view-header-title {
|
||
|
|
font-size: 10px;
|
||
|
|
font-weight: 600;
|
||
|
|
overflow: auto;
|
||
|
|
padding: 0px 20px 6px 0px;
|
||
|
|
white-space: nowrap;
|
||
|
|
line-height: 22px;
|
||
|
|
top: 0px;
|
||
|
|
border-top: 7px solid var(--background-primary);
|
||
|
|
border-bottom: 7px solid var(--background-primary);
|
||
|
|
color: var(--text-muted);
|
||
|
|
background-color: var(--background-primary);
|
||
|
|
display:inline;
|
||
|
|
position: relative;
|
||
|
|
}
|
||
|
|
.view-actions {
|
||
|
|
padding: 3px 0px 0px 0px;
|
||
|
|
display: flex;
|
||
|
|
justify-content: flex-end;
|
||
|
|
background-color: var(--background-secondary-alt);
|
||
|
|
z-index: 2;
|
||
|
|
height:22px;
|
||
|
|
}
|
||
|
|
|
||
|
|
.view-content {
|
||
|
|
width: 100%;
|
||
|
|
height: calc(100% - 22px);
|
||
|
|
}
|
||
|
|
|
||
|
|
.workspace-leaf.mod-active .view-header-icon {
|
||
|
|
padding: 0px 10px;
|
||
|
|
color: var(--text-accent2);
|
||
|
|
background-color: var(--background-secondary);
|
||
|
|
border-bottom: 3px solid var(--interactive-accent);
|
||
|
|
cursor: grab;
|
||
|
|
position: relative;
|
||
|
|
height:22px;
|
||
|
|
top: 0px;
|
||
|
|
}
|
||
|
|
.workspace-leaf.mod-active .view-action {
|
||
|
|
color: var(--text-accent2);
|
||
|
|
}
|
||
|
|
.workspace-leaf.mod-active .view-actions {
|
||
|
|
color: var(--text-accent2);
|
||
|
|
border-bottom:3px solid var(--interactive-accent);
|
||
|
|
}
|
||
|
|
.view-action[aria-label="Unlink pane"] {
|
||
|
|
color: var(--accent-strong);
|
||
|
|
}
|
||
|
|
.workspace-leaf.mod-active .view-header-title {
|
||
|
|
color: var(--text-normal);
|
||
|
|
border-top: 6px solid var(--background-secondary);
|
||
|
|
background: var(--background-secondary);
|
||
|
|
height:22px;
|
||
|
|
}
|
||
|
|
.workspace-leaf.mod-active .view-header-title-container {
|
||
|
|
background-color: var(--background-secondary-alt);
|
||
|
|
border-bottom: 3px solid var(--interactive-accent);
|
||
|
|
}
|
||
|
|
|
||
|
|
.view-header-title:after {
|
||
|
|
content: '';
|
||
|
|
position: absolute;
|
||
|
|
top: -6px;
|
||
|
|
right: -31px;
|
||
|
|
padding-left: 10px;
|
||
|
|
border-bottom: 30px solid var(--background-primary);
|
||
|
|
border-right: 30px solid transparent;
|
||
|
|
background: var(--background-secondary-alt);
|
||
|
|
}
|
||
|
|
.workspace-leaf.mod-active .view-header-title:after {
|
||
|
|
content: '';
|
||
|
|
position: absolute;
|
||
|
|
top: -6px;
|
||
|
|
right: -31px;
|
||
|
|
padding-left: 12px;
|
||
|
|
border-bottom: 30px solid var(--background-secondary);
|
||
|
|
border-right: 30px solid transparent;
|
||
|
|
background: var(--background-secondary-alt);
|
||
|
|
}
|
||
|
|
.view-header-title-container:after {
|
||
|
|
content: '';
|
||
|
|
position: absolute;
|
||
|
|
top: 0;
|
||
|
|
right: 0;
|
||
|
|
height:22px;
|
||
|
|
background:none;
|
||
|
|
}
|
||
|
|
.workspace-leaf.mod-active .view-header-title-container:after {
|
||
|
|
background: none;
|
||
|
|
}
|
||
|
|
/*===== menu ==============*/
|
||
|
|
.menu {
|
||
|
|
background-color: var(--background-secondary-alt);
|
||
|
|
border-radius: 1px;
|
||
|
|
border: 1px solid var(--background-modifier-border);
|
||
|
|
box-shadow: 0px 0px 0px var(--accent-strong);
|
||
|
|
position: absolute;
|
||
|
|
z-index: var(--layer-menu);
|
||
|
|
user-select: none;
|
||
|
|
color: var(--text-accent2);
|
||
|
|
}
|
||
|
|
.menu-group {
|
||
|
|
padding: 4px 0;
|
||
|
|
border-bottom: 1px solid var(--background-modifier-border);
|
||
|
|
}
|
||
|
|
.menu-item {
|
||
|
|
padding: 2px 20px 3px 20px;
|
||
|
|
cursor: pointer;
|
||
|
|
font-size: 12px;
|
||
|
|
font-family: Segoe UI, Consolas, Source Code,-apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen ;
|
||
|
|
}
|
||
|
|
.menu-item:hover {
|
||
|
|
background-color: var(--text-highlight-bg);
|
||
|
|
}
|
||
|
|
.menu-item-icon {
|
||
|
|
display: inline-block;
|
||
|
|
width: 32px;
|
||
|
|
height: 24px;
|
||
|
|
color: var(--text-accent);
|
||
|
|
position: relative;
|
||
|
|
top: 2px;
|
||
|
|
}
|
||
|
|
/*===============modal: settings ===============*/
|
||
|
|
.modal {
|
||
|
|
background-color: var(--background-secondary-alt);
|
||
|
|
border-radius: 4px;
|
||
|
|
border: 1px solid var(--background-secondary-alt);
|
||
|
|
box-shadow: 0 2px 2px var(--background-modifier-box-shadow);
|
||
|
|
max-width: 70vw;
|
||
|
|
padding: 30px 50px;
|
||
|
|
position: relative;
|
||
|
|
}
|
||
|
|
.modal-bg {
|
||
|
|
position: fixed;
|
||
|
|
top: 0;
|
||
|
|
left: 0;
|
||
|
|
width: 100%;
|
||
|
|
height: 100%;
|
||
|
|
background-color: var(--background-modifier-cover);
|
||
|
|
}
|
||
|
|
.horizontal-tab-content, .vertical-tab-content {
|
||
|
|
background-color: var(--background-secondary-alt);
|
||
|
|
padding: 5px 30px;
|
||
|
|
}
|
||
|
|
.checkbox-container {
|
||
|
|
cursor: pointer;
|
||
|
|
background-color: var(--background-secondary);
|
||
|
|
border-radius: 2px;
|
||
|
|
display: inline-block;
|
||
|
|
height: 22px;
|
||
|
|
position: relative;
|
||
|
|
top: 4px;
|
||
|
|
user-select: none;
|
||
|
|
width: 42px;
|
||
|
|
box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.15);
|
||
|
|
transition: background 0.15s ease-in-out, box-shadow 0.15s ease-in-out, border 0.15s ease-in-out, opacity 0.15s ease-in-out, -webkit-box-shadow 0.15s ease-in-out;
|
||
|
|
}
|
||
|
|
.checkbox-container:after {
|
||
|
|
pointer-events: none;
|
||
|
|
content: '';
|
||
|
|
display: block;
|
||
|
|
position: absolute;
|
||
|
|
background-color: var(--bw);
|
||
|
|
width: 15px;
|
||
|
|
height: 15px;
|
||
|
|
margin: 3px;
|
||
|
|
border-radius: 2px;
|
||
|
|
transition: transform 0.15s ease-in-out, width 0.1s ease-in-out, left 0.1s ease-in-out, -webkit-transform 0.15s ease-in-out;
|
||
|
|
left: 0;
|
||
|
|
transform: translate3d(1px, 0, 0);
|
||
|
|
box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.15);
|
||
|
|
}
|
||
|
|
.checkbox-container.is-enabled:after {
|
||
|
|
transform: translate3d(21px, 0, 0);
|
||
|
|
}
|
||
|
|
/*=============== modal prompt ================*/
|
||
|
|
.prompt {
|
||
|
|
display: flex;
|
||
|
|
flex-direction: column;
|
||
|
|
border-radius: 8px;
|
||
|
|
padding: 10px;
|
||
|
|
background-color: var(--background-secondary-alt);
|
||
|
|
z-index: 1;
|
||
|
|
position: absolute;
|
||
|
|
top: 80px;
|
||
|
|
width: 700px;
|
||
|
|
max-width: 80vw;
|
||
|
|
}
|
||
|
|
.suggestion-item.is-selected {
|
||
|
|
background-color: #99108b;
|
||
|
|
color: var(--bw);
|
||
|
|
}
|
||
|
|
.prompt-results {
|
||
|
|
list-style: none;
|
||
|
|
margin: 0;
|
||
|
|
padding: 10px 0 0 0;
|
||
|
|
max-height: 400px;
|
||
|
|
overflow-y: auto;
|
||
|
|
color: var(--text-accent);
|
||
|
|
}
|
||
|
|
.suggestion-hotkey {
|
||
|
|
padding: 0 10px;
|
||
|
|
float: right;
|
||
|
|
font-size: 12px;
|
||
|
|
font-family: -apple-system, BlinkMacSystemFont, var(--font-monospace);
|
||
|
|
color: var(--text-accent2);
|
||
|
|
}
|
||
|
|
/*=============== top titlebar ================*/
|
||
|
|
.titlebar {
|
||
|
|
background-color:var(--background-secondary-alt);
|
||
|
|
}
|
||
|
|
.titlebar-inner {
|
||
|
|
-webkit-app-region: drag;
|
||
|
|
display: flex;
|
||
|
|
flex-grow: 1;
|
||
|
|
color: var(--text-accent2);
|
||
|
|
}
|
||
|
|
.titlebar-left {
|
||
|
|
width: 30px;
|
||
|
|
}
|
||
|
|
.titlebar-button.mod-back, .titlebar-button.mod-forward {
|
||
|
|
line-height: 28px;
|
||
|
|
}
|
||
|
|
.titlebar-button {
|
||
|
|
-webkit-app-region: no-drag;
|
||
|
|
padding: 0 8px;
|
||
|
|
cursor: pointer;
|
||
|
|
opacity: 0.7;
|
||
|
|
}
|
||
|
|
.titlebar-button:hover {
|
||
|
|
opacity: 1;
|
||
|
|
}
|
||
|
|
.titlebar-button.mod-back svg {
|
||
|
|
display:none;
|
||
|
|
}
|
||
|
|
.titlebar-button.mod-back:before {
|
||
|
|
content:"<<prev";
|
||
|
|
font-size: 11px;
|
||
|
|
top:-2px;
|
||
|
|
position:relative;
|
||
|
|
}
|
||
|
|
.titlebar-button.mod-forward svg {
|
||
|
|
display:none;
|
||
|
|
}
|
||
|
|
.titlebar-button.mod-forward:before {
|
||
|
|
content:"next>>";
|
||
|
|
font-size: 11px;
|
||
|
|
top:-2px;
|
||
|
|
position:relative;
|
||
|
|
}
|
||
|
|
.titlebar-text {
|
||
|
|
flex-grow: 1;
|
||
|
|
margin-right: 120px;
|
||
|
|
font-size: 10px;
|
||
|
|
text-align: right;
|
||
|
|
letter-spacing: 0.05em;
|
||
|
|
line-height: 20px;
|
||
|
|
opacity: 1;
|
||
|
|
color: var(--text-accent);
|
||
|
|
position: relative;
|
||
|
|
}
|
||
|
|
.titlebar-text:after {
|
||
|
|
content: "\\ ono-sendai";
|
||
|
|
font-size: 10px;
|
||
|
|
text-align: right;
|
||
|
|
right:-1px;
|
||
|
|
color: var(--text-accent2);
|
||
|
|
position: relative;
|
||
|
|
}
|
||
|
|
.titlebar-text:before{
|
||
|
|
content: "\\ \\";
|
||
|
|
font-size: 11px;
|
||
|
|
text-align: right;
|
||
|
|
right:1px;
|
||
|
|
color: var(--text-accent);
|
||
|
|
position: relative;
|
||
|
|
}
|
||
|
|
.titlebar-button-container {
|
||
|
|
position: absolute;
|
||
|
|
height: 26px;
|
||
|
|
top: 0px;
|
||
|
|
}
|
||
|
|
div[aria-label="Minimize"] svg rect {
|
||
|
|
opacity: 0.7;
|
||
|
|
stroke: var(--text-accent2);
|
||
|
|
fill: var(--text-accent2);
|
||
|
|
filter: saturate(100);
|
||
|
|
}
|
||
|
|
div[aria-label="Restore down"] svg rect,
|
||
|
|
div[aria-label="Maximize"] svg rect {
|
||
|
|
opacity: 1;
|
||
|
|
stroke: var(--text-accent2);
|
||
|
|
fill: none;
|
||
|
|
}
|
||
|
|
div[aria-label="Close window"] {
|
||
|
|
color: red;
|
||
|
|
opacity: 0.7;
|
||
|
|
filter: saturate(100);
|
||
|
|
stroke: red;
|
||
|
|
}
|
||
|
|
.titlebar-button-container.mod-right {
|
||
|
|
right: 3px;
|
||
|
|
}
|
||
|
|
/*=============== transluscency fx ================*/
|
||
|
|
body.is-translucent {
|
||
|
|
background-color: transparent;
|
||
|
|
}
|
||
|
|
.theme-dark {--opacity-translucency: 0.7;}
|
||
|
|
.theme-light { --opacity-translucency: 0.5; }
|
||
|
|
|
||
|
|
.is-translucent.theme-light .titlebar { opacity: 0.8; }
|
||
|
|
.is-translucent.theme-dark .titlebar { opacity: 1; }
|
||
|
|
.is-translucent img { background-color: transparent; filter: contrast(1.12) brightness(0.74); opacity:1;}
|
||
|
|
.is-translucent .workspace { background-color: transparent; filter: contrast(1.2) brightness(1.34);}
|
||
|
|
.is-translucent .workspace-split.mod-root { opacity: var(--opacity-translucency); }
|
||
|
|
.is-translucent.theme-light .workspace-leaf-resize-handle { opacity: 0.1; background-color: var(--background-secondary-alt);}
|
||
|
|
.is-translucent.theme-dark .workspace-leaf-resize-handle { opacity: 1; background-color: var(--background-secondary-alt);}
|
||
|
|
.is-translucent .workspace-leaf-resize-handle:hover { background-color: rgba(var(--interactive-accent-rgb), 0.8); }
|
||
|
|
.is-translucent.theme-light .workspace-ribbon { opacity: 0.55; }
|
||
|
|
.is-translucent.theme-dark .workspace-ribbon { opacity: 1; }
|
||
|
|
.is-translucent .workspace-tabs { opacity: 0.6; }
|
||
|
|
.is-translucent.theme-dark .status-bar {
|
||
|
|
opacity: 1;
|
||
|
|
border-top: 0px solid var(--background-secondary-alt);
|
||
|
|
margin: 0px 0px; }
|
||
|
|
.is-translucent.theme-light .status-bar {
|
||
|
|
opacity: 0.8;
|
||
|
|
border-top: 0px solid var(--background-secondary-alt);
|
||
|
|
margin: 0px 0px; }
|
||
|
|
.is-translucent.theme-dark .view-content > iframe {
|
||
|
|
background-color: rgb(1, 12, 10) !important;
|
||
|
|
opacity: 1;
|
||
|
|
}
|
||
|
|
/*=============== add mods below ================*/
|
||
|
|
/*=============== add mods below ================*/
|
||
|
|
|
||
|
|
/*=============== DIRTY WYSIWYM HEADERS by _ph =====================*/
|
||
|
|
/*=============== replace H1-H6 markup in edit mode ================*/
|
||
|
|
.CodeMirror-sizer{
|
||
|
|
margin-left: 48px !important;
|
||
|
|
}
|
||
|
|
|
||
|
|
/*-- reduce left padding --*/
|
||
|
|
.CodeMirror {
|
||
|
|
height: 100%;
|
||
|
|
direction: ltr;
|
||
|
|
padding: 0 10px;
|
||
|
|
}
|
||
|
|
/*-- header color --*/
|
||
|
|
.cm-header.cm-header-1{
|
||
|
|
color: var(--text-accent);
|
||
|
|
left:0px;
|
||
|
|
position: relative;
|
||
|
|
}
|
||
|
|
.cm-header.cm-header-2{
|
||
|
|
color: var(--text-accent2);
|
||
|
|
left:0px;
|
||
|
|
position: relative;
|
||
|
|
}
|
||
|
|
|
||
|
|
/*-- hide # markup--*/
|
||
|
|
.cm-formatting.cm-formatting-header.cm-formatting-header-1.cm-header.cm-header-1,
|
||
|
|
.cm-formatting.cm-formatting-header.cm-formatting-header-2.cm-header.cm-header-2,
|
||
|
|
.cm-formatting.cm-formatting-header.cm-formatting-header-3.cm-header.cm-header-3,
|
||
|
|
.cm-formatting.cm-formatting-header.cm-formatting-header-4.cm-header.cm-header-4,
|
||
|
|
.cm-formatting.cm-formatting-header.cm-formatting-header-5.cm-header.cm-header-5,
|
||
|
|
.cm-formatting.cm-formatting-header.cm-formatting-header-6.cm-header.cm-header-6
|
||
|
|
{font-size:0px;}
|
||
|
|
|
||
|
|
/*-- display H1-h6 in gutter--*/
|
||
|
|
.cm-formatting.cm-formatting-header.cm-formatting-header-1.cm-header.cm-header-1:before{
|
||
|
|
content:"H1";
|
||
|
|
font-size:18px;
|
||
|
|
color: var(--text-accent2);
|
||
|
|
left:-54px;
|
||
|
|
top:-17px;
|
||
|
|
position:absolute;
|
||
|
|
}
|
||
|
|
.cm-formatting.cm-formatting-header.cm-formatting-header-2.cm-header.cm-header-2:before{
|
||
|
|
content:"H2";
|
||
|
|
font-size:13px;
|
||
|
|
color: var(--text-accent2);
|
||
|
|
left:-48px;
|
||
|
|
top:-10px;
|
||
|
|
position:absolute;
|
||
|
|
}
|
||
|
|
.cm-formatting.cm-formatting-header.cm-formatting-header-3.cm-header.cm-header-3:before{
|
||
|
|
content:"H3";
|
||
|
|
font-size:11px;
|
||
|
|
color: var(--text-accent2);
|
||
|
|
left:-41px;
|
||
|
|
top: 16px;
|
||
|
|
position:absolute;
|
||
|
|
}
|
||
|
|
.cm-formatting.cm-formatting-header.cm-formatting-header-4.cm-header.cm-header-4:before{
|
||
|
|
content:"H4";
|
||
|
|
font-size:10px;
|
||
|
|
color: var(--text-accent2);
|
||
|
|
left:-41px;
|
||
|
|
top: 10px;
|
||
|
|
position:absolute;
|
||
|
|
}
|
||
|
|
.cm-formatting.cm-formatting-header.cm-formatting-header-5.cm-header.cm-header-5:before{
|
||
|
|
content:"H5";
|
||
|
|
font-size:10px;
|
||
|
|
color: var(--text-accent2);
|
||
|
|
left:-41px;
|
||
|
|
top: 10px;
|
||
|
|
position:absolute;
|
||
|
|
}
|
||
|
|
.cm-formatting.cm-formatting-header.cm-formatting-header-6.cm-header.cm-header-6:before{
|
||
|
|
content:"H6";
|
||
|
|
font-size:10px;
|
||
|
|
color: var(--text-accent2);
|
||
|
|
left:-41px;
|
||
|
|
top: 10px;
|
||
|
|
position:absolute;
|
||
|
|
}
|
||
|
|
|
||
|
|
/*-- is active line, hide H[1-6] in gutter --*/
|
||
|
|
.CodeMirror-activeline span.cm-formatting.cm-formatting-header.cm-formatting-header-1.cm-header.cm-header-1:before,
|
||
|
|
.CodeMirror-activeline span.cm-formatting.cm-formatting-header.cm-formatting-header-2.cm-header.cm-header-2:before,
|
||
|
|
.CodeMirror-activeline span.cm-formatting.cm-formatting-header.cm-formatting-header-3.cm-header.cm-header-3:before,
|
||
|
|
.CodeMirror-activeline span.cm-formatting.cm-formatting-header.cm-formatting-header-4.cm-header.cm-header-4:before,
|
||
|
|
.CodeMirror-activeline span.cm-formatting.cm-formatting-header.cm-formatting-header-5.cm-header.cm-header-5:before,
|
||
|
|
.CodeMirror-activeline span.cm-formatting.cm-formatting-header.cm-formatting-header-6.cm-header.cm-header-6:before
|
||
|
|
{font-size:0px;}
|
||
|
|
/*-- is active line, display # markup --*/
|
||
|
|
.CodeMirror-activeline > pre > span .cm-formatting.cm-formatting-header.cm-formatting-header-1.cm-header.cm-header-1{
|
||
|
|
font-size:32px;
|
||
|
|
display:inline;
|
||
|
|
}
|
||
|
|
.CodeMirror-activeline > pre > span .cm-formatting.cm-formatting-header.cm-formatting-header-2.cm-header.cm-header-2{
|
||
|
|
font-size:24px;
|
||
|
|
display:inline;
|
||
|
|
}
|
||
|
|
.CodeMirror-activeline > pre > span .cm-formatting.cm-formatting-header.cm-formatting-header-3.cm-header.cm-header-3{
|
||
|
|
font-size:19px;
|
||
|
|
display:inline;
|
||
|
|
}
|
||
|
|
.CodeMirror-activeline > pre > span .cm-formatting.cm-formatting-header.cm-formatting-header-4.cm-header.cm-header-4,
|
||
|
|
.CodeMirror-activeline > pre > span .cm-formatting.cm-formatting-header.cm-formatting-header-5.cm-header.cm-header-5,
|
||
|
|
.CodeMirror-activeline > pre > span .cm-formatting.cm-formatting-header.cm-formatting-header-6.cm-header.cm-header-6{
|
||
|
|
font-size:13px;
|
||
|
|
display:inline;
|
||
|
|
}
|
||
|
|
|
||
|
|
/*=============== FOCUS MODE by death_au + transparency mod ================*/
|
||
|
|
.cm-s-obsidian div:not(.CodeMirror-activeline) > pre.CodeMirror-line,
|
||
|
|
.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 {
|
||
|
|
opacity:0.7;
|
||
|
|
filter: saturate(0.7);
|
||
|
|
}
|
||
|
|
|
||
|
|
.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 {
|
||
|
|
opacity:1;
|
||
|
|
}
|
||
|
|
|
||
|
|
/*=============== add mods below ================*/
|
||
|
|
/*=============== add mods below ================*/
|
||
|
|
|
||
|
|
/*file explorer columns view : slightly buggy ----*/
|
||
|
|
.nav-folder-children {
|
||
|
|
column-width:150px;
|
||
|
|
column-rule: 1px solid var(--border);
|
||
|
|
}
|
||
|
|
|
||
|
|
/* file explorer :Wrap long nav text and some paddings */
|
||
|
|
.nav-file-title,
|
||
|
|
.nav-folder-title {
|
||
|
|
white-space: normal;
|
||
|
|
width: auto;
|
||
|
|
}
|
||
|
|
|
||
|
|
/* file explorer : Indent wrapped nav text */
|
||
|
|
.nav-file-title-content {
|
||
|
|
margin-left: 10px;
|
||
|
|
text-indent: -10px;
|
||
|
|
}
|
||
|
|
.nav-file-title-content.is-being-renamed {
|
||
|
|
margin-left: 0px;
|
||
|
|
text-indent: 0px;
|
||
|
|
}
|
||
|
|
/* images : reduce displayed size of embedded files, zoom on hover */
|
||
|
|
.markdown-preview-view img, .markdown-preview-view video {
|
||
|
|
width: auto;
|
||
|
|
height: auto;
|
||
|
|
object-fit: contain;
|
||
|
|
max-height: 300px;
|
||
|
|
max-width: 550px;
|
||
|
|
outline: 1px solid var(--text-accent);
|
||
|
|
}
|
||
|
|
.markdown-preview-view img:hover , .markdown-preview-view video:hover {
|
||
|
|
width: 100%;
|
||
|
|
height:100%;
|
||
|
|
|
||
|
|
max-width: min(100%, 80vw);
|
||
|
|
max-height: min(100%, 80vh);
|
||
|
|
outline: none;
|
||
|
|
cursor: zoom-in;
|
||
|
|
}
|
||
|
|
/* remove focus border for detail/summary html tags */
|
||
|
|
:focus {
|
||
|
|
outline: -webkit-focus-ring-color auto 0px;
|
||
|
|
}
|
||
|
|
/*===============================================*/
|
||
|
|
/* .__ .___*/
|
||
|
|
/* _____ ___________ _____ _____ |__| __| _/*/
|
||
|
|
/* / \_/ __ \_ __ \/ \\__ \ | |/ __ | */
|
||
|
|
/*| Y Y \ ___/| | \/ Y Y \/ __ \| / /_/ | */
|
||
|
|
/*|__|_| /\___ >__| |__|_| (____ /__\____ | */
|
||
|
|
/* \/ \/ \/ \/ \/ */
|
||
|
|
/*======== optionnal mermaid style below ========*/
|
||
|
|
|
||
|
|
.label {
|
||
|
|
font-family: Segoe UI, "trebuchet ms", verdana, arial, Fira Code, consolas,
|
||
|
|
monospace !important;
|
||
|
|
color: var(--text-normal) !important;
|
||
|
|
}
|
||
|
|
|
||
|
|
.label text {
|
||
|
|
fill: var(--background-primary-alt) !important;
|
||
|
|
}
|
||
|
|
|
||
|
|
.node rect,
|
||
|
|
.node circle,
|
||
|
|
.node ellipse,
|
||
|
|
.node polygon,
|
||
|
|
.node path {
|
||
|
|
fill: var(--background-modifier-border) !important;
|
||
|
|
stroke: var(--text-normal) !important;
|
||
|
|
stroke-width: 0.5px !important;
|
||
|
|
}
|
||
|
|
|
||
|
|
.node .label {
|
||
|
|
text-align: center !important;
|
||
|
|
}
|
||
|
|
|
||
|
|
.node.clickable {
|
||
|
|
cursor: pointer !important;
|
||
|
|
}
|
||
|
|
|
||
|
|
.arrowheadPath {
|
||
|
|
fill: var(--text-faint) !important;
|
||
|
|
}
|
||
|
|
|
||
|
|
.edgePath .path {
|
||
|
|
stroke: var(--text-faint) !important;
|
||
|
|
stroke-width: 1.5px !important;
|
||
|
|
}
|
||
|
|
|
||
|
|
.flowchart-link {
|
||
|
|
stroke: var(--text-faint) !important;
|
||
|
|
fill: none !important;
|
||
|
|
}
|
||
|
|
|
||
|
|
.edgeLabel {
|
||
|
|
background-color: var(--background-primary) !important;
|
||
|
|
text-align: center !important;
|
||
|
|
}
|
||
|
|
|
||
|
|
.edgeLabel rect {
|
||
|
|
opacity: 0 !important;
|
||
|
|
}
|
||
|
|
|
||
|
|
.cluster rect {
|
||
|
|
fill: var(--background-primary-alt) !important;
|
||
|
|
stroke: var(--text-faint) !important;
|
||
|
|
stroke-width: 1px !important;
|
||
|
|
}
|
||
|
|
|
||
|
|
.cluster text {
|
||
|
|
fill: var(--background-primary) !important;
|
||
|
|
}
|
||
|
|
|
||
|
|
div.mermaidTooltip {
|
||
|
|
text-align: center !important;
|
||
|
|
max-width: 200px !important;
|
||
|
|
padding: 2px !important;
|
||
|
|
font-family: Segoe UI, "trebuchet ms", verdana, arial !important;
|
||
|
|
font-size: 10px !important;
|
||
|
|
background: var(--background-secondary) !important;
|
||
|
|
border: 1px solid var(--text-faint) !important;
|
||
|
|
border-radius: 2px !important;
|
||
|
|
pointer-events: none !important;
|
||
|
|
z-index: 100 !important;
|
||
|
|
}
|
||
|
|
|
||
|
|
/* Sequence Diagram variables */
|
||
|
|
|
||
|
|
.actor {
|
||
|
|
stroke: var(--text-accent) !important;
|
||
|
|
fill: var(--background-secondary-alt) !important;
|
||
|
|
}
|
||
|
|
|
||
|
|
text.actor > tspan {
|
||
|
|
fill: var(--text-muted) !important;
|
||
|
|
stroke: none !important;
|
||
|
|
}
|
||
|
|
|
||
|
|
.actor-line {
|
||
|
|
stroke: var(--text-muted) !important;
|
||
|
|
}
|
||
|
|
|
||
|
|
.messageLine0 {
|
||
|
|
stroke-width: 1.5 !important;
|
||
|
|
stroke-dasharray: none !important;
|
||
|
|
stroke: var(--text-muted) !important;
|
||
|
|
}
|
||
|
|
|
||
|
|
.messageLine1 {
|
||
|
|
stroke-width: 1.5 !important;
|
||
|
|
stroke-dasharray: 2, 2 !important;
|
||
|
|
stroke: var(--text-muted) !important;
|
||
|
|
}
|
||
|
|
|
||
|
|
#arrowhead path {
|
||
|
|
fill: var(--text-muted) !important;
|
||
|
|
stroke: var(--text-muted) !important;
|
||
|
|
}
|
||
|
|
|
||
|
|
.sequenceNumber {
|
||
|
|
fill: var(--background-primary) !important;
|
||
|
|
}
|
||
|
|
|
||
|
|
#sequencenumber {
|
||
|
|
fill: var(--text-muted) !important;
|
||
|
|
}
|
||
|
|
|
||
|
|
#crosshead path {
|
||
|
|
fill: var(--text-muted) !important;
|
||
|
|
stroke: var(--text-muted) !important;
|
||
|
|
}
|
||
|
|
|
||
|
|
.messageText {
|
||
|
|
fill: var(--text-muted) !important;
|
||
|
|
stroke: var(--text-muted) !important;
|
||
|
|
}
|
||
|
|
|
||
|
|
.labelBox {
|
||
|
|
stroke: var(--text-accent) !important;
|
||
|
|
fill: var(--background-secondary-alt) !important;
|
||
|
|
}
|
||
|
|
|
||
|
|
.labelText,
|
||
|
|
.labelText > tspan {
|
||
|
|
fill: var(--text-muted) !important;
|
||
|
|
stroke: none !important;
|
||
|
|
}
|
||
|
|
|
||
|
|
.loopText,
|
||
|
|
.loopText > tspan {
|
||
|
|
fill: var(--text-muted) !important;
|
||
|
|
stroke: none !important;
|
||
|
|
}
|
||
|
|
|
||
|
|
.loopLine {
|
||
|
|
stroke-width: 2px !important;
|
||
|
|
stroke-dasharray: 2, 2 !important;
|
||
|
|
stroke: var(--text-accent) !important;
|
||
|
|
fill: var(--text-accent) !important;
|
||
|
|
}
|
||
|
|
|
||
|
|
.note {
|
||
|
|
stroke: var(--text-normal) !important;
|
||
|
|
fill: var(--text-accent) !important;
|
||
|
|
}
|
||
|
|
|
||
|
|
.noteText,
|
||
|
|
.noteText > tspan {
|
||
|
|
fill: var(--background-secondary-alt) !important;
|
||
|
|
stroke: none !important;
|
||
|
|
}
|
||
|
|
|
||
|
|
/* Gantt chart variables */
|
||
|
|
|
||
|
|
.activation0 {
|
||
|
|
fill: var(--background-secondary) !important;
|
||
|
|
stroke: var(--text-accent) !important;
|
||
|
|
}
|
||
|
|
|
||
|
|
.activation1 {
|
||
|
|
fill: var(--background-secondary) !important;
|
||
|
|
stroke: var(--text-accent) !important;
|
||
|
|
}
|
||
|
|
|
||
|
|
.activation2 {
|
||
|
|
fill: var(--background-secondary) !important;
|
||
|
|
stroke: var(--text-accent) !important;
|
||
|
|
}
|
||
|
|
|
||
|
|
/** Section styling */
|
||
|
|
|
||
|
|
.mermaid-main-font {
|
||
|
|
font-family: Segoe UI, "trebuchet ms", verdana, arial !important;
|
||
|
|
}
|
||
|
|
|
||
|
|
.section {
|
||
|
|
stroke: none !important;
|
||
|
|
opacity: 0.2 !important;
|
||
|
|
}
|
||
|
|
|
||
|
|
.section0 {
|
||
|
|
fill: var(--text-faint) !important;
|
||
|
|
}
|
||
|
|
|
||
|
|
.section2 {
|
||
|
|
fill: var(--text-accent) !important;
|
||
|
|
}
|
||
|
|
|
||
|
|
.section1,
|
||
|
|
.section3 {
|
||
|
|
fill: var(--text-normal) !important;
|
||
|
|
opacity: 0.2 !important;
|
||
|
|
}
|
||
|
|
|
||
|
|
.sectionTitle0 {
|
||
|
|
fill: var(--text-normal) !important;
|
||
|
|
}
|
||
|
|
|
||
|
|
.sectionTitle1 {
|
||
|
|
fill: var(--text-normal) !important;
|
||
|
|
}
|
||
|
|
|
||
|
|
.sectionTitle2 {
|
||
|
|
fill: var(--text-normal) !important;
|
||
|
|
}
|
||
|
|
|
||
|
|
.sectionTitle3 {
|
||
|
|
fill: var(--text-normal) !important;
|
||
|
|
}
|
||
|
|
|
||
|
|
.sectionTitle {
|
||
|
|
text-anchor: start !important;
|
||
|
|
font-size: 9px !important;
|
||
|
|
line-height: 14px !important;
|
||
|
|
font-family: Segoe UI, "trebuchet ms", verdana, arial !important;
|
||
|
|
}
|
||
|
|
|
||
|
|
/* Grid and axis */
|
||
|
|
|
||
|
|
.grid .tick {
|
||
|
|
stroke: var(--text-muted) !important;
|
||
|
|
opacity: 0.2 !important;
|
||
|
|
shape-rendering: crispEdges !important;
|
||
|
|
}
|
||
|
|
|
||
|
|
.grid .tick text {
|
||
|
|
font-family: Segoe UI, "trebuchet ms", verdana, arial !important;
|
||
|
|
}
|
||
|
|
|
||
|
|
.grid path {
|
||
|
|
stroke-width: 0 !important;
|
||
|
|
}
|
||
|
|
|
||
|
|
/* Today line */
|
||
|
|
|
||
|
|
.today {
|
||
|
|
fill: none !important;
|
||
|
|
stroke: var(--background-modifier-error) !important;
|
||
|
|
stroke-width: 2px !important;
|
||
|
|
}
|
||
|
|
|
||
|
|
/* Task styling */
|
||
|
|
|
||
|
|
/* Default task */
|
||
|
|
|
||
|
|
.task {
|
||
|
|
stroke-width: 0.5px !important;
|
||
|
|
}
|
||
|
|
|
||
|
|
.taskText {
|
||
|
|
text-anchor: middle !important;
|
||
|
|
font-family: Segoe UI, "trebuchet ms", verdana, arial !important;
|
||
|
|
}
|
||
|
|
|
||
|
|
.taskText:not([font-size]) {
|
||
|
|
font-size: 9px !important;
|
||
|
|
}
|
||
|
|
|
||
|
|
.taskTextOutsideRight {
|
||
|
|
fill: var(--text-normal) !important;
|
||
|
|
text-anchor: start !important;
|
||
|
|
font-size: 9px !important;
|
||
|
|
font-family: Segoe UI, "trebuchet ms", verdana, arial !important;
|
||
|
|
}
|
||
|
|
|
||
|
|
.taskTextOutsideLeft {
|
||
|
|
fill: var(--text-normal) !important;
|
||
|
|
text-anchor: end !important;
|
||
|
|
font-size: 9px !important;
|
||
|
|
}
|
||
|
|
|
||
|
|
/* Special case clickable */
|
||
|
|
|
||
|
|
.task.clickable {
|
||
|
|
cursor: pointer !important;
|
||
|
|
}
|
||
|
|
|
||
|
|
.taskText.clickable {
|
||
|
|
cursor: pointer !important;
|
||
|
|
fill: var(--interactive-accent_hover) !important;
|
||
|
|
font-weight: bold !important;
|
||
|
|
}
|
||
|
|
|
||
|
|
.taskTextOutsideLeft.clickable {
|
||
|
|
cursor: pointer !important;
|
||
|
|
fill: var(--interactive-accent_hover) !important;
|
||
|
|
font-weight: bold !important;
|
||
|
|
}
|
||
|
|
|
||
|
|
.taskTextOutsideRight.clickable {
|
||
|
|
cursor: pointer !important;
|
||
|
|
fill: var(--interactive-accent_hover) !important;
|
||
|
|
font-weight: bold !important;
|
||
|
|
}
|
||
|
|
|
||
|
|
/* Specific task settings for the sections*/
|
||
|
|
|
||
|
|
.taskText0,
|
||
|
|
.taskText1,
|
||
|
|
.taskText2,
|
||
|
|
.taskText3 {
|
||
|
|
fill: var(--text-normal) !important;
|
||
|
|
}
|
||
|
|
|
||
|
|
.task0,
|
||
|
|
.task1,
|
||
|
|
.task2,
|
||
|
|
.task3 {
|
||
|
|
fill: var(--background-secondary-alt) !important;
|
||
|
|
stroke: var(--text-muted) !important;
|
||
|
|
}
|
||
|
|
|
||
|
|
.taskTextOutside0,
|
||
|
|
.taskTextOutside2 {
|
||
|
|
fill: var(--text-muted) !important;
|
||
|
|
}
|
||
|
|
|
||
|
|
.taskTextOutside1,
|
||
|
|
.taskTextOutside3 {
|
||
|
|
fill: var(--text-muted) !important;
|
||
|
|
}
|
||
|
|
|
||
|
|
/* Active task */
|
||
|
|
|
||
|
|
.active0,
|
||
|
|
.active1,
|
||
|
|
.active2,
|
||
|
|
.active3 {
|
||
|
|
fill: var(--text-accent) !important;
|
||
|
|
stroke: var(--text-muted) !important;
|
||
|
|
}
|
||
|
|
|
||
|
|
.activeText0,
|
||
|
|
.activeText1,
|
||
|
|
.activeText2,
|
||
|
|
.activeText3 {
|
||
|
|
fill: var(--text-normal) !important;
|
||
|
|
}
|
||
|
|
|
||
|
|
/* Completed task */
|
||
|
|
|
||
|
|
.done0,
|
||
|
|
.done1,
|
||
|
|
.done2,
|
||
|
|
.done3 {
|
||
|
|
stroke: var(--text-muted) !important;
|
||
|
|
fill: var(--text-faint) !important;
|
||
|
|
stroke-width: 1 !important;
|
||
|
|
}
|
||
|
|
|
||
|
|
.doneText0,
|
||
|
|
.doneText1,
|
||
|
|
.doneText2,
|
||
|
|
.doneText3 {
|
||
|
|
fill: var(--text-normal) !important;
|
||
|
|
}
|
||
|
|
|
||
|
|
/* Tasks on the critical line */
|
||
|
|
|
||
|
|
.crit0,
|
||
|
|
.crit1,
|
||
|
|
.crit2,
|
||
|
|
.crit3 {
|
||
|
|
stroke: var(--accent-strong) !important;
|
||
|
|
fill: var(--accent-strong) !important;
|
||
|
|
stroke-width: 1 !important;
|
||
|
|
}
|
||
|
|
|
||
|
|
.activeCrit0,
|
||
|
|
.activeCrit1,
|
||
|
|
.activeCrit2,
|
||
|
|
.activeCrit3 {
|
||
|
|
stroke: var(--accent-strong) !important;
|
||
|
|
fill: var(--text-accent) !important;
|
||
|
|
stroke-width: 1 !important;
|
||
|
|
}
|
||
|
|
|
||
|
|
.doneCrit0,
|
||
|
|
.doneCrit1,
|
||
|
|
.doneCrit2,
|
||
|
|
.doneCrit3 {
|
||
|
|
stroke: var(--accent-strong) !important;
|
||
|
|
fill: var(--text-muted) !important;
|
||
|
|
stroke-width: 0.5 !important;
|
||
|
|
cursor: pointer !important;
|
||
|
|
shape-rendering: crispEdges !important;
|
||
|
|
}
|
||
|
|
|
||
|
|
.milestone {
|
||
|
|
transform: rotate(45deg) scale(0.8, 0.8) !important;
|
||
|
|
}
|
||
|
|
|
||
|
|
.milestoneText {
|
||
|
|
font-style: italic !important;
|
||
|
|
}
|
||
|
|
|
||
|
|
.doneCritText0,
|
||
|
|
.doneCritText1,
|
||
|
|
.doneCritText2,
|
||
|
|
.doneCritText3 {
|
||
|
|
fill: var(--text-normal) !important;
|
||
|
|
}
|
||
|
|
|
||
|
|
.activeCritText0,
|
||
|
|
.activeCritText1,
|
||
|
|
.activeCritText2,
|
||
|
|
.activeCritText3 {
|
||
|
|
fill: var(--text-normal) !important;
|
||
|
|
}
|
||
|
|
|
||
|
|
.titleText {
|
||
|
|
text-anchor: middle !important;
|
||
|
|
font-size: 16px !important;
|
||
|
|
fill: var(--text-normal) !important;
|
||
|
|
font-family: Segoe UI, "trebuchet ms", verdana, arial !important;
|
||
|
|
}
|
||
|
|
|
||
|
|
g.classGroup text {
|
||
|
|
fill: var(--text-accent) !important;
|
||
|
|
stroke: none !important;
|
||
|
|
font-family: consolas, monospace, Segoe UI, "trebuchet ms", verdana, arial !important;
|
||
|
|
font-size: 8px !important;
|
||
|
|
}
|
||
|
|
|
||
|
|
g.classGroup text .title {
|
||
|
|
font-weight: bolder !important;
|
||
|
|
}
|
||
|
|
|
||
|
|
g.clickable {
|
||
|
|
cursor: pointer !important;
|
||
|
|
}
|
||
|
|
|
||
|
|
g.classGroup rect {
|
||
|
|
fill: var(--background-secondary-alt) !important;
|
||
|
|
stroke: var(--text-accent) !important;
|
||
|
|
}
|
||
|
|
|
||
|
|
g.classGroup line {
|
||
|
|
stroke: var(--text-accent) !important;
|
||
|
|
stroke-width: 1 !important;
|
||
|
|
}
|
||
|
|
|
||
|
|
.classLabel .box {
|
||
|
|
stroke: none !important;
|
||
|
|
stroke-width: 0 !important;
|
||
|
|
fill: var(--background-secondary-alt) !important;
|
||
|
|
opacity: 0.2 !important;
|
||
|
|
}
|
||
|
|
|
||
|
|
.classLabel .label {
|
||
|
|
fill: var(--text-accent) !important;
|
||
|
|
font-size: 10px !important;
|
||
|
|
}
|
||
|
|
|
||
|
|
.relation {
|
||
|
|
stroke: var(--text-accent) !important;
|
||
|
|
stroke-width: 1 !important;
|
||
|
|
fill: none !important;
|
||
|
|
}
|
||
|
|
|
||
|
|
.dashed-line {
|
||
|
|
stroke-dasharray: 3 !important;
|
||
|
|
}
|
||
|
|
|
||
|
|
#compositionStart {
|
||
|
|
fill: var(--text-accent) !important;
|
||
|
|
stroke: var(--text-accent) !important;
|
||
|
|
stroke-width: 1 !important;
|
||
|
|
}
|
||
|
|
|
||
|
|
#compositionEnd {
|
||
|
|
fill: var(--text-accent) !important;
|
||
|
|
stroke: var(--text-accent) !important;
|
||
|
|
stroke-width: 1 !important;
|
||
|
|
}
|
||
|
|
|
||
|
|
#aggregationStart {
|
||
|
|
fill: var(--background-secondary-alt) !important;
|
||
|
|
stroke: var(--text-accent) !important;
|
||
|
|
stroke-width: 1 !important;
|
||
|
|
}
|
||
|
|
|
||
|
|
#aggregationEnd {
|
||
|
|
fill: var(--background-secondary-alt) !important;
|
||
|
|
stroke: var(--text-accent) !important;
|
||
|
|
stroke-width: 1 !important;
|
||
|
|
}
|
||
|
|
|
||
|
|
#dependencyStart {
|
||
|
|
fill: var(--text-accent) !important;
|
||
|
|
stroke: var(--text-accent) !important;
|
||
|
|
stroke-width: 1 !important;
|
||
|
|
}
|
||
|
|
|
||
|
|
#dependencyEnd {
|
||
|
|
fill: var(--text-accent) !important;
|
||
|
|
stroke: var(--text-accent) !important;
|
||
|
|
stroke-width: 1 !important;
|
||
|
|
}
|
||
|
|
|
||
|
|
#extensionStart {
|
||
|
|
fill: var(--text-accent) !important;
|
||
|
|
stroke: var(--text-accent) !important;
|
||
|
|
stroke-width: 1 !important;
|
||
|
|
}
|
||
|
|
|
||
|
|
#extensionEnd {
|
||
|
|
fill: var(--text-accent) !important;
|
||
|
|
stroke: var(--text-accent) !important;
|
||
|
|
stroke-width: 1 !important;
|
||
|
|
}
|
||
|
|
|
||
|
|
.commit-id,
|
||
|
|
.commit-msg,
|
||
|
|
.branch-label {
|
||
|
|
fill: var(--text-muted) !important;
|
||
|
|
color: var(--text-muted) !important;
|
||
|
|
font-family: Segoe UI, "trebuchet ms", verdana, arial !important;
|
||
|
|
}
|
||
|
|
|
||
|
|
.pieTitleText {
|
||
|
|
text-anchor: middle !important;
|
||
|
|
font-size: 18px !important;
|
||
|
|
fill: var(--text-normal) !important;
|
||
|
|
font-family: Segoe UI, "trebuchet ms", verdana, arial !important;
|
||
|
|
}
|
||
|
|
|
||
|
|
.slice {
|
||
|
|
font-family: Segoe UI, "trebuchet ms", verdana, arial !important;
|
||
|
|
}
|
||
|
|
|
||
|
|
g.stateGroup text {
|
||
|
|
fill: var(--text-accent) !important;
|
||
|
|
stroke: none !important;
|
||
|
|
font-size: 10px !important;
|
||
|
|
font-family: Segoe UI, "trebuchet ms", verdana, arial !important;
|
||
|
|
}
|
||
|
|
|
||
|
|
g.stateGroup text {
|
||
|
|
fill: var(--text-accent) !important;
|
||
|
|
stroke: none !important;
|
||
|
|
font-size: 10px !important;
|
||
|
|
}
|
||
|
|
|
||
|
|
g.stateGroup .state-title {
|
||
|
|
font-weight: bolder !important;
|
||
|
|
fill: var(--background-secondary-alt) !important;
|
||
|
|
}
|
||
|
|
|
||
|
|
g.stateGroup rect {
|
||
|
|
fill: var(--background-secondary-alt) !important;
|
||
|
|
stroke: var(--text-accent) !important;
|
||
|
|
}
|
||
|
|
|
||
|
|
g.stateGroup line {
|
||
|
|
stroke: var(--text-accent) !important;
|
||
|
|
stroke-width: 1 !important;
|
||
|
|
}
|
||
|
|
|
||
|
|
.transition {
|
||
|
|
stroke: var(--text-accent) !important;
|
||
|
|
stroke-width: 1 !important;
|
||
|
|
fill: none !important;
|
||
|
|
}
|
||
|
|
|
||
|
|
.stateGroup .composit {
|
||
|
|
fill: var(--text-normal) !important;
|
||
|
|
border-bottom: 1px !important;
|
||
|
|
}
|
||
|
|
|
||
|
|
.stateGroup .alt-composit {
|
||
|
|
fill: #e0e0e0 !important;
|
||
|
|
border-bottom: 1px !important;
|
||
|
|
}
|
||
|
|
|
||
|
|
.state-note {
|
||
|
|
stroke: var(--text-faint) !important;
|
||
|
|
fill: var(--text-accent) !important;
|
||
|
|
}
|
||
|
|
|
||
|
|
.state-note text {
|
||
|
|
fill: black !important;
|
||
|
|
stroke: none !important;
|
||
|
|
font-size: 10px !important;
|
||
|
|
}
|
||
|
|
|
||
|
|
.stateLabel .box {
|
||
|
|
stroke: none !important;
|
||
|
|
stroke-width: 0 !important;
|
||
|
|
fill: var(--background-secondary-alt) !important;
|
||
|
|
opacity: 0.5 !important;
|
||
|
|
}
|
||
|
|
|
||
|
|
.stateLabel text {
|
||
|
|
fill: black !important;
|
||
|
|
font-size: 10px !important;
|
||
|
|
font-weight: bold !important;
|
||
|
|
font-family: Segoe UI, "trebuchet ms", verdana, arial !important;
|
||
|
|
}
|
||
|
|
|
||
|
|
.node circle.state-start {
|
||
|
|
fill: black !important;
|
||
|
|
stroke: black !important;
|
||
|
|
}
|
||
|
|
|
||
|
|
.node circle.state-end {
|
||
|
|
fill: black !important;
|
||
|
|
stroke: var(--text-normal) !important;
|
||
|
|
stroke-width: 1.5 !important;
|
||
|
|
}
|
||
|
|
|
||
|
|
#statediagram-barbEnd {
|
||
|
|
fill: var(--text-accent) !important;
|
||
|
|
}
|
||
|
|
|
||
|
|
.statediagram-cluster rect {
|
||
|
|
fill: var(--background-secondary-alt) !important;
|
||
|
|
stroke: var(--text-accent) !important;
|
||
|
|
stroke-width: 1px !important;
|
||
|
|
}
|
||
|
|
|
||
|
|
.statediagram-cluster rect.outer {
|
||
|
|
rx: 5px !important;
|
||
|
|
ry: 5px !important;
|
||
|
|
}
|
||
|
|
|
||
|
|
.statediagram-state .divider {
|
||
|
|
stroke: var(--text-accent) !important;
|
||
|
|
}
|
||
|
|
|
||
|
|
.statediagram-state .title-state {
|
||
|
|
rx: 5px !important;
|
||
|
|
ry: 5px !important;
|
||
|
|
}
|
||
|
|
|
||
|
|
.statediagram-cluster.statediagram-cluster .inner {
|
||
|
|
fill: var(--text-normal) !important;
|
||
|
|
}
|
||
|
|
|
||
|
|
.statediagram-cluster.statediagram-cluster-alt .inner {
|
||
|
|
fill: #e0e0e0 !important;
|
||
|
|
}
|
||
|
|
|
||
|
|
.statediagram-cluster .inner {
|
||
|
|
rx: 0 !important;
|
||
|
|
ry: 0 !important;
|
||
|
|
}
|
||
|
|
|
||
|
|
.statediagram-state rect.basic {
|
||
|
|
rx: 5px !important;
|
||
|
|
ry: 5px !important;
|
||
|
|
}
|
||
|
|
|
||
|
|
.statediagram-state rect.divider {
|
||
|
|
stroke-dasharray: 10, 10 !important;
|
||
|
|
fill: #efefef !important;
|
||
|
|
}
|
||
|
|
|
||
|
|
.note-edge {
|
||
|
|
stroke-dasharray: 5 !important;
|
||
|
|
}
|
||
|
|
|
||
|
|
.statediagram-note rect {
|
||
|
|
fill: var(--text-accent) !important;
|
||
|
|
stroke: var(--text-muted) !important;
|
||
|
|
stroke-width: 1px !important;
|
||
|
|
rx: 0 !important;
|
||
|
|
ry: 0 !important;
|
||
|
|
}
|
||
|
|
|
||
|
|
:root {
|
||
|
|
--mermaid-font-family: '"trebuchet ms", verdana, arial' !important;
|
||
|
|
--mermaid-font-family: "Comic Sans MS", "Comic Sans", cursive !important;
|
||
|
|
}
|
||
|
|
|
||
|
|
/* Classes common for multiple diagrams */
|
||
|
|
|
||
|
|
.error-icon {
|
||
|
|
fill: var(--text-error) !important;
|
||
|
|
}
|
||
|
|
|
||
|
|
.error-text {
|
||
|
|
fill: var(--text-muted) !important;
|
||
|
|
stroke: var(--text-muted) !important;
|
||
|
|
}
|
||
|
|
|
||
|
|
.edge-thickness-normal {
|
||
|
|
stroke-width: 1px !important;
|
||
|
|
}
|
||
|
|
|
||
|
|
.edge-thickness-thick {
|
||
|
|
stroke-width: 3px !important;
|
||
|
|
}
|
||
|
|
|
||
|
|
.edge-pattern-solid {
|
||
|
|
stroke-dasharray: 0 !important;
|
||
|
|
}
|
||
|
|
|
||
|
|
.edge-pattern-dashed {
|
||
|
|
stroke-dasharray: 3 !important;
|
||
|
|
}
|
||
|
|
|
||
|
|
.edge-pattern-dotted {
|
||
|
|
stroke-dasharray: 2 !important;
|
||
|
|
}
|
||
|
|
|
||
|
|
.marker {
|
||
|
|
fill: var(--text-muted) !important;
|
||
|
|
}
|
||
|
|
|
||
|
|
.marker.cross {
|
||
|
|
stroke: var(--text-muted) !important;
|
||
|
|
}
|
||
|
|
|
||
|
|
rect {
|
||
|
|
fill: var(--text-accent-hover);
|
||
|
|
fill-opacity: 1;
|
||
|
|
stroke: var(--text-normal);
|
||
|
|
}
|