juancarlospaco/webgui

Bootstrap/Tailwind support

yaroslav-gwit opened this issue · 6 comments

yaroslav-gwit commented

Your project looks really interesting.
I haven't tried to use anything advanced with it yet, but would it be possible to integrate Bootstrap or Tailwind into the app?

Bare/GTK html styles don't look as good as Tailwind or Bootstrap, hence why I am asking.

juancarlospaco commented

Bootstrap already works.
I dont know Tailwinds, but should.
Simply link it and use it. 🙂

yaroslav-gwit commented

Thanks :)

Just tried BS5, which seems to be working fine, but with 1 small issue: it's picking up the default GTK theme colours (something I want to avoid this time). Is there a way to switch that feature off?

juancarlospaco commented

You would have to theme everything up with the CSS framework.
Works for me with Bulma and Karax.

yaroslav-gwit commented

Great, thanks. Had to add .bg-dark to the body tag, now everything looks just as it should.

  • 👍1
juancarlospaco commented

Cool!, yeah styling works, you just gotta tinker with it...
If doing a lot of Frontend/JS stuff also check https://github.com/juancarlospaco/nodejs
🙂

yaroslav-gwit commented

Thanks, I've starred your NodeJS repo too, will dive deeper once I have some time for it.

By the way, to avoid rewriting all items styles, you can reload the window using JS like so (reload once on app startup):

window.onload = function() {
    if(!window.location.hash) {
        window.location = window.location + '#loaded';
        window.location.reload();
    }
}

That way it's easier to use BS5/Tailwind/Bulma native and default styling :)

  • 👍1