Adding a CSS Library to a Theme (e.g. https://augmented-ui.com)

Help
1

I really would love to be able to use the CSS Library “augmented-ui” to adjust the CSS file and how it looks / behaves.

The problem is, that according to the developer I either need to have a HTML file where I load the stylesheet and then declare the different

affected with “data-augmented-ui” so I can edit it via the CSS or I need to have JS-Code to load the library.

Is there any other way to get this to work with CSS Snippets/Themes for Obsidian? Or is there a plugin that can load external stylesheets ?

1 Like
2

You should be able to put any CSS in a snippet. If you need to alter the HTML, I think you’d need a plugin to do that (but I’m hardly an expert). If declaring a class on a whole note is good enough, you can use the cssclass metadata field. You can assign classes some other was with plugins — search “class” in Settings > Community Plugins > Browse.

1 Like
3

So far I only found plugins that can add HTML classes to markdown elements but not theme / UI elements of Obsidian itself.

Sadly my coding abilities are rather lacking … I don’t think I would have the knowledge to create such a plugin :frowning:

4

Rather than applying the class the library applies, perhaps you could alter the library to target existing things.

5

At this moment this is not possible. I asked the dev and she said it’s in the works but a far way off for now. To make use of the cyberpunk UI features I need to either change the HTML code of the obsidian UI or somehow sideload it via JS and attribute the data-augmented-ui through that to the

i want to adress in CSS

image
image1747×588 132 KB

6

I meant to alter your copy of the library, not the original.

7

This topic was automatically closed 90 days after the last reply. New replies are no longer allowed.