I want to create CoreComponents based on Bootstrap 5 instead of tailwind. I’m having issues with form validation. It seems like the only way Phoenix has of telling the client that feedback should be shown or not on a given form field is through the phx-no-feedback class. Apparently, tailwindcss does some kind of dark magic with class pseudoselectors (?) in which things work (or maybe it’s the subset of tailwind used by Phoenix? I don’t know much about tailwind and my bootstrap client adventures are mainly a way of avoiding having to learn about tailwind and the respective build tools).

With tailwind, one does something like phx-no-feedback:some-tailwind-utility-class, but that only works due to tailding JS and CSS magic, right?

If I am to use Bootstrap 5, what is the right way to add the is-valid and is-invalid bootstrap classes to my input components to mimic the behaviour of the default CoreComponents file? I’m not very knowledgeable about CSS but I’m willing to learn enough to make it work if anyone can point me to the right sources. I believe there is probably a way of doing this that doesn’t depend on taiwlind and doesn’t require rewriting the original bootstrap CSS file to make it work.