search

kleinerpirat / anki-css-injector

Allows you to style field content in Anki's editor.
9 stars 2 forks source link

apply css from other addons, eg with custom hook or load multiple files #4

Open ijgnd opened 1 year ago

ijgnd commented 1 year ago

Your add-on is great. I'd like to have its functionality in other add-ons, e.g. Custom Styles (font color, background colour, classes). I can also imagine other add-ons (apart from the custom classes add-on or some syntax highlighting stuff) that want to style text in the editor.

At the moment each add-on would have to duplicate the code from your add-on and all these add-ons would have to be updated individually. This is not efficient.

It would be very useful (at least for me) if your add-on gathered css from various add-ons and applied it into the editor.

Maybe your add-on could load multiple files (either from the user data folder of your addon or the media folder) or maybe it could collect the css with a custom hook from other add-ons. The latter approach was used by lovac42' ReMemorize, see here.

Would you be interested in this and if so which approach would you accept?

kleinerpirat commented 1 year ago

Injecting CSS became a lot easier with a relatively recent Anki update (https://github.com/ankitects/anki/pull/1918). Using the customStyles component of RichTextInputAPI, adding CSS almost became a one-liner:

  const { addStyleLink } = await customStyles;
  addStyleLink(id, path);

Looking at the source code of CSS Injector, I'm a bit confused why the method isn't used yet (I was convinced I had already updated it).

I have a feeling it might not be worth it to make CSS Injector a dependency if the native method is probably simpler. If you have questions on how to use that part of the API, I'll happily answer them here.