146 lines
3.8 KiB
CSS
146 lines
3.8 KiB
CSS
:root {
|
|
/* Rose Pine Color Palette - Updated from .pinkrose class */
|
|
--base: #191724; /* sidebar-bg */
|
|
--surface: #1f1d2e; /* bg */
|
|
--overlay: #26233a; /* theme-popup-bg */
|
|
--muted: #6e6a86; /* theme-popup-border */
|
|
--subtle: #908caa; /* sidebar-fg */
|
|
--text: #e0def4; /* fg */
|
|
--love: #eb6f92; /* sidebar-active */
|
|
--gold: #f6c177; /* links */
|
|
--rose: #ebbcba; /* inline-code-color */
|
|
--pine: #31748f; /* icons */
|
|
--foam: #9ccfd8; /* icons-hover (no direct match, using closest) */
|
|
--iris: #c4a7e7; /* icons-hover */
|
|
--highlight-low: #21202e; /* theme-hover */
|
|
--highlight-med: #403d52; /* sidebar-spacer */
|
|
--highlight-high: #524f67; /* sidebar-non-existant */
|
|
}
|
|
|
|
.theme-dark {
|
|
/* Adapted Theme Colors */
|
|
--background-primary: var(--base);
|
|
--background-secondary: var(--surface);
|
|
--background-modifier-border: var(--overlay);
|
|
--text-normal: var(--text);
|
|
--text-muted: var(--muted);
|
|
--text-accent: var(--love);
|
|
--text-accent-hover: var(--foam);
|
|
--tag-color: var(--iris);
|
|
--tag-background: var(--overlay);
|
|
--h1-color: var(--love);
|
|
--h2-color: var(--gold);
|
|
--h3-color: var(--pine);
|
|
--h4-color: var(--foam);
|
|
--h5-color: var(--iris);
|
|
--h6-color: var(--rose);
|
|
--code-normal: var(--subtle);
|
|
--code-background: var(--highlight-low);
|
|
--text-selection: rgba(49, 116, 143, 0.6); /* --pine */
|
|
--flashing-background: rgba(235, 111, 146, 0.3); /* --love */
|
|
--link-url: var(--pine);
|
|
--link-url-hover: var(--iris);
|
|
--bold-color: var(--subtle);
|
|
}
|
|
|
|
body {
|
|
background-color: var(--base);
|
|
color: var(--text);
|
|
}
|
|
|
|
/* Headings */
|
|
h1 { color: var(--h1-color); }
|
|
h2 { color: var(--h2-color); }
|
|
h3 { color: var(--h3-color); }
|
|
h4 { color: var(--h4-color); }
|
|
h5 { color: var(--h5-color); }
|
|
h6 { color: var(--h6-color); }
|
|
|
|
/* Links */
|
|
a {
|
|
color: var(--link-url);
|
|
text-decoration: var(--link-decoration);
|
|
}
|
|
a:hover {
|
|
color: var(--link-url-hover);
|
|
text-decoration: var(--link-decoration-hover);
|
|
}
|
|
|
|
|
|
/* Tags */
|
|
.tag {
|
|
color: var(--tag-color);
|
|
background-color: var(--tag-background);
|
|
padding: var(--tag-padding-y) var(--tag-padding-x);
|
|
border-radius: var(--tag-radius);
|
|
}
|
|
.tag:hover {
|
|
text-decoration: var(--tag-decoration-hover);
|
|
}
|
|
|
|
/* Tables */
|
|
table {
|
|
border: 1px solid var(--background-secondary);
|
|
border-collapse: collapse;
|
|
}
|
|
thead {
|
|
border-bottom: 2px solid var(--background-modifier-border);
|
|
}
|
|
th {
|
|
font-weight: var(--bold-weight);
|
|
border: 1px solid var(--background-secondary);
|
|
}
|
|
td {
|
|
border: 1px solid var(--background-secondary);
|
|
}
|
|
.markdown-rendered tbody tr:nth-child(even) {
|
|
background-color: var(--table-row-even-background);
|
|
}
|
|
.markdown-rendered tbody tr:nth-child(odd) {
|
|
background-color: var(--table-row-odd-background);
|
|
}
|
|
.markdown-rendered tbody tr:hover {
|
|
background-color: var(--table-row-background-hover);
|
|
}
|
|
|
|
/* Highlights */
|
|
.markdown-rendered mark {
|
|
background-color: var(--text-highlight-bg);
|
|
color: var(--text-highlight-fg);
|
|
}
|
|
.markdown-rendered mark a {
|
|
color: var(--rose);
|
|
font-weight: var(--bold-weight);
|
|
}
|
|
|
|
/* Checkboxes */
|
|
input[type=checkbox] {
|
|
border: 1px solid var(--checkbox-border-color);
|
|
}
|
|
input[type=checkbox]:checked {
|
|
background-color: var(--checkbox-color);
|
|
box-shadow: inset 0 0 0 2px var(--background-primary);
|
|
}
|
|
input[type=checkbox]:checked:after {
|
|
display: none;
|
|
}
|
|
|
|
/* Code Blocks */
|
|
code[class*="language-"], pre[class*="language-"] {
|
|
line-height: var(--line-height-tight);
|
|
background-color: var(--code-background);
|
|
color
|
|
|
|
.cm-line .cm-strong
|
|
{
|
|
color: var(--bold-color) !important;
|
|
}
|
|
|
|
/* ::selection */
|
|
/* { */
|
|
/* background-color: var(--text-selection) !important; */
|
|
/* } */
|
|
|
|
/* .CodeMirror-selected {background:red !important;} */
|
|
|