3

I'm creating an Angular 7 CLI application that uses ng-bootstrap. Before adding ng-bootstrap, I had custom fonts applied to buttons that were working and showing up nicely. Since adding ng-bootstrap, the fonts are blurry.

I've already tried adding SCSS to the main styles.scss file: 

button {
    -webkit-font-smoothing: antialiased;
    text-shadow: 1px 1px 1px rgba(0, 0, 0, 0.004);
}

I've also tried: 

button {
    -webkit-font-smoothing: inherit;
}

In addition, I did add the !important class to try and force it. When I remove the custom font from the button, the default font appears crisp and clear.

Stefanni Becker
  • 121
  • 1
  • 3
  • it's due to `transform` property https://github.com/ng-bootstrap/ng-bootstrap/issues/3294 maybe something by the link - https://stackoverflow.com/questions/14677490/blurry-text-after-using-css-transform-scale-in-chrome - will have you but I'll have to write a js workaround – Andrei Shostik Aug 22 '19 at 13:16

0 Answers0