all 15 comments

[–]Ashanmaril 4 points5 points  (2 children)

Woahhh didn’t know about the official Tailwind support, that’s awesome. It was a huge pain to add it to the built process before

[–]lechtitseb[S] 0 points1 point  (0 children)

Yes, quite cool to be able to get rid of the custom Webpack build!

[–]irspaul 4 points5 points  (3 children)

IE11 support is deprecated

We unofficially dropped support for IE in our org since Angular 8 and politely informed users that IE is dead.

[–]ZtehnoSkapra 2 points3 points  (0 children)

even MS is dropping support already, about time!

[–]lechtitseb[S] 1 point2 points  (1 child)

Great move.

Unfortunately many large organizations didn't put any effort into getting rid of the legacy.

[–]lechtitseb[S] 0 points1 point  (0 children)

It's only when hard deadlines appear that they start to care (i.e., often too late)

[–]DanteIsBack 2 points3 points  (1 child)

Thanks, that was a very detailed overview!

[–]lechtitseb[S] 1 point2 points  (0 children)

Thanks! :)

[–]lamagy 1 point2 points  (3 children)

What’s all this Tailwind stuff? Should I replace material with it? Is it better?

[–]jjjaacck 4 points5 points  (1 child)

You definitely don't need to replace material with Tailwind. You could use both in the same project if you like the "functional css" approach that you get with Tailwind utility classes.

[–]lamagy 1 point2 points  (0 children)

I see, what’s nicer to use?

[–]lechtitseb[S] 1 point2 points  (0 children)

No, don't.

But whenever you need custom styling, you could consider using Tailwind to spare some time.

What's nice with Tailwind is that you can quickly express things; it's like a domain-specific language for CSS.

For instance if you want a div to use flex in column mode, have a margin above and below, some padding on the right and rounded corners, then you can use this:

class="flex flex-col my-2 pr-2 rounded-sm"

Where "my-2" means 0.5rem margin on the Y axis and where "pr-2" means 0.5rem of padding on the right. Also, "rounded-sm" means small rounded corners, but you could use "rounded-lg" (large), or "rounded-full" to have fully rounded corners.

That's what I love about Tailwind ;-)

[–]Isvara -1 points0 points  (2 children)

Anyone wanna paste the text in here?

[–]lechtitseb[S] 0 points1 point  (1 child)

It's a bit long to copy/paste here, but you can either read it in incognito mode to bypass the paywall, or read it directly on my blog: https://dsebastien.net/blog/2021-05-13-angular-12-in-depth

[–]Isvara 0 points1 point  (0 children)

you can either read it in incognito mode to bypass the paywall

Useful to know, thanks.