Last active
June 27, 2023 06:26
-
-
Save ronaldsuwandi/7c8cf31040c8ef476c0040ac4a0e7304 to your computer and use it in GitHub Desktop.
Minor css snippet tweaks for Obsidian Minimal theme (dim non-focused pane, highlight sync icon). Works for Obsidian 1.2.8 (requires Electron v21 - Chrome 105+)
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
/* better contrast for status-bar */ | |
.status-bar{ | |
color: var(--tx2); | |
} | |
/* better contrast for status bar (sync button) */ | |
:is(.theme-light, .theme-dark) :is(.sync-status-icon.mod-success, .sync-status-icon.mod-working) { | |
color: var(--tx2); | |
} | |
/* add a blinking highlight animation when syncing */ | |
:is(.theme-light, .theme-dark) .sync-status-icon.mod-working { | |
animation: color 0.25s infinite linear alternate; | |
} | |
/* use red color for failed sync */ | |
:is(.theme-light, .theme-dark) .sync-status-icon.mod-error { | |
color: var(--color-red); | |
} | |
@keyframes color { | |
from { | |
color: var(--tx2); | |
} | |
to { | |
color: var(--ui3); | |
filter: | |
drop-shadow(0 0 0.2px var(--ui3)); | |
} | |
} | |
/* dim editor that is not in focus useful for multiple tabs/panes */ | |
:is(.theme-light, .theme-dark):has(.cm-focused) .cm-editor:not(.cm-focused) { | |
background-color: var(--bg2); | |
--active-line-bg: rgba(0,0,0,0.0); | |
transition: background-color 0.2s; | |
} | |
/* specific for my use case - make image to be block display and always centered */ | |
.internal-embed img:not([width]), .internal-embed audio, .internal-embed video { | |
display: block; | |
margin: auto; | |
} |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment