Don't have any scoped CSS

[linkdotnet]

While scoped CSS is nice, it also makes certain things like creating critical CSS more complicated.

Therefore all scoped CSS should either:

• Be Bootstrap 5 utility classes
• Or: part of the basic.css

[otutukingsley]

@linkdotnet I would like to work on this issue. can you assign it to me?

[linkdotnet]

Love it - thanks and done ;)

also don’t feel pressured to do all the work. I am fine if we split this into multiple PRs.

[linkdotnet]

Hey @otutukingsley I removed the assignment for now. If you work on this, let me know and I add you again

[EliasMasche]

Hello there, how is going this task? I am interested in providing more support to the project and it seems this one at my reach and for learning into front-end too.

[linkdotnet]

If you want, feel free to pick it up and ask me any question regarding it.

My idea would not only be removing any scoped CSS and move it to the root CSS, but also use more bootstrap utility classes when applicable. I started my journey without much knowledge of bootstrap itself, so I created way too much custom CSS where it wasn't necessary.

So probably I would do it in 3 steps:

1. Move out all the CSS into the root CSS (or a second CSS file just for that you can add to the _Host.cshtml)
2. Try to consolidate overlapped shared CSS into classes
3. Try to use bootstrap classes instead of those
   What is left is belonging to our root css.

[EliasMasche]

Thanks for the info and steps will write when I get some progress

[linkdotnet]

I have a stronger opinion, that we should go into the direction of something like tailwindcss that makes a lot of things easier. I tried it out in another Blazor project, and with v4, it was a pleasant experience.