Icons color

[denisduval75]

I would like to change the color of the PF icons.
Is it possible ?

[Melloware]

If you use PrimeIcons or FontAwesome yes then its just a CSS style "color: red" on your element.

if you are using ThemeRoller icons no those icons are GIF images embedded.

[denisduval75]

I use FontAwesome.
How to find icons for sorting columns of a datatable?

[Melloware]

Go here: https://fontawesome.com/v4.7.0/icons/

Type in "sort".

[denisduval75]

For Datatable Sorting I want to use the 3 Awesome icons:

fa-sort: <i class = "fa fa-sort" aria-hidden = "true"> </ i>
fa-sort-asc: <i class = "fa fa-sor-asct" aria-hidden = "true"> </ i>
fa-sort-desc: <i class = "fa fa-sort-desc" aria-hidden = "true"> </ i>

How to replace the default icons of PF?

[Melloware]

Just a guess from looking at the PrimeFaces showcase https://www.primefaces.org/showcase/ui/ ... sort.xhtml but you will have to override this CSS.

Code: Select all

body .ui-datatable thead th .ui-sortable-column-icon.ui-icon-carat-2-n-s:before {
        content: ""; }
    body .ui-datatable thead th .ui-sortable-column-icon.ui-icon-triangle-1-n {
      font-family: 'primeicons';
      speak: none;
      font-style: normal;
      font-weight: normal;
      font-variant: normal;
      text-transform: none;
      line-height: 1;
      display: inline-block;
      -webkit-font-smoothing: antialiased;
      -moz-osx-font-smoothing: grayscale;
      text-indent: 0px !important;
      text-align: center;
      background: none;
      display: inline-block;
      font-size: 1.25em;
      font-size: 1em; }

[kukeltje]

See also https://stackoverflow.com/questions/435 ... primefaces

[shivani3192]

I want to change color of tick mark and cross icons. i applied the following which gives me green background with black tick. I am trying too apply white color to tick mark.
<i class="pi pi-check-circle" style="font-size: 21px; color: green;"> </i>