diff options
| author | martial.simon <martial.simon@epita.fr> | 2025-04-13 19:54:19 +0200 |
|---|---|---|
| committer | martial.simon <martial.simon@epita.fr> | 2025-04-13 19:54:19 +0200 |
| commit | 66c3bbfa94d8a41e58adf154be25e6d86fee8e30 (patch) | |
| tree | 9c5e998f324f2f60c1717759144da3f996c5ae1a /.obsidian/themes/80s Neon/theme.css | |
init: initial commit
Diffstat (limited to '.obsidian/themes/80s Neon/theme.css')
| -rwxr-xr-x | .obsidian/themes/80s Neon/theme.css | 491 |
1 files changed, 491 insertions, 0 deletions
diff --git a/.obsidian/themes/80s Neon/theme.css b/.obsidian/themes/80s Neon/theme.css new file mode 100755 index 0000000..532f33f --- /dev/null +++ b/.obsidian/themes/80s Neon/theme.css @@ -0,0 +1,491 @@ +/***** Table of Contents ****/ +/* 1. Colours +/* 2. General UI +/* 2.1. Title bar +/* 3. Editor and preview +/* 3.1. Headers +/* 3.2. Formatting operators +/* 3.3. External links +/* 3.4. Internal links +/* 3.5. blockquotes, embeds, tables +/* 3.6. Code +/* 3.7. Strikethrough +/* 3.8. Escape chars +/* 3.9. Bullets and numbering +/* 3.9.1. Bullet lists +/* 3.9.2. Numbered lists +/* 3.9.3. Task lists +/* 4. Graph view +/* 5. Misc Fixes +/* 5.1. Fixes for highlight +/* 5.2. fixes for buttons +/* 6. BONUS! CRT Scanlines and flicker +/* 6.1. Pentile effect (chunky pixels) +/* 6.2. Screen flicker +/* 6.3. Text blur effect + +/* 1. Colours! Overriding both themes */ +.theme-dark, +.theme-light { + --accent-1: #FF00FF; + --accent-2: #00FFFF; + --accent-3: #00FF00; + --accent-4: #FFFF00; + --accent-5: #FF0000; + --accent-6: #0000FF; + + --accent-1-muted: #ff79c6; + --accent-2-muted: #8be9fd; + --accent-3-muted: #50fa7b; + --accent-4-muted: #ffb86c; + --accent-5-muted: #ff5555; + --accent-6-muted: #bd93f9; + + --background-primary: #2b213a; + --background-primary-alt: #171520; + --background-secondary: #1a1836; + --background-secondary-alt: #242043; + + --text-accent: #FF1690; + --text-accent-hover: #7a6ae6; + + --text-normal: var(--accent-1); + --text-muted: var(--accent-1-muted); + --text-faint: var(--accent-6-muted); + + --interactive-normal: var(--accent-2); + --interactive-hover: var(--accent-2-muted); + --interactive-accent: var(--accent-2); + --interactive-accent-hover: var(--accent-2-muted); + + --background-accent: #000; + --background-modifier-border: var(--accent-2); + + --text-highlight-bg: #ffd319; + + + /* obsidian dark defaults (overriding for light) */ + --text-selection: rgba(0, 122, 255, 0.2); + --text-on-accent: rgba(0, 0, 0, 0.8); + --interactive-accent-rgb: 72, 54, 153; + --scrollbar-active-thumb-bg: rgba(255, 255, 255, 0.2); + --scrollbar-bg: rgba(255, 255, 255, 0.05); + --scrollbar-thumb-bg: rgba(255, 255, 255, 0.1); +} + +/* 2. General UI */ +.side-dock-ribbon-tab, +.side-dock-ribbon-action { + color: var(--accent-6-muted); +} + +.workspace-leaf.mod-active .workspace-leaf-header-title { + color: var(--text-accent); +} + +/* 2.1. Title bar */ +.titlebar { + background-color: var(--background-secondary-alt); +} + +.titlebar-inner { + color: var(--text-faint); +} + +.titlebar-inner { + color: var(--text-faint); +} + +.titlebar-button { + opacity: 1; +} + +.titlebar-button:hover { + color: var(--text-muted); +} + +.titlebar-button.mod-close:hover { + background-color: var(--accent-5); + color: var(--accent-2); +} + +/* 3. Editor and preview */ +.cm-s-obsidian, +.markdown-preview-view { + --text-normal: rgba(255, 220, 255, 0.8); + --text-faint: rgba(255, 220, 255, 0.25); + --text-accent: var(--accent-2); + color: var(--text-normal); +} + +.CodeMirror-guttermarker-subtle { + color: var(--accent-1); +} + +/* 3.1. Headers */ +.cm-s-obsidian .cm-header, +h1, +h2, +h3, +h4, +h5, +h6 { + font-weight: 600; + overflow: visible; +} + +.cm-s-obsidian .cm-formatting-header { + font-weight: 300; +} + +.cm-header-1:not(.cm-formatting), +h1 { + text-shadow: 0 0 0.5em var(--accent-1); +} + +.cm-header-2:not(.cm-formatting), +h2 { + text-shadow: 0 0 0.5em var(--accent-2); +} + +.cm-header-3:not(.cm-formatting), +h3 { + text-shadow: 0 0 0.5em var(--accent-3); +} + +.cm-header-4:not(.cm-formatting), +h4 { + text-shadow: 0 0 0.5em var(--accent-4); +} + +.cm-header-5:not(.cm-formatting), +h5 { + text-shadow: 0 0 0.5em var(--accent-5); +} + +.cm-header-6:not(.cm-formatting), +h6 { + text-shadow: 0 0 0.5em var(--accent-6); +} + +/* 3.2. Formatting operators */ +.cm-s-obsidian .cm-formatting, +.cm-s-obsidian span.cm-formatting-link, +.cm-s-obsidian span.cm-formatting-link-string.cm-url, +.cm-s-obsidian span.cm-inline-code.cm-formatting-code, +.cm-s-obsidian span.cm-formatting-code, +.cm-s-obsidian span.cm-formatting-quote, +.cm-s-obsidian span.cm-hr, +.cm-s-obsidian pre.HyperMD-table-row span.cm-hmd-table-sep, +.cm-s-obsidian pre.HyperMD-table-row-1>span { + color: var(--accent-2); +} + +/* 3.3. External links */ +.cm-s-obsidian .cm-formatting-link+.cm-formatting-link-string+.cm-url, +.cm-s-obsidian .cm-string.cm-url, +.cm-s-obsidian span.cm-link:not(.cm-formatting), +.cm-s-obsidian span.cm-url, +a { + color: var(--accent-1-muted); +} + +/* 3.4. Internal links */ +.cm-s-obsidian span.cm-hashtag, +.cm-s-obsidian span.cm-hmd-internal-link, +a.internal-link, +a.tag { + color: var(--accent-1); +} + +/* 3.5. blockquotes, embeds, tables */ +.markdown-preview-view blockquote, +.markdown-preview-view .markdown-embed, +.markdown-preview-view .file-embed, +.markdown-preview-view th, +.markdown-preview-view td { + box-shadow: 0 0 0.25em var(--accent-2), + inset 0 0 0.25em var(--accent-2); +} + +.markdown-preview-view hr { + box-shadow: 0 0 0.5em var(--accent-2); +} + +/* 3.6. Code */ +.cm-s-obsidian span.cm-inline-code, +code { + color: var(--accent-1); +} + +.markdown-preview-view code { + color: var(--accent-1) +} + +.cm-s-obsidian pre.HyperMD-codeblock { + color: var(--accent-6-muted); +} + +pre code { + color: var(--text-normal); +} + +/* 3.7. Strikethrough */ +.cm-strikethrough, +s { + text-decoration-color: var(--accent-1); +} + +/* 3.8. Escape chars */ +.cm-s-obsidian span.cm-hmd-escape-backslash { + color: var(--text-faint); +} + +.cm-s-obsidian span.cm-hmd-escape-char { + color: var(--text-normal); +} + +/* 3.9. Bullets and numbering */ +.cm-s-obsidian span.cm-formatting-list, +.cm-s-obsidian span.cm-formatting-task { + color: var(--text-accent); +} + +.cm-s-obsidian span.cm-formatting-list { + font-weight: bold; +} + +/* 3.9.1. Bullet lists */ +ul { + list-style: none; +} + +li>p { + display: inline-block; + margin-top: 0; + margin-bottom: 0; +} + +ul li:not(.task-list-item)::before { + content: "•"; + /* 🤔 need to think of some better bullet chars */ + color: var(--accent-2); + display: inline-block; + width: 1em; + margin-left: -1em; + padding: 0; + font-weight: bold; + text-shadow: 0 0 0.5em var(--accent-2); +} + +ul ul li:not(.task-list-item)::before { + content: "◦" +} + +ul ul ul li:not(.task-list-item)::before { + content: "▪" +} + +/* 3.9.2. Numbered lists */ +ol { + list-style: none; + counter-reset: li +} + +ol>li { + counter-increment: li; +} + +ol>li:not(.task-list-item)::before, +ul ol>li:not(.task-list-item)::before, +ul ul ol>li:not(.task-list-item)::before, +ul ul ul ol>li:not(.task-list-item)::before { + content: counter(li) "."; + color: var(--accent-2); + font-weight: normal; + display: inline-block; + margin-left: -2.5em; + margin-right: 0.5em; + width: 2em; + text-align: right; + word-wrap: none; + overflow: visible; + word-break: keep-all; + text-shadow: 0 0 0.5em var(--accent-2); +} + +/* 3.9.3. Task lists! (I'm proud of this, but could use improvement) */ +.markdown-preview-view .task-list-item-checkbox { + -webkit-appearance: none; + box-sizing: border-box; + border: 1px solid var(--accent-2); + position: relative; + width: 1.25em; + height: 1.25em; + margin: 0; + margin-right: 0.5em; + box-shadow: 0 0 0.5em var(--accent-2); +} + +.markdown-preview-view .task-list-item-checkbox:checked::before { + content: '✓'; + position: absolute; + color: var(--accent-2); + font-size: 1em; + line-height: 1.25em; + width: 1.2em; + text-align: center; + text-shadow: 0 0 0.5em var(--accent-2); +} + +/* 4. Graph view */ +.graph-view.color-fill { + /* default */ +} + +.graph-view.color-fill-unresolved { + color: var(--accent-1); + opacity: 0.7; +} + +.graph-view.color-line { + /* color: var(--accent-2); + opacity: 0.5; */ + color: #2B8B98; +} + +.graph-view.color-arrow { + color: var(--accent-2); + opacity: 1; +} + +.graph-view.color-text { + color: rgba(255, 220, 255); +} + +.graph-view.color-fill-highlight { + /* default */ +} + +.graph-view.color-line-highlight { + /* default */ +} + +.theme-light .graph-view.color-fill-attachment, +.theme-dark .graph-view.color-fill-attachment { + color: var(--accent-6); +} + +.theme-dark .graph-view.color-fill-tag, +.theme-light .graph-view.color-fill-tag { + color: var(--accent-4); +} + +/* 5. Misc Fixes */ +/* 5.1. Fixes for highlight */ +.cm-s-obsidian span.cm-formatting-highlight, +.cm-s-obsidian span.cm-highlight, +.markdown-preview-view mark, +.search-result-file-matched-text { + color: var(--background-secondary); +} + +.cm-s-obsidian span.cm-formatting-highlight { + color: var(--accent-2); +} + +/* 5.2. fixes for buttons */ +button.mod-warning { + color: var(--text-normal); +} + +/* 6. BONUS! CRT Scanlines and flicker! + * It's not for everyone though, so it's disabled by default. + * simply remove the `/*` below a subsection to enable it **/ + +/* 6.1. Pentile effect (chunky pixels) */ +/* DELETE THIS LINE TO ENABLE +.app-container::before { + content: " "; + display: block; + position: absolute; + top: 0; + left: 0; + bottom: 0; + right: 0; + background: linear-gradient(rgba(18, 16, 16, 0) 50%, rgba(0, 0, 0, 0.25) 50%), linear-gradient(90deg, rgba(255, 0, 0, 0.06), rgba(0, 255, 0, 0.02), rgba(0, 0, 255, 0.06)); + z-index: 2; + background-size: 100% 2px, 3px 100%; + pointer-events: none; +} + +/* 6.2. Screen flicker */ +/* DELETE THIS LINE TO ENABLE +.app-container::after { + content: " "; + display: block; + position: absolute; + top: 0; + left: 0; + bottom: 0; + right: 0; + background: rgba(18, 16, 16, 0.1); + opacity: 0; + z-index: 2; + pointer-events: none; + animation: flicker 0.15s infinite; +} +@keyframes flicker { + 0% {opacity: 0.27861;} + 5% {opacity: 0.34769;} + 10% {opacity: 0.23604;} + 15% {opacity: 0.90626;} + 20% {opacity: 0.18128;} + 25% {opacity: 0.83891;} + 30% {opacity: 0.65583;} + 35% {opacity: 0.67807;} + 40% {opacity: 0.26559;} + 45% {opacity: 0.84693;} + 50% {opacity: 0.96019;} + 55% {opacity: 0.08594;} + 60% {opacity: 0.20313;} + 65% {opacity: 0.71988;} + 70% {opacity: 0.53455;} + 75% {opacity: 0.37288;} + 80% {opacity: 0.71428;} + 85% {opacity: 0.70419;} + 90% {opacity: 0.7003;} + 95% {opacity: 0.36108;} + 100% {opacity: 0.24387;} +} + +/* 6.3. Text blur effect */ +/* DELETE THIS LINE TO ENABLE +.app-container { + text-shadow: 0.08084290417898504px 0 1px rgba(0,30,255,0.5), -0.08084290417898504px 0 1px rgba(255,0,80,0.3), 0 0 3px; + animation: textShadow 1.6s infinite; +} +@keyframes textShadow { + 0% {text-shadow: 0.4389924193300864px 0 1px rgba(0,30,255,0.5), -0.4389924193300864px 0 1px rgba(255,0,80,0.3), 0 0 3px;} + 5% {text-shadow: 2.7928974010788217px 0 1px rgba(0,30,255,0.5), -2.7928974010788217px 0 1px rgba(255,0,80,0.3), 0 0 3px;} + 10% {text-shadow: 0.02956275843481219px 0 1px rgba(0,30,255,0.5), -0.02956275843481219px 0 1px rgba(255,0,80,0.3), 0 0 3px;} + 15% {text-shadow: 0.40218538552878136px 0 1px rgba(0,30,255,0.5), -0.40218538552878136px 0 1px rgba(255,0,80,0.3), 0 0 3px;} + 20% {text-shadow: 3.4794037899852017px 0 1px rgba(0,30,255,0.5), -3.4794037899852017px 0 1px rgba(255,0,80,0.3), 0 0 3px;} + 25% {text-shadow: 1.6125630401149584px 0 1px rgba(0,30,255,0.5), -1.6125630401149584px 0 1px rgba(255,0,80,0.3), 0 0 3px;} + 30% {text-shadow: 0.7015590085143956px 0 1px rgba(0,30,255,0.5), -0.7015590085143956px 0 1px rgba(255,0,80,0.3), 0 0 3px;} + 35% {text-shadow: 3.896914047650351px 0 1px rgba(0,30,255,0.5), -3.896914047650351px 0 1px rgba(255,0,80,0.3), 0 0 3px;} + 40% {text-shadow: 3.870905614848819px 0 1px rgba(0,30,255,0.5), -3.870905614848819px 0 1px rgba(255,0,80,0.3), 0 0 3px;} + 45% {text-shadow: 2.231056963361899px 0 1px rgba(0,30,255,0.5), -2.231056963361899px 0 1px rgba(255,0,80,0.3), 0 0 3px;} + 50% {text-shadow: 0.08084290417898504px 0 1px rgba(0,30,255,0.5), -0.08084290417898504px 0 1px rgba(255,0,80,0.3), 0 0 3px;} + 55% {text-shadow: 2.3758461067427543px 0 1px rgba(0,30,255,0.5), -2.3758461067427543px 0 1px rgba(255,0,80,0.3), 0 0 3px;} + 60% {text-shadow: 2.202193051050636px 0 1px rgba(0,30,255,0.5), -2.202193051050636px 0 1px rgba(255,0,80,0.3), 0 0 3px;} + 65% {text-shadow: 2.8638780614874975px 0 1px rgba(0,30,255,0.5), -2.8638780614874975px 0 1px rgba(255,0,80,0.3), 0 0 3px;} + 70% {text-shadow: 0.48874025155497314px 0 1px rgba(0,30,255,0.5), -0.48874025155497314px 0 1px rgba(255,0,80,0.3), 0 0 3px;} + 75% {text-shadow: 1.8948491305757957px 0 1px rgba(0,30,255,0.5), -1.8948491305757957px 0 1px rgba(255,0,80,0.3), 0 0 3px;} + 80% {text-shadow: 0.0833037308038857px 0 1px rgba(0,30,255,0.5), -0.0833037308038857px 0 1px rgba(255,0,80,0.3), 0 0 3px;} + 85% {text-shadow: 0.09769827255241735px 0 1px rgba(0,30,255,0.5), -0.09769827255241735px 0 1px rgba(255,0,80,0.3), 0 0 3px;} + 90% {text-shadow: 3.443339761481782px 0 1px rgba(0,30,255,0.5), -3.443339761481782px 0 1px rgba(255,0,80,0.3), 0 0 3px;} + 95% {text-shadow: 2.1841838852799786px 0 1px rgba(0,30,255,0.5), -2.1841838852799786px 0 1px rgba(255,0,80,0.3), 0 0 3px;} + 100% {text-shadow: 2.6208764473832513px 0 1px rgba(0,30,255,0.5), -2.6208764473832513px 0 1px rgba(255,0,80,0.3), 0 0 3px;} +} +/**/
\ No newline at end of file |
