What are the best lightweight CSS UI libraries containing widgets like tabs, trees, etc.? I don't have webdev experience (only GTK, etc.), but I need to write a web dashboard. I tried looking around but the only alternatives seem to be either bloated JS frameworks or abandoned experiments.
Of course, it's only for my own invoicing/crm system. I started on replacing the look and feel of everything with a flat more modern/less user-friendly equivalent by downloading the static css and modifying it to look like material UI designs.
How invested in CSS do you want to be? If you're just wanting to include someone else's .css file and then assign classes where needed, that's one way to go. However, CSS isn't as daunting as many people make it out to be for the vast majority of a user's needs--adding colors, borders, padding/margin, and other basic styling. Looking to use CSS for layout is where things can get "interesting", sometimes challenging, and sometimes arghhhh!
I've hand written the CSS for all of the sites I've worked on, and the CSS is smaller than some all encompassing library. Plus, I'm much better at CSS. But I decided I wanted to invest that effort. No shame if you don't
no suggestions in this reply, nor can I speak to if this is a good or bad idea, but you may like to learn about "classless css frameworks", basically just targeting the html5 semantics
Dashboards, tabs, trees, ... usually require at least some JavaScript to work properly. For some components, you may be able to use hacks around that. But I would generally not recommend that outside of experimentation. So a pure CSS framework is not going to work. It seems that you are not using a frontend framework like Vue.js. So I would recommend a library using web components for the interactivity. One good option is Shoelace [1] and there are a couple of others, too [2]. Take a look at the ones with the checkmark in the "W" column for libraries with web components.
I suppose its not the most lightweight, and it's considered outdated by many but I actually think Bootstrap is great for your use case.
It uses classes to style html inline and looks pretty good. The downside is it gives a fairly generic look but I don't think you should be too worried about that.
Tailwind has largely replaced it because it offers more flexibility. You use utility classes to write the css (add padding, change color, etc.) and isnt as opinionated as bootstrap. But I dont think you want that.
If you really are going for lightweight and simple you should checkout classless css which only uses html to style things. Nothing needed from you other than including the css sheet. https://github.com/dbohdan/classless-css
