Style Settings Plugin

v0.2.2 Has been released!

Style Settings will now display error messages, and a message when no configurations have been detected:

2 Likes

@janpeeters Could you try updating the plugin and creating a snippet from Panic Nova again? I’ve added in some additional check that should hopefully fix things. At the very least, it should tell us what’s going on.

Hey @Daveb08! Minimal Theme isn’t set up to use Style Settings (as far as I know). You could create your own config by creating a CSS snippet in your vault. Instructions about that are here: GitHub - mgmeyers/obsidian-style-settings: Dynamically creates a user interface for adjusting theme, plugin, and snippet CSS variables

I would recommend the minimal theme plugin, though, as that’s specifically tailored to the theme.

(Sorry for all the edits)

@mgmeyers I copied the RAW code from GitHub into a Panic Nova 5.1 document and saved it as a CSS snippet again. I then got a YAML error but at first this seemed to be in my own ‘settings’ snippets. I had used tabs for indentation. I wasn’t aware that I had to use two and four spaces to indent it properly.
After I fixed those I got the following error message for your Obsidian default theme settings file

The whole file was full of tabs I noticed. Nova is replacing spaces with tabs. I can’t figure out though why they would do that. They’re quite experienced developers.

Nova has a preference setting in which you can set that tabs should consist of spaces instead of being a real tab. I’ve now set it to 4 spaces. But even then it replaces them when pasting the code. It only seems to work when I type tabs manually.

When I paste in BBEdit it stays 4 spaces and your code works.

Ah, ok, thanks for this info. I found a couple bugs on my end.

Tabs should be ok now (I automatically convert them to spaces), but if tabs and spaces are mixed, there will be issues.

Try updating!

1 Like

Thanks for the update!

One little information that I didnt knew until yesterday.

To input a different style of a Font on Style Settings you have to input the font’s PostScript name .

For example:

  • Georgia have 4 styles:
    • Regular
    • Italic
    • Bold
    • Bold Italic

To use Bold on Style Settings: Georgia-Bold

To find the PostScript name on Mac

I hope this is useful for somebody.

1 Like

Hello,

How can I backup style settings for my current theme?

1 Like

I found this really helpful, thank you!

1 Like

Loving this plugin, thank you for your work!

Is there a way to change the editor font only. I tried changing the Base Font but it changes everything, editor included.

I just want the editor to be monospaced to make vim mode less miserable.

Cheers.

1 Like

Hey! Stopped by to report the plugin’s awesome! I’ve been using it with the Yin and Yang theme with the WYSIWYG option, and damn does it look and feel good to write in. Do you have a list of themes that support the WYSIWYG options by any chance?

@oash This depends on the theme you’re using and how style settings is set up. It is possible in theory, but will need to be accomplished on a per-theme basis.

I do not. Chetachi set this up specifically for Yin and Yang.

I believe there’s a CSS snippet that will get you a WYSIWYG feel in any theme, though. You might try searching the forums for that if you’re interested.

We have both a light theme and a dark theme.
I’d be convenient, useful and hopefully consistent, if we could add some layer modes (multiply, screen, overlay, chroma, ect.) to our fine tuned light theme or fine tuned dark theme inside style settings, to save time to not customize the opposite theme.

I don’t know if this is just sweet theory and if applicable. Maybe a mockup in PS could be useful to find out if this system is practical.

In style settings we would need a drop down menu to select the layer mode to apply, if desired and style settings would do the computation and application of the translation from one theme color to another theme color

I just wanted to let you know my idea. I like your plugin very much, although it’s easy to get addicted to all this fine tuning
Anyway, :+1:t2:

@mgmeyers: Hi, I have the best of Obsidian combined: Minimal Theme and Style Settings. This combination gives me the best of everything I have tried so far.
There is only one thing in Style Settings that bothers me a little bit. I cannot turn off the underlining of links. If I use Minimal Theme Settings plugin to customize the Minimal Theme, it works. With Style Settings plugin it doesn’t. I will definitely stay with Style Settings plugin for customization because it gives me more options. Could you please look into this issue and possibly fix it in one of the next updates :grinning:. It would be very much appreciated.

@SamAdams how about using this snippet:

a.external-link {
  text-decoration-line: none;
}

Hi Klaas, Thanks a lot for the snippet. It works for external links :grinning: and is a good work-around. If I want to use it for internal links as well, can I just extend the snipped like so?

a.external-link {
  text-decoration-line: none;
}
a.internal-link {
 text-decoration-line: none;
}

Hi Klaas,
due to inspiration by your snippet and after some research on the internet I am able to change the properties of internal and external links. Oddly enough, the link-underlining doesn’t work for the internal links. Every other decoration works for both. Hier is an example, that changes the color of both link-types but the none-underlining works only for external links. What am I doing wrong? Is there another way to change the underlining?

a.internal-link {
    text-decoration:
        none;
        color: #75889e;
}

a.external-link {
    text-decoration:
        none;
        color: #c9a073;
}

@SamAdams from the Typomagical theme:

a,
.cm-hmd-internal-link,
.cm-link,
.markdown-preview-view .internal-link {
	text-decoration: none;
	font-variant: small-caps;
}

That covers both internal and external links. Note the small caps transformation for links which I find a nice change, but if you don’t like it just delete that line.

Last but not least, at the risk of seeming immodest, over the past 1½ years I have collected a lot of CSS snippets that someone put in a Github repository - you might find quite a few useful ones. Some of them won’t work in Live Preview, other will.

Click on the Github link in the uppermost comment on this forum page, and it’ll take you there.

Enjoy !

1 Like

Hi Klaas,
the new snippet from the Typological theme work perfectly for the internal links and your snippets collection is fantastic.:+1:
I found another snippet to dim unresolved internals links - very nice :grinning:.
Thank you very much for your help.