yoyurec / logseq-awesome-styler

🎨 Totally customizable theme with presets: colors, backgrounds, fonts and sizes, etc... Logseq plugin
MIT License
183 stars 9 forks source link

Provide Support for Custom Fonts #59

Closed ianelletson closed 1 year ago

ianelletson commented 1 year ago

Idea Provide either a dialog for choosing a font or support for specifying a particular font via .css

I'd like to use Yrsa, a serif font, for text, and JetBrains Mono for code.

It looks like I could modify awesomeStyler.css to support my font choices but it seems fragile to do so.

yoyurec commented 1 year ago

i'm using fonts: a) manually picked and only for predefined presets b) fonts files downloaded locally for offline mode, so i cant support any font

It looks like I could modify awesomeStyler.css to support my font choices but it seems fragile to do so

you can modify variables in custom.css & add font css @import (or font should be installed in OS):

@import url('https://fonts.googleapis.com/css2?family=Yrsa:ital,wght@0,300;0,400;0,500;0,600;0,700;1,300;1,400;1,500;1,600;1,700&display=swap')
@import url("https://dev-cats.github.io/code-snippets/JetBrainsMono.css");

.light-theme,
.dark-theme,
html[data-theme='light'],
html[data-theme='dark'] {
    --awSt-content-font: 'Yrsa', serif;
    --awSt-code-font: 'JetBrains Mono', Monaco, Menlo, Consolas, monospace;
}

OR there is already plugin for your needs - https://github.com/vipzhicheng/logseq-plugin-google-fonts