687 lines
16 KiB
CSS
687 lines
16 KiB
CSS
/* latin */
|
|
@font-face {
|
|
font-family: 'Jomhuria';
|
|
font-style: normal;
|
|
font-weight: 400;
|
|
font-display: swap;
|
|
src: url(https://fonts.gstatic.com/s/jomhuria/v9/Dxxp8j-TMXf-llKur1byOuA.woff2) format('woff2');
|
|
unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
|
|
}
|
|
/* latin */
|
|
@font-face {
|
|
font-family: 'Source Sans Pro';
|
|
font-style: normal;
|
|
font-weight: 300;
|
|
font-display: swap;
|
|
src: url(https://fonts.gstatic.com/s/sourcesanspro/v14/6xKydSBYKcSV-LCoeQqfX1RYOo3ik4zwlxdu.woff2) format('woff2');
|
|
unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
|
|
}
|
|
/* latin */
|
|
@font-face {
|
|
font-family: 'Source Sans Pro';
|
|
font-style: italic;
|
|
font-weight: 300;
|
|
font-display: swap;
|
|
src: url(https://fonts.gstatic.com/s/sourcesanspro/v14/6xKwdSBYKcSV-LCoeQqfX1RYOo3qPZZMkids18Q.woff2) format('woff2');
|
|
unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
|
|
}
|
|
|
|
/* latin */
|
|
@font-face {
|
|
font-family: 'Source Sans Pro';
|
|
font-style: normal;
|
|
font-weight: 700;
|
|
font-display: swap;
|
|
src: url(https://fonts.gstatic.com/s/sourcesanspro/v14/6xKydSBYKcSV-LCoeQqfX1RYOo3ig4vwlxdu.woff2) format('woff2');
|
|
unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
|
|
}
|
|
/* latin */
|
|
@font-face {
|
|
font-family: 'Source Sans Pro';
|
|
font-style: italic;
|
|
font-weight: 700;
|
|
font-display: swap;
|
|
src: url(https://fonts.gstatic.com/s/sourcesanspro/v14/6xKwdSBYKcSV-LCoeQqfX1RYOo3qPZZclSds18Q.woff2) format('woff2');
|
|
unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
|
|
}
|
|
|
|
|
|
|
|
:root
|
|
{
|
|
--dark0: hsl(219, 38%, 21%);
|
|
--dark1: hsl(219, 37%, 36%);
|
|
--dark2: hsl(220, 22%, 51%);
|
|
--dark3: hsl(221, 22%, 55%);
|
|
|
|
--light0: #d8dee9;
|
|
--light1: #e5e9f0;
|
|
--light2: #eceff4;
|
|
--light3: #ffffff;
|
|
|
|
--frost0: #8fbcbb;
|
|
--frost1: #88c0d0;
|
|
--frost2: #81a1c1;
|
|
--frost3: #5e81ac;
|
|
|
|
--bloddish48: hsl(203, 27%, 48%);
|
|
--bloddish64: hsl(204, 24%, 64%);
|
|
|
|
--red53: hsl(355, 35%, 53%);
|
|
--red: hsl(352, 56%, 62%);
|
|
--orange: #d08770;
|
|
--yellow54: hsl(30, 55%, 54%);
|
|
--yellow59: hsl(24, 33%, 59%);
|
|
--yellow: hsl(27, 49%, 68%);
|
|
--yellow75: hsl(19, 38%, 75%);
|
|
--green: #a3be8c;
|
|
--groddish: hsl(107, 39%, 43%);
|
|
--purple: #b48ead;
|
|
|
|
--font-default: 'Source Sans Pro', 'Segoe UI Emoji', sans-serif;
|
|
--font-title: 'Jomhuria', serif;
|
|
--font-headings: var(--font-default);
|
|
--font-monospace: 'Hack Nerd Font', 'Source Code Pro', monospace;
|
|
}
|
|
|
|
body {
|
|
--h1-size: 4.6em;
|
|
--h2-size: 2.07em;
|
|
--h3-size: 1.73em;
|
|
--h4-size: 1.44em;
|
|
--h5-size: 1.2em;
|
|
--h6-size: 1.2em;
|
|
}
|
|
|
|
.theme-dark
|
|
{
|
|
--background-primary: var(--dark0);
|
|
--background-primary-alt: var(--dark0);
|
|
--background-secondary: var(--dark1);
|
|
--background-secondary-alt: var(--dark2);
|
|
--text-normal: var(--light2);
|
|
--text-faint: var(--light0);
|
|
--text-muted: var(--light1);
|
|
--text-title-h1: var(--red);
|
|
--text-title-h2: var(--orange);
|
|
--text-title-h3: var(--yellow);
|
|
--text-title-h4: var(--green);
|
|
--text-title-h5: var(--bloddish64);
|
|
--text-title-h6: var(--purple);
|
|
--text-link: var(--frost0);
|
|
--text-a: var(--yellow);
|
|
--text-a-hover: var(--yellow);
|
|
--text-mark: var(--red);
|
|
--pre-code: var(--dark1);
|
|
--text-highlight-bg: var(--dark3);
|
|
--interactive-accent: var(--yellow59);
|
|
--interactive-accent-hover: var(--red);
|
|
--interactive-hover: var(--dark0);
|
|
--interactive-before: var(--dark3);
|
|
--background-modifier-border: var(--dark2);
|
|
--text-accent: var(--orange);
|
|
--interactive-accent-rgb: var(--orange);
|
|
--inline-code: var(--frost1);
|
|
--code-block: var(--frost1);
|
|
--vim-cursor: var(--orange);
|
|
--text-selection: var(--red53); /* Annoying - affects both Edit and Preview, but Preview has translucency */
|
|
--opacity-translucency: 0.9;
|
|
}
|
|
.theme-light
|
|
{
|
|
--background-primary: var(--light3);
|
|
--background-primary-alt: var(--light3);
|
|
--background-secondary: var(--light2);
|
|
--background-secondary-alt: var(--light1);
|
|
--text-normal: var(--dark1);
|
|
--text-faint: var(--dark3);
|
|
--text-muted: var(--dark2);
|
|
--text-title-h1: var(--red);
|
|
--text-title-h2: var(--orange);
|
|
--text-title-h3: var(--yellow);
|
|
--text-title-h4: var(--green);
|
|
--text-title-h5: var(--purple);
|
|
--text-link: var(--frost0);
|
|
--text-a: var(--frost3);
|
|
--text-a-hover: var(--frost1);
|
|
--text-mark: rgba(136, 192, 208, 0.3); /* frost1 */
|
|
--pre-code: var(--light2);
|
|
--text-highlight-bg: var(--light0);
|
|
--interactive-accent: var(--frost0);
|
|
--interactive-before: var(--light0);
|
|
--background-modifier-border: var(--light1);
|
|
--text-accent: var(--orange);
|
|
--interactive-accent-rgb: var(--orange);
|
|
--inline-code: var(--frost1);
|
|
--code-block: var(--frost1);
|
|
--vim-cursor: var(--orange);
|
|
--text-selection: var(--light0);
|
|
--opacity-translucency: 1;
|
|
}
|
|
|
|
.theme-dark code[class*="language-"],
|
|
.theme-dark pre[class*="language-"],
|
|
.theme-light code[class*="language-"],
|
|
.theme-light pre[class*="language-"]
|
|
{
|
|
text-shadow: none !important;
|
|
background-color: var(--pre-code) !important;
|
|
}
|
|
|
|
|
|
|
|
html,
|
|
body
|
|
{
|
|
font-family: var(--font-default);
|
|
font-size: 16px !important;
|
|
font-weight: 300;
|
|
}
|
|
|
|
strong
|
|
{
|
|
font-weight: 700 !important;
|
|
}
|
|
|
|
a,
|
|
.cm-hmd-internal-link
|
|
{
|
|
color: var(--text-a);
|
|
text-decoration: none !important;
|
|
}
|
|
|
|
a:hover,
|
|
.cm-hmd-internal-link:hover,
|
|
.cm-url
|
|
{
|
|
color: var(--text-a-hover);
|
|
text-decoration: underline !important;
|
|
}
|
|
|
|
.view-actions a
|
|
{
|
|
color: var(--text-normal) !important;
|
|
}
|
|
|
|
.view-actions a:hover
|
|
{
|
|
color: var(--text-a) !important;
|
|
}
|
|
|
|
.HyperMD-codeblock-bg
|
|
{
|
|
background-color: var(--pre-code) !important;
|
|
}
|
|
|
|
.HyperMD-codeblock
|
|
{
|
|
line-height: 1.4em !important;
|
|
color: var(--code-block) !important;
|
|
}
|
|
|
|
.HyperMD-codeblock-begin
|
|
{
|
|
border-top-left-radius: 4px !important;
|
|
border-top-right-radius: 4px !important;
|
|
}
|
|
|
|
.HyperMD-codeblock-end
|
|
{
|
|
border-bottom-left-radius: 4px !important;
|
|
border-bottom-right-radius: 4px !important;
|
|
}
|
|
|
|
th
|
|
{
|
|
font-weight: 600 !important;
|
|
}
|
|
|
|
thead
|
|
{
|
|
border-bottom: 2px solid var(--background-modifier-border) !important;
|
|
}
|
|
|
|
.HyperMD-table-row
|
|
{
|
|
line-height: normal !important;
|
|
padding-left: 4px !important;
|
|
padding-right: 4px !important;
|
|
/* background-color: var(--pre-code) !important; */
|
|
}
|
|
|
|
.HyperMD-table-row-0
|
|
{
|
|
/* padding-top: 4px !important; */
|
|
}
|
|
|
|
.CodeMirror-foldgutter-folded,
|
|
.is-collapsed .nav-folder-collapse-indicator
|
|
{
|
|
color: var(--text-a) !important;
|
|
}
|
|
|
|
.nav-file-tag
|
|
{
|
|
color: var(--text-a) !important;
|
|
}
|
|
|
|
.is-active .nav-file-title
|
|
{
|
|
color: var(--text-a) !important;
|
|
background-color: var(--background-primary-alt) !important;
|
|
}
|
|
|
|
.nav-file-title
|
|
{
|
|
border-bottom-left-radius: 0 !important;
|
|
border-bottom-right-radius: 0 !important;
|
|
border-top-left-radius: 0 !important;
|
|
border-top-right-radius: 0 !important;
|
|
}
|
|
|
|
|
|
.HyperMD-list-line
|
|
{
|
|
padding-top: 0 !important;
|
|
}
|
|
|
|
.CodeMirror-linenumber
|
|
{
|
|
font-family: var(--font-monospace);
|
|
color: var(--frost2);
|
|
}
|
|
|
|
.markdown-preview-section pre code,
|
|
.markdown-preview-section code
|
|
{
|
|
font-size: 0.9em !important;
|
|
background-color: var(--pre-code) !important;
|
|
}
|
|
|
|
.markdown-preview-section pre code
|
|
{
|
|
padding: 4px !important;
|
|
line-height: 1.4em !important;
|
|
display: block !important;
|
|
color: var(--code-block) !important;
|
|
}
|
|
|
|
.markdown-preview-section code
|
|
{
|
|
color: var(--inline-code) !important;
|
|
}
|
|
|
|
.cm-s-obsidian,
|
|
.cm-inline-code
|
|
{
|
|
-webkit-font-smoothing: auto !important;
|
|
}
|
|
|
|
.cm-inline-code
|
|
{
|
|
color: var(--inline-code) !important;
|
|
background-color: var(--pre-code) !important;
|
|
padding: 1px !important;
|
|
}
|
|
|
|
.workspace-leaf-header-title
|
|
{
|
|
font-weight: 600 !important;
|
|
}
|
|
|
|
.side-dock-title
|
|
{
|
|
padding-top: 15px !important;
|
|
font-size: 20px !important;
|
|
}
|
|
|
|
.side-dock-ribbon-tab:hover,
|
|
.side-dock-ribbon-action:hover,
|
|
.side-dock-ribbon-action.is-active:hover,
|
|
.nav-action-button:hover,
|
|
.side-dock-collapse-btn:hover
|
|
{
|
|
color: var(--text-a);
|
|
}
|
|
|
|
.side-dock
|
|
{
|
|
border-right: 0 !important;
|
|
}
|
|
|
|
.cm-s-obsidian,
|
|
.markdown-preview-view
|
|
{
|
|
/* padding-left: 10px !important; */
|
|
padding-right: 10px !important;
|
|
}
|
|
|
|
/* vertical resize-handle */
|
|
.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
|
|
{
|
|
width: 1px !important;
|
|
background-color: var(--background-secondary-alt);
|
|
}
|
|
|
|
/* horizontal resize-handle */
|
|
.workspace-split.mod-horizontal > * > .workspace-leaf-resize-handle
|
|
{
|
|
height: 1px !important;
|
|
background-color: var(--background-secondary-alt);
|
|
}
|
|
|
|
/* Remove vertical split padding */
|
|
.workspace-split.mod-root .workspace-split.mod-vertical .workspace-leaf-content,
|
|
.workspace-split.mod-vertical > .workspace-split,
|
|
.workspace-split.mod-vertical > .workspace-leaf,
|
|
.workspace-tabs
|
|
{
|
|
padding-right: 0px;
|
|
}
|
|
|
|
.markdown-embed-title
|
|
{
|
|
font-weight: 600 !important;
|
|
}
|
|
|
|
.markdown-embed
|
|
{
|
|
padding-left: 10px !important;
|
|
padding-right: 10px !important;
|
|
margin-left: 10px !important;
|
|
margin-right: 10px !important;
|
|
}
|
|
|
|
|
|
.cm-header-1.cm-header-1,
|
|
.markdown-preview-section.markdown-preview-section h1 {
|
|
font-family: var(--font-title);
|
|
font-weight: 400;
|
|
text-shadow: 1px 1px rgba(0,0,0,0.05),
|
|
2px 2px rgba(0,0,0,0.05),
|
|
3px 3px rgba(0,0,0,0.05),
|
|
4px 4px rgba(0,0,0,0.05),
|
|
5px 5px rgba(0,0,0,0.05),
|
|
6px 6px rgba(0,0,0,0.05),
|
|
7px 7px rgba(0,0,0,0.05),
|
|
8px 8px rgba(0,0,0,0.05),
|
|
9px 9px rgba(0,0,0,0.05)
|
|
}
|
|
.theme-light .cm-header-1.cm-header-1,
|
|
.theme-light .markdown-preview-section.markdown-preview-section h1 {
|
|
text-shadow: 1px 1px rgba(0,0,0,0.02),
|
|
2px 2px rgba(0,0,0,0.02),
|
|
3px 3px rgba(0,0,0,0.02),
|
|
4px 4px rgba(0,0,0,0.02),
|
|
5px 5px rgba(0,0,0,0.02),
|
|
6px 6px rgba(0,0,0,0.02),
|
|
7px 7px rgba(0,0,0,0.02),
|
|
8px 8px rgba(0,0,0,0.02),
|
|
9px 9px rgba(0,0,0,0.02)
|
|
}
|
|
|
|
.markdown-preview-section.markdown-preview-section h1 {
|
|
text-align: center;
|
|
}
|
|
|
|
.markdown-preview-section h2,
|
|
.markdown-preview-section.markdown-preview-section h2,
|
|
.markdown-preview-section.markdown-preview-section h3,
|
|
.markdown-preview-section.markdown-preview-section h4,
|
|
.markdown-preview-section.markdown-preview-section h5,
|
|
.markdown-preview-section.markdown-preview-section h6
|
|
{
|
|
font-family: var(--font-headings);
|
|
font-weight: 600;
|
|
}
|
|
|
|
/* @settings
|
|
|
|
name: Vileplume settings
|
|
id: vileplume-settings
|
|
settings:
|
|
-
|
|
id: h1-size
|
|
title: Title size
|
|
description: Font size of your level 1 headings (#), in ems
|
|
type: variable-number
|
|
default: 3
|
|
format: em
|
|
|
|
*/
|
|
|
|
.cm-header-1.cm-header-1,
|
|
.markdown-preview-section.markdown-preview-section h1
|
|
{
|
|
color: var(--text-title-h1);
|
|
line-height: 0.75;
|
|
}
|
|
|
|
.cm-header-2,
|
|
.markdown-preview-section h2
|
|
{
|
|
color: var(--text-title-h2);
|
|
}
|
|
|
|
.cm-header-3,
|
|
.markdown-preview-section h3
|
|
{
|
|
color: var(--text-title-h3);
|
|
}
|
|
|
|
.cm-header-4,
|
|
.markdown-preview-section h4
|
|
{
|
|
color: var(--text-title-h4);
|
|
}
|
|
|
|
.cm-header-5,
|
|
.markdown-preview-section h5
|
|
{
|
|
color: var(--text-title-h5);
|
|
}
|
|
|
|
.cm-header-6,
|
|
.markdown-preview-section h6
|
|
{
|
|
color: var(--text-title-h6);
|
|
}
|
|
|
|
.suggestion-item.is-selected
|
|
{
|
|
background-color: var(--background-secondary);
|
|
}
|
|
|
|
.empty-state-container:hover
|
|
{
|
|
background-color: var(--background-secondary-alt);
|
|
border: 5px solid var(--interactive-accent) !important;
|
|
}
|
|
|
|
.checkbox-container
|
|
{
|
|
background-color: var(--interactive-before);
|
|
}
|
|
|
|
.mod-cta
|
|
{
|
|
/* color: var(--background-secondary-alt) !important; */
|
|
font-weight: 600 !important;
|
|
}
|
|
|
|
.mod-cta:hover
|
|
{
|
|
background-color: var(--interactive-before) !important;
|
|
font-weight: 600 !important;
|
|
}
|
|
|
|
.CodeMirror-cursor
|
|
{
|
|
background-color: var(--vim-cursor) !important;
|
|
opacity: 60% !important;
|
|
}
|
|
|
|
input.task-list-item-checkbox {
|
|
border: 1px solid var(--frost3);
|
|
appearance: none;
|
|
-webkit-appearance: none;
|
|
}
|
|
|
|
input.task-list-item-checkbox:checked {
|
|
background-color: var(--frost2);
|
|
box-shadow: inset 0 0 0 2px var(--background-primary);
|
|
}
|
|
|
|
.mermaid .note
|
|
{
|
|
fill: var(--frost3) !important;
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
/****************************************************************************
|
|
BEGIN - My code! 😀
|
|
****************************************************************************/
|
|
|
|
.heading-collapse-indicator svg {
|
|
background: url('https://cdn.discordapp.com/attachments/560318304472793114/808721915627307058/lets_go_arrow.png');
|
|
background-size: contain;
|
|
width:12px;
|
|
height: 12px;
|
|
}
|
|
|
|
::-webkit-scrollbar {
|
|
background-color: transparent;
|
|
}
|
|
::-webkit-scrollbar-thumb {
|
|
background-color: var(--dark3);
|
|
}
|
|
|
|
/* There's no current good way to select an image that is alone, and NOT style images that are inline */
|
|
/* span:only-child img {
|
|
display: block;
|
|
margin: 0 auto;
|
|
} */
|
|
|
|
.view-header {
|
|
border-bottom-width: 0;
|
|
box-shadow: 0 5px 5px rgba(0,0,0,0.1), 0 10px 5px rgba(0,0,0,0.1);
|
|
}
|
|
|
|
.nav-buttons-container {
|
|
justify-content: space-between;
|
|
}
|
|
|
|
.cm-hashtag {
|
|
--tag-color: white;
|
|
background-color: var(--yellow59);
|
|
border: 1px solid rgba(255,255,255,0.3);
|
|
box-shadow: 10px 10px 30px rgba(0,0,0,0.2);
|
|
}
|
|
|
|
.cm-hashtag-begin {
|
|
border-radius: 1em 0 0;
|
|
}
|
|
.cm-hashtag-end {
|
|
border-radius: 0 0 1em
|
|
}
|
|
|
|
a.tag {
|
|
--tag-color: white;
|
|
background-color: var(--yellow59);
|
|
box-shadow: inset 0px 0px 1px rgba(255,255,255,0.5), 10px 10px 30px rgba(0,0,0,0.2);
|
|
white-space: nowrap;
|
|
display: inline-block;
|
|
}
|
|
|
|
a.tag:hover {
|
|
color: var(--tag-color);
|
|
background-color: var(--yellow);
|
|
transition: transform 0.3s cubic-bezier(0.33, 1, 0.68, 1);
|
|
text-decoration: none !important;
|
|
}
|
|
|
|
.dropdown {
|
|
background-image: url('https://cdn.discordapp.com/attachments/560318304472793114/808721915627307058/lets_go_arrow.png')
|
|
}
|
|
|
|
/* Triple class selector, to avoid using !important */
|
|
.cm-highlight.cm-highlight.cm-highlight,
|
|
.markdown-preview-view mark {
|
|
background-color: var(--text-mark);
|
|
}
|
|
|
|
.markdown-preview-view blockquote {
|
|
border-radius: 10px;
|
|
border: 1px solid rgba(255,255,255,0.03);
|
|
padding: 10px 20px;
|
|
position: relative;
|
|
box-shadow: -10px -10px 30px rgba(255,255,255,0.05), 10px 10px 30px rgba(0,0,0,0.2);
|
|
background-color: rgba(255,255,255,0.01);
|
|
}
|
|
|
|
.markdown-preview-view blockquote::before {
|
|
content: "\201C";
|
|
position: absolute;
|
|
font-size: 3em;
|
|
top: 0.3em;
|
|
left: -0.15em;
|
|
}
|
|
|
|
/* GRAPH VIEW */
|
|
.theme-dark .graph-view.color-fill {
|
|
color: white;
|
|
}
|
|
|
|
.theme-dark.graph-view.color-fill-highlight,
|
|
.theme-dark.graph-view.color-line-highlight
|
|
{
|
|
color: var(--interactive-accent-rgb);
|
|
}
|
|
.graph-view.color-text
|
|
{
|
|
color: var(--text-a-hover);
|
|
}
|
|
/*
|
|
.graph-view.color-line
|
|
{
|
|
color: var(--background-modifier-border);
|
|
}
|
|
*/
|
|
.theme-light .graph-view.color-fill
|
|
{
|
|
color: var(--background-secondary);
|
|
}
|
|
.graph-view.color-fill-highlight {
|
|
color: var(--interactive-accent);
|
|
}
|
|
.graph-view.color-circle-highlight {
|
|
color: var(--text-normal);
|
|
}
|
|
|
|
.theme-dark .graph-view.color-fill-tag {
|
|
color: var(--yellow);
|
|
}
|
|
|
|
.theme-dark .graph-view.color-fill-attachment {
|
|
color: var(--red);
|
|
}
|
|
|
|
.theme-dark .graph-view.color-fill-unresolved {
|
|
color: var(--bloddish64);
|
|
}
|
|
/* END GRAPH VIEW */
|
|
|
|
.status-bar {
|
|
position: absolute;
|
|
bottom: 0;
|
|
right: 0;
|
|
padding: 0;
|
|
border-radius: 5px 0 0 0;
|
|
box-shadow: 0 0 3px rgba(0,0,0,0.4);
|
|
}
|