obsidian.css

/*
 * default obsidian color palette
 * 
 * .theme-dark {
 *         color-scheme: dark;
 *         --highlight-mix-blend-mode: lighten;
 *         --mono-rgb-0: 0, 0, 0;
 *         --mono-rgb-100: 255, 255, 255;
 *         --color-red-rgb: 251, 70, 76;
 *         --color-red: #fb464c;
 *         --color-orange-rgb: 233, 151, 63;
 *         --color-orange: #e9973f;
 *         --color-yellow-rgb: 224, 222, 113;
 *         --color-yellow: #e0de71;
 *         --color-green-rgb: 68, 207, 110;
 *         --color-green: #44cf6e;
 *         --color-cyan-rgb: 83, 223, 221;
 *         --color-cyan: #53dfdd;
 *         --color-blue-rgb: 2, 122, 255;
 *         --color-blue: #027aff;
 *         --color-purple-rgb: 168, 130, 255;
 *         --color-purple: #a882ff;
 *         --color-pink-rgb: 250, 153, 205;
 *         --color-pink: #fa99cd;
 *         --color-base-00: #1e1e1e;
 *         --color-base-05: #212121;
 *         --color-base-10: #242424;
 *         --color-base-20: #262626;
 *         --color-base-25: #2a2a2a;
 *         --color-base-30: #363636;
 *         --color-base-35: #3f3f3f;
 *         --color-base-40: #555555;
 *         --color-base-50: #666666;
 *         --color-base-60: #999999;
 *         --color-base-70: #b3b3b3;
 *         --color-base-100: #dadada;
 *         --color-accent-hsl: var(--accent-h), var(--accent-s), var(--accent-l);
 *         --color-accent: hsl(var(--accent-h), var(--accent-s), var(--accent-l));
 *         --color-accent-1: hsl(calc(var(--accent-h) - 3), calc(var(--accent-s) * 1.02), calc(var(--accent-l) * 1.15));
 *         --color-accent-2: hsl(calc(var(--accent-h) - 5), calc(var(--accent-s) * 1.05), calc(var(--accent-l) * 1.29));
 *         --background-modifier-form-field: var(--color-base-25);
 *         --background-secondary-alt: var(--color-base-30);
 *         --interactive-normal: var(--color-base-30);
 *         --interactive-hover: var(--color-base-35);
 *         --text-accent: var(--color-accent-1);
 *         --interactive-accent: var(--color-accent);
 *         --interactive-accent-hover: var(--color-accent-1);
 *         --background-modifier-box-shadow: rgba(0, 0, 0, 0.3);
 *         --background-modifier-cover: rgba(10, 10, 10, 0.4);
 *         --text-selection: hsla(var(--interactive-accent-hsl), 0.25);
 *         --input-shadow: inset 0 0.5px 0.5px 0.5px rgba(255, 255, 255, 0.09), 0 2px 4px 0 rgba(0,0,0,.15), 0 1px 1.5px 0 rgba(0,0,0,.1), 0 1px 2px 0 rgba(0,0,0,.2), 0 0 0 0 transparent;
 *         --input-shadow-hover: inset 0 0.5px 1px 0.5px rgba(255, 255, 255, 0.16), 0 2px 3px 0 rgba(0,0,0,.3), 0 1px 1.5px 0 rgba(0,0,0,.2), 0 1px 2px 0 rgba(0,0,0,.4), 0 0 0 0 transparent;
 *         --shadow-s: 0px 1px 2px rgba(0, 0, 0, 0.121), 0px 3.4px 6.7px rgba(0, 0, 0, 0.179), 0px 15px 30px rgba(0, 0, 0, 0.3);
 *         --shadow-l: 0px 1.8px 7.3px rgba(0, 0, 0, 0.071), 0px 6.3px 24.7px rgba(0, 0, 0, 0.112), 0px 30px 90px rgba(0, 0, 0, 0.2);
 *         --pdf-shadow: 0 0 0 1px var(--background-modifier-border);
 *         --pdf-thumbnail-shadow: 0 0 0 1px var(--background-modifier-border);
 * }
 */

/* darken background */
body {
        --my-transparency-level: 1; /* set <1 for transparency */
        --workspace-background-translucent: rgba(var(--mono-rgb-0), var(--my-transparency-level)) !important;
        --tab-background-active: transparent;
        --titlebar-background: transparent;
        --tab-outline-color: transparent;
}
.mod-horizontal,
.workspace-tab-header.mod-active.is-active,
.workspace-split.mod-root,
.workspace-split.mod-root .view-content,
.workspace-split.mod-root .view-header,
.workspace-tab-container,
.view-header-title-container:not(.mod-at-end):after,
.custom-frames-frame,
.is-focused .workspace-leaf.mod-active .view-header {
        background: transparent !important;
}

/* gray out file name */
.inline-title {
        font-size: var(--h1-size) !important;
        color: var(--color-base-40) !important;
}

/* set max page width */
/* body {
        --file-line-width: 1000px;
} */

/*
 * navigation
 */

/* hide workspace name */
.workspace-sidedock-vault-profile {
        display: none !important;
}

/* space out nav items */
/* .nav-files-container > div > .nav-folder {
        padding-bottom: 3rem !important;
} */

/* keep buttons visible */
* {
        --collapse-button-offset: 1.5rem;
}
.mod-top-left-space .workspace-tab-header-container {
        margin-left: var(--collapse-button-offset) !important;
}

/*
 * formatted text
 */

/* remove styling from callouts */
.callout * {
        font-weight: normal !important;
}

/* make hyperlinks look like normal text */
.markdown-preview-view .external-link,
.markdown-source-view .cm-underline,
.markdown-source-view .cm-link,
.markdown-source-view .cm-url {
        font-weight: normal !important;
        color: initial !important;
        text-decoration: none !important;
}
/* make urls grey */
.markdown-preview-view a.external-link:not([aria-label]),
.markdown-source-view .cm-url,
.markdown-source-view .cm-url span,
.markdown-source-view .cm-underline {
        color: var(--color-base-40) !important;
}

/* add color to italic text */
.cm-em,
em {
        color: var(--color-purple) !important;
}

/* turn bold text to underlined text */
.cm-strong,
strong {
        font-weight: normal !important;
        text-decoration: underline var(--color-accent) !important;
        text-underline-offset: 0.3rem !important;
        text-decoration-thickness: 1px !important;
}

/* make highlighted text more readable by lowering background opacity */
.cm-highlight,
mark {
        background-color: rgba(var(--color-yellow-rgb), 0.2) !important;
}

/*
 * lists
 */

* {
        --enum-spacing: 0.3rem;
}
/* write mode: move bullet point further away */
.markdown-source-view .list-bullet {
        margin-right: 0.5rem !important;
}
/* same look in read and write mode */
.markdown-preview-view li,
.markdown-source-view .HyperMD-list-line {
        padding-top: var(--enum-spacing) !important;
        padding-bottom: var(--enum-spacing) !important;
}
/* paragraphs before lists */
.markdown-preview-view p:has(+ ol),
.markdown-preview-view p:has(+ ul) {
        margin-bottom: 0rem !important;
}
/* nested lists */
.markdown-preview-view li > ol > li:first-child,
.markdown-preview-view li > ul > li:first-child {
        padding-top: calc(var(--enum-spacing) * 2.5) !important;
}
.markdown-preview-view ul li ol {
        margin-top: calc(-1rem + var(--enum-spacing)) !important;
}

.markdown-preview-view li > ol {
        padding-left: calc(1rem + var(--enum-spacing)) !important;
}
.markdown-preview-view li > ol > li {
        padding-top: 0rem !important;
        padding-bottom: 0rem !important;
}
.markdown-preview-view li > ol > li::marker {
        font-weight: normal !important;
        color: initial !important;
        text-decoration: none !important;
}

/*
 * headers
 */

/* add space above all headers */
* {
        --spacing-level-1: 3rem;
        --spacing-level-2: 2rem;
        --spacing-level-3: 2rem;
        --spacing-level-4: 2rem;
        --spacing-level-5: 2rem;
        --spacing-level-6: 2rem;
        /* --header-color: rgba(var(--color-purple-rgb), 0.6); */
}
.markdown-preview-view h1,
.markdown-source-view .HyperMD-header-1 {
        padding-top: var(--spacing-level-1) !important;
}
.markdown-preview-view h2,
.markdown-source-view .HyperMD-header-2 {
        font-style: italic !important;
        color: var(--header-color) !important;
        padding-top: var(--spacing-level-2) !important;
}
.markdown-preview-view h3,
.markdown-source-view .HyperMD-header-3 {
        font-style: italic !important;
        color: var(--header-color) !important;
        padding-top: var(--spacing-level-3) !important;
}
.markdown-preview-view h4,
.markdown-source-view .HyperMD-header-4 {
        font-style: italic !important;
        color: var(--header-color) !important;
        padding-top: var(--spacing-level-4) !important;
}
.markdown-preview-view h5,
.markdown-source-view .HyperMD-header-5 {
        font-style: italic !important;
        color: var(--header-color) !important;
        padding-top: var(--spacing-level-5) !important;
}
.markdown-preview-view h6,
.markdown-source-view .HyperMD-header-6 {
        font-style: italic !important;
        color: var(--header-color) !important;
        padding-top: var(--spacing-level-6) !important;
}