body{ --fluro-yellow-rgb: 255, 255, 0; --fluro-pink-rgb: 255, 0, 255; --fluro-blue-rgb: 0, 255, 255; --fluro-green-rgb: 0, 255, 0; --text-highlight-rgb: var(--fluro-yellow-rgb); } mark.yellow{ --text-highlight-rgb: var(--fluro-yellow-rgb); } mark.pink{ --text-highlight-rgb: var(--fluro-pink-rgb); } mark.blue{ --text-highlight-rgb: var(--fluro-blue-rgb); } mark.green{ --text-highlight-rgb: var(--fluro-green-rgb); } .markdown-preview-view mark { margin: 0 -0.4em; padding: 0.1em 0.4em; border-radius: 0.8em 0.3em; background: transparent; background-image: linear-gradient(105deg, transparent 0, transparent 0.3em, rgba(var(--text-highlight-rgb), 0.7) 0.5em, rgba(var(--text-highlight-rgb), 0.4) 1.6em, rgba(var(--text-highlight-rgb), 0.4) calc(100% - 1.4em), rgba(var(--text-highlight-rgb), 0.7) calc(100% - 0.5em), transparent calc(100% - 0.3em), transparent 100%); -webkit-box-decoration-break: clone; box-decoration-break: clone; text-shadow: 0 0 0.75em var(--background-primary-alt); } .cm-s-obsidian span.cm-highlight { padding:0.1em 0; background: rgba(var(--text-highlight-rgb), 0.4); -webkit-box-decoration-break: clone; box-decoration-break: clone; text-shadow: 0 0 0.75em var(--background-primary-alt); } .cm-s-obsidian span.cm-formatting-highlight{ margin: 0 0 0 -0.4em; padding: 0.1em 0 0.1em 0.4em; border-radius: 0.8em 0 0 0.4em; background: none; background-image: linear-gradient(105deg, transparent 0, transparent 0.3em, rgba(var(--text-highlight-rgb), 0.7) 0.5em, rgba(var(--text-highlight-rgb), 0.4) 1.6em); -webkit-box-decoration-break: clone; box-decoration-break: clone; } .cm-s-obsidian .cm-highlight+span.cm-formatting-highlight { margin: 0 -0.4em 0 0; padding: 0.1em 0.4em 0.1em 0; border-radius: 0 0.4em 0.8em 0; background: none; background-image: linear-gradient(105deg, rgba(var(--text-highlight-rgb), 0.4) calc(100% - 1.4em), rgba(var(--text-highlight-rgb), 0.7) calc(100% - 0.5em), transparent calc(100% - 0.3em), transparent 100%); -webkit-box-decoration-break: clone; box-decoration-break: clone; }