Overwriting blue links with...blue links that fail WCAG2 and have no pseudo-classes.
Replacing the default down arrow in <details> with...a down arrow SVG.
Delete it from the page and the main changes are 1. no rounded corners 2. content can possibly be larger than 800px
What's the point of this "library?"
> Use it in other projects
That's the place not to use this. This is just "I think browser defaults should look like this." Use it in any other project and all these element-based rules have a different specificity than the class-based ones. Have fun!
I have been writing HTML for... 20 years? And I just learned there is a `meter` element that supports `high`, `low`, and `optimum`.
https://developer.mozilla.org/en-US/docs/Web/HTML/Element/me...
I knew about the other weird ones though.
Looks decent, pretty minimalistic.
The form / input styles should use :focus-within instead of :hover to apply styles, using "power-user" keyboard navigation with tab and such doesn't correctly show what you have focused. I was pretty surprised by this - it's sloppy to add new input styles that give less information than the default browser styles about what is focused
Textarea removing the little "resize" widget in the bottom left is also pretty disappointing, being able to resize textareas so they're massive when you're typing in them and small when you're done with them is very convenient. For instance check out the comment box on HN, the small angled lines in the bottom right let you resize the box. I understand it can sometimes break layouts but it's not a good reason to remove it.
It's good you have used CSS vars for lots of configuration but I find the choices of 7px and 11px for (highlight-)border-radius to be strange, usually powers of 2 are all the rage these days
Inline text blocks look clean, I like those a lot
After seeing so many classless css libraries pop up over the past few years I decided to make my own. Nothing too fancy with it but I like the style and will be using it on some other small projects. Open to feedback or opinions.
Your styles for <mark> and <code> don’t look good when the element breaks across multiple lines. Thankfully there’s an easy fix, the relatively unknown {box-decoration-break: clone;}
Maybe it was just in the German speaking world, but such projects were called "template" or "boilerplate" ~10 years ago. When did we start calling them libraries? It doesn't add any functionality as one might expect from a library, it 's just an opinionated change to the default CSS shipped by browsers. Not to say that this is a bad thing, I just disagree on the terminology.
The range/output that display 0 or 100 but don't touch the ends of the slide rubs me in a very wrong way. Besides, nice style.
This looks great on mobile Safari. Overflow-y scrolling inside the code block is a great touch. In fact the only real issue I see is the very last element, the range slider, for which the handles don’t fully reach either edge. Awesome job.
(I'm using MVP.css for my homepage)
Shouldn't have HTML a decent look out of the box?
TIL about <mark>, <meter>, and <progress>!
This is pretty neat. I loved it.
The designer's enemy.
I like it, nice work!
Finally we're reaching CSS communism
A "classless CSS library" is just a stylesheet, isn't it?
These keep popping up again and again but are "generally" a terrible idea. At some point you'll need something that you imagined would for sure have an HTML tag and then the misery begins.
Here is small list of other "classless" CSS libraries I have found over the years
- https://github.com/andybrewer/mvp
- https://github.com/kognise/water.css
- https://github.com/xz/new.css
- https://github.com/vladocar/Basic.css
- https://github.com/oxalorg/sakura
- https://github.com/igoradamenko/awsm.css
- https://github.com/hawkz/gdcss
- https://github.com/emareg/classlesscss
- https://github.com/vincentdoerig/latex-css (disclaimer: I am the author)