Love to know the current general feeling on css framworks around hn crowd.
Personally I'm using them less and less as css evolves. You can have a pretty good responsive grid with just a few lines of css as for the other things I end up styling them a lot to my own needs so frameworks don't provide me that much value.
Hasn't had any updates for two years and looks like it's doing something weird with the base font inclusion assuming you have "nunito" already (not a safe assumption).<p>Also I'd suggest to anyone to potentially avoid using CSS vars if you're looking for enterprise browser support due to old IE. Obviously make your own decisions on this one but it I think 10 starts getting really weird with them...<p>All-in-all for the limited benefit this micro-lib brings I'd say go to something that's popular/supported vs. a project that hasn't seen a commit in 2 years.
three thing just killed it for me right away<p>1) the grid doesn't have gaps between columns. look at the form example, see how the two form field are right next to each other with no gap between them... that will cause a lot of headaches trying to layout even a slightly more complex form.<p>2) the naming of the colors in the util is inconsistent... they follow bootstrap with info, error, success, but then go with black, white, gray??? wtf is that. what about just sticking with the bootstrap naming and using dark, light, and default like they do. why switch when you already copied 80% of bootstrap's naming convention? makes no sense.<p>3) back to the grid. there are no viewpoint or reordering classes. do you know how much of a life saver it is to change the column order between devices with a simple order-md-2 in bootstrap. my god... if you ever had to do css trickery to move an element on mobile you see that the reordering in the grid is a god send.<p><a href="https://getbootstrap.com/docs/4.0/layout/grid/#reordering" rel="nofollow">https://getbootstrap.com/docs/4.0/layout/grid/#reordering</a><p>i'm sorry, but i personally see these micro frameworks as traps. bootstrap is very easy to recompile and strip out what you don't need to roll your own essentially.
Picnic is another very nice and compact option:<p><a href="https://picnicss.com/" rel="nofollow">https://picnicss.com/</a>
Settled with <a href="https://picturepan2.github.io/spectre/" rel="nofollow">https://picturepan2.github.io/spectre/</a> (After having tried close to 50 frameworks)
<p><pre><code> .\31{width:5%}
.\33{width:22%}
.\34{width:30%}
.\35{width:40%}
.\32{width:15%}
</code></pre>
huh? can you tell me what those \31 \33 etc. mean?
I'm a bit confused - is the name of this project "lit" or "lit [U+1F525 FIRE]"? The linked page has the latter as a heading, and the more complete name would also resolve the ambiguity with existing projects that others are pointing out.
Whats the reason for using a form with a button instead of a link?<p><pre><code> <form action="docs/lit.html">
<button class="mt1 btn primary white bold" type="submit">Get Started</button>
</form></code></pre>
Thanks for sharing this. 365 bytes gzipped is really amazing ! A lot of times for a simple page, just the basics like grids and all, I use custom trimmed down bootstrap. I would love to give this a try and some feedback on the experience !
Any minimal CSS for prefers-color-scheme: dark?<p>Only aware of <a href="https://kognise.github.io/water.css/" rel="nofollow">https://kognise.github.io/water.css/</a>