Using PrimeNG and FontAwesome
Revision as of 13:43, 21 October 2019 by PeterHarding (talk | contribs)
Using PrimeNG Icons
See - https://www.primefaces.org/showcase/ui/misc/primeicons.xhtml
Notes
From - https://github.com/primefaces/primeng/issues/5098
For those wanting to combine FA 4 and 5 icons on older versions of PrimeNG, there's a very simple trick to support both. Add following rules to your css file (don't forget to first add FA 5 support to your application):
/* font awesome 5 */
.fa.fab, .fa.fal, .fa.far, .fa.fas {
-moz-osx-font-smoothing: grayscale;
-webkit-font-smoothing: antialiased;
display: inline-block;
font-style: normal;
font-variant: normal;
text-rendering: auto;
line-height: 1;
}
.fa.fas {
font-family: Font Awesome\ 5 Free;
font-weight: 900;
}
.fa.far {
font-family: Font Awesome\ 5 Free;
font-weight: 400;
}
If you want to use a FA 5 icon you only need to prefix it with 'fas ' or 'far ' anywhere PrimenNG supports setting a FA icon.
ex. <p-confirmDialog icon="fas fa-question-circle"></p-confirmDialog>