Custom CSS

[xavierroy]

Would it possible to use custom CSS files? Any customizations get overwritten during an upgrade.

Support for a 'static' folder would be nice to have. It could include Obsidan style snippets, for example.

[rothsandro]

What would you like to style with custom CSS? And what do you mean with "Obsidan style snippets"?

[xavierroy]

Apologies for not being clear.

I meant adding logos and changing colors, fonts when I said "custom".

For Obsidian style snippets, I meant I use a lot of callouts that I would like to see in the 11ty site.

for example,

.callout[data-callout="tweet"] { 
    --callout-color: 0, 172, 238; 
    --callout-icon: lucide-twitter; 
}

.callout[data-callout="background"] { 
    --callout-color: 215, 128, 90; 
    --callout-icon: lucide-history; 
}

I was hoping for a custom.css file in the root folder that will not be overwritten when I upgrade the .app folder.

[rothsandro]

Thanks for the clarification. I have to think about if and how to support custom styles, this may take a while and I'm currently working on other tasks.

In the meantime, you can put your custom css in the root folder and update the css files in the app folder to include it. The latter will be overwritten when you upgrade but at least your custom styles are untouched.

[rothsandro]

Feature shipped 🎉 Eleventy Notes v0.21.0 supports custom styles (see docs)