These past few weeks I have been working on a project for fun: a class-less CSS library*.
*I know technically it cannot be considered a library,...
For further actions, you may consider blocking this person and/or reporting abuse
Looks great! I really like the idea of keeping it simple. Excuse my ignorance, but I haven't really tried CSS variables yet. Where do you add them and how do you change them?
Also, what do you think about using
margin: { 2rem 0 1rem }for headings and1.8rem lineheightfor paragraphs? I feel it's more readable as a default style for HTML documents.Of course, just my personal opinion :) (also with a small fix on the blockquote)
Here's how it would look:
I like the ideas (especially the line-height on paragraphs). That will be a change that I'll add soon :D
You can add a variable in CSS by defining it like this inside a rule:
--variableName: value;. Then that variable will be available by doingvar(--variableName)within the scope of the rule (e.g. if you define a variable in aul, it will be available in theuland the descendantlis but not outside of it). The cascading applies to them too: if you define them at thehtml,body, or:rootlevel, then they will apply to the whole page; and if you redefine them somewhere in the document, the new redefined value will apply to that scope. (sorry if it's too much, I tried to concentrate the most important info in just a paragraph).The library uses CSS variables at the
:rootlevel, they have some default values, but users can easily overwrite them in their own stylesheet, that will need to be loaded after the almond.css file.I see, started tweaking some variables to see how easy it was to do a mockup dark mode, and it worked well, almost everything looked perfect π―.
First time I use HSL on CSS, and it's incredibly versatile, never though of it before!
By the way, I added the line-height changes into the library (giving you credit for the suggestion), and made it into a variable too, so users can change it easily (it will apply to paragraphs and lists).
...Looking into the heading margins now :)