I'm trying to understand the logic of having them as .md files when you then can't refer to them to be able to import them because they aren't accessible as snippets?

I love this repo', but It will be good to add link / screen / gif to explain the effect of each snippet!

This repository is popular among Obsidian users. Currently, it has +250 stars and it's often mentioned both in Forum and Discord server.
I think it may be worth to add few things to make it more useful for users and contributors.

License

Currently, there's no license, which may lead to several problems. I suggest adding a license, e.g. MIT.

File structure

• /styles
  • name.css
• /media
  • name-1.gif
  • name-2.jpg
• README.md

README

Usage

How do snippets works and how to use them.

Snippet

• snippet name with link to name.css
• description with an example (e.g. name-1.gif)
• download

Example:

image-cards by author

Makes image smooth.

Before

After

name.css

Contributing

How to contribute to this repository.

Let me know what do you think about these changes. I'm happy to help working on it!

The names of the styles in the sidebar outline have changed.

Here is the css I use, with a screenshot of it in action. It adds indenting of headings that wrap, uses a lighter weight font for leaf items, and uses rem units so that it zooms in/out cleanly.
I also use override variables as I do in most of my snippets. The default variable is one available in the app variables, and the override one is specific to the snippet so that the snippet can easily be customized per-theme.

.outline {
  font-size: 0.8rem;
  font-weight: 200;
}

.outline .tree-item {
  line-height: 1.3;
}

.outline .tree-item-self {
  padding-top: 0.2rem;
  padding-bottom: 0.1rem;
  padding-left: 0.5rem;
  padding-right: 0.3rem;
}  

.outline .tree-item-collapse {
  left: 0.1rem;
}  

.outline .tree-item-inner{
  position:relative;
  padding-top: 0.2rem;
  /* padding-left: 1rem; */
  padding-left: 1.7em;
  text-indent: -0.8em;
  margin-left: 0.2rem;
  /* font-size: 0.9em; */
}  

.outline .tree-item-children {
  margin-left: 0.7rem;
  padding-left: 0.5rem;
  margin-top: -0.3rem;
  padding-top: 0.3rem;
  border-left: 1px solid var(--sidebar-marks, var(--background-modifier-border));
  border-radius: 4px;
  transition:all 0.5s ease-in-out;
}

.outline .tree-item-children:hover {
  border-left-color: var(--sidebar-marks-hover, var(--background-secondary));
}

.outline .collapse-icon + .tree-item-inner {
  font-weight: 400;
  padding-left: 0.2rem;
  /* margin-left: 0rem; */
  /* font-size: 1em; */
}

.outline .collapse-icon {
  margin-top: 0.2rem;
  margin-left: -0.4rem;
  margin-right: -0.4rem;
  width: 2rem;
}

This is definitely a feature request rather than an "issue," but...

Right now, all of these examples are markdown (.md) files containing CSS in code blocks, meaning that a person can't just download them into their snippets directory and use them. And (at least in my case) meaning there's a lot of opportunity for human error in copy-and-pasting those code blocks.

What do you think of changing the files over to straight CSS? That would mean giving up some of the nicely-formatted explanatory text in the files themselves, but I think it might be a win overall.

Thanks for your consideration :-)
-Eric

Possible to make the lovely new folding arrows work the same in preview mode?

Hi,

Wouldn't it be helpful to add a file with screenshots and gifs to each css snippet that shows what the css change actually looks like in obsidian? I find it difficult to imagine how it will look in the end from the short description alone. This would allow users to quickly browse the repository for changes they want to apply without the need for copy, paste and and save them everytime.

I'd be happy to contribute some of the recordings, just let me know if you'd be interested in that.
(Also, is this repo still actively maintained?)

In the README you wrote "I have made a habit of collecting these habits".

Seems like this is a typo, that's meant to be "collecting these snippets".

PS: thanks, great repo! <3