antoniotejada/Trilium-SyntaxHighlightWidget

Color scheme?

decryptedchaos opened this issue · 2 comments

This almost perfectly solves the problem.. with one exception that may or may not be a problem for others..

Is it possible to (even manually) change the color scheme?

the colors are not very pleasing particularly the blue on dark backgrounds I'd prefer pastel colors on dark backgrounds.

image

Nevermind, I found the stylesheet.

Here's my modification if anyone wants it.

Replace the stylesheet between the <style> tags in the CONST at the top of the main script file.

pre code.hljs {
    display: block;
    overflow-x: auto;
    padding: 1em
}

code.hljs {
    padding: 3px 5px
}

.hljs {
    background: #fff;
    color: #000
}

.hljs-comment,
.hljs-quote,
.hljs-variable {
    color: green
}

.hljs-built_in,
.hljs-keyword,
.hljs-name,
.hljs-selector-tag,
.hljs-tag {
    color: rgb(111, 130, 255)
}

.hljs-addition,
.hljs-attribute,
.hljs-literal,
.hljs-section,
.hljs-string,
.hljs-template-tag,
.hljs-template-variable,
.hljs-title,
.hljs-type {
    color: #a24ba2
}

.hljs-deletion,
.hljs-meta,
.hljs-selector-attr,
.hljs-selector-pseudo {
    color: #5399ae
}

.hljs-doctag {
    color: rgb(220, 232, 140))
}

.hljs-attr {
    color: red
}

.hljs-bullet,
.hljs-link,
.hljs-symbol {
    color: #00b0e8
}

.hljs-emphasis {
    font-style: italic
}

.hljs-strong {
    font-weight: 700
}

I like this much better

image

Thanks for taking the time to file the issue and your solution!

You can also follow the steps at #13 (comment) to use one of the existing highlight.js styles.

Leaving open to find a simple way to include styles.