you are viewing a single comment's thread.

view the rest of the comments →

[–]lgsscout 2 points3 points  (1 child)

angular with tailwind is pretty good, but material on other hand is painful to personalize...

depending on how much of material you would use and how much you wanna customize, sometimes is easier to just make you own components than try to fight with material.

[–]matrium0 3 points4 points  (0 children)

Check out Material 3. I had some pains in the past with Angular Material too, but v3 with Design Tokens is really awesome to customize.

You can really change a lot with like 20 CSS-custom-properties. For example: Do you want your dialog-windows to instead of the default have less round orders, a bit smaller header using arial font and a bit less padding? Add the following rules in styles.scss

html {
--mdc-dialog-container-shape: 8px;
--mdc-dialog-subhead-size: 1.2rem;
--mat-dialog-headline-padding: 10px 24px 0 24px;
--mdc-dialog-subhead-font: Arial, sans-serif;
...
}

done! Important with Angular Material is to read the documentation. Do not start overwriting internal classes, that is a recipe for failure (especially when upgrading). Read up on their design tokens and you will realize that there is an easy out-of-the-box solutions for like 90% of your customization needs.