henices / logseq-flow-nord

A minimal theme that focuses on a clean and sleek interface that's soft on the edges and comes with a large variety of color palettes.
MIT License
33 stars 3 forks source link

Gruvbox Light uses invalid background color #24

Closed lunaror closed 7 months ago

lunaror commented 7 months ago

Gruvbox light theme uses invalid background color, but Dark variant is correct:

Gruvbox light:

image

Gruvbox dark:

image

CSS file was generated using gen_custom_css.sh script.

Note that src/palettes/gruvbox.css file contained typos and old variables names, so I had to modify it a bit:

.dark-theme,
html[data-theme='dark'] {
    --background-color-h: 0;
    --background-color-s: 0%;
    --background-color-l: 16%;
    --cl-background: 0,0%,26%;
    --cl-text-color: 38, 41%, 71%;
    --cl-primary: 24, 76%, 61%;
    --cl-accent: 167, 23%, 59%;
    --cl-secondary: 70, 36%, 55%;
}

.white-theme,
html[data-theme='light'] {
    --background-color-h: 46;
    --background-color-s: 33%;
    --background-color-l: 84%;
    --cl-background: 46,33%,74%;
    --cl-text-color: 36,14%,22%;
    --cl-primary: 0,49%,52%;
    --cl-secondary: 191,28%,37%;
    --cl-accent: 70,45%,33%;
}
henices commented 7 months ago

Thanks for reporting this issue, but I can't reproduce it.

image

Gruvbox is a custom color palette, the correct way to use it is:

1) Select ... -> theme -> Flow Nord Theme - custom 2) Settings -> edit custom.css

.dark-theme,
html[data-theme='dark'] {
    --ct-bg-color-h: 0;
    --ct-bg-color-s: 0%;
    --ct-bg-color-l: 16%;
    --ct-bg-color: 0,0%,26%;
    --ct-text-color: 38, 41%, 71%;
    --ct-primariy-color: 24, 76%, 61%;
    --ct-accent-color: 167, 23%, 59%;
    --ct-secondary-color: 70, 36%, 55%;
}

.white-theme,
html[data-theme='light'] {
    --ct-bg-color-h: 46;
    --ct-bg-color-s: 33%;
    --ct-bg-color-l: 84%;
    --ct-bg-color: 46,33%,74%;
    --ct-text-color: 36,14%,22%;
    --ct-primariy-color: 0,49%,52%;
    --ct-secondary-color: 191,28%,37%;
    --ct-accent-color: 70,45%,33%;
}

Due to the heavy cache of Logseq, please restart Logseq after editing custom.css.

lunaror commented 7 months ago

Thanks for pointing me out, I tried the correct way and background color of page changed to correct one, but sidebar and bullet point colors stood the same:

image

I also noticed that for me some other themes from plugin are affected, like Catppuccin,

image

but not Nord.

image
henices commented 7 months ago

That's weird. I test on linux and mac, but I can't reproduce it . Would you please provide more details, such as os version, Flow Nord Theme plugin version, Logseq version ...

Thanks a lot.

henices commented 7 months ago

Hi, finally I reproduce it on windows.

Update Logseq and Logseq Flow Nord theme to the lastest version. Settings -> General , select Cancel accent color (1st option) can fix this issue.

image

If you still have any problem feel free to reopen this issue, thanks.

lunaror commented 7 months ago

Sorry for late response, but everything works great now! I probably should have mentioned that problems started after last Logseq update, that was bringing accent color support.

Thank you for your amazing theme!