.ui-icon-* doesn't render

Forum rules
Please note that response time for technical support is within 3-5 business days.
marcelocaser
Posts: 122
Joined: 13 Dec 2011, 15:07

10 Mar 2020, 15:20

Hi,

I'm using this configuration: https://primefaces.github.io/primefaces ... ont-icons to enable 'FontAwesome 5.X (or higher)' but now the 'ui-icon- *' icons are not most displayed!

Is there any other configuration I should do?

Thanks a lot!

marcelocaser
Posts: 122
Joined: 13 Dec 2011, 15:07

11 Mar 2020, 21:58

Hi...

...to facilitate understanding, follow the image below:

Image

marcelocaser
Posts: 122
Joined: 13 Dec 2011, 15:07

13 Mar 2020, 15:43

For now, I modified the file 'resources/sass/_mixins.scss'!

in line:

Code: Select all

// Icon Override Mixin
@mixin icon-override($icon) {
    background: none;
    display: inline-block;
    font: normal normal normal 14px/1 FontAwesome;
    font-size: inherit;
    text-rendering: auto;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    text-indent: 0px !important;
    text-align: center;

    &:before {
        content: $icon;
    }
}
changed to:

Code: Select all

// Icon Override Mixin
@mixin icon-override($icon) {
    background: none;
    display: inline-block;
    //font: normal normal normal 14px/1 FontAwesome;
    font-family: 'Font Awesome 5 Free';
    font-weight: 900; // fas or fa
    font-size: inherit;
    text-rendering: auto;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    text-indent: 0px !important;
    text-align: center;

    &:before {
        content: $icon;
    }
}
I don't no if this is the best way, but it worked!

mert.sincan
Posts: 5281
Joined: 29 Jun 2013, 12:38

17 Mar 2020, 19:46

Hi,

Thanks a lot for the code blocks! Maybe, this link can help to you to try an alternative solution;
viewtopic.php?f=53&t=60499&p=179192

Best Regards,

marcelocaser
Posts: 122
Joined: 13 Dec 2011, 15:07

18 Mar 2020, 17:33

So, aragorn
Maybe, this link can help to you to try an alternative solution;
viewtopic.php?f=53&t=60499&p=179192
I had already tried to make changes in this way, but without success. The 'barcelona' theme was implemented differently from the 'avalon'. So I think the solution I found is really the best!

Anyway, when will we have the version of 'avalon' compatible with FontAwnsore 5?

mert.sincan
Posts: 5281
Joined: 29 Jun 2013, 12:38

03 Apr 2020, 12:03

Thanks a lot for the update!
when will we have the version of 'avalon' compatible with FontAwnsore 5?
- Unfortunately, no. We added FA5 support to PrimeFaces core but you need to add fonts manually. Please see;
https://github.com/primefaces/primefaces/issues/4276

For theme, you need to change scss files manually to use any icon library.

Best Regards,

marcelocaser
Posts: 122
Joined: 13 Dec 2011, 15:07

03 Apr 2020, 13:32

Hello,
- Unfortunately, no. We added FA5 support to PrimeFaces core but you need to add fonts manually. Please see;
https://github.com/primefaces/primefaces/issues/4276
Thanks a lot! ;)

Code: Select all

For theme, you need to change scss files manually to use any icon library.
All right.. i change the css files and worked very nice! But i have just one problem with de 'wizard' component! The icons from the buttons 'next', 'previous'.. do not rendered correct! Look the imagem below!

Image

**inspect elements

Image

All the others icons work, just in 'wizard' that do not! Why? Can you help me?

thks

mert.sincan
Posts: 5281
Joined: 29 Jun 2013, 12:38

20 Apr 2020, 06:18

Hi,

Could you please check the font-family of ui-icon and :before element under ui-icon in console?

Best Regards,

marcelocaser
Posts: 122
Joined: 13 Dec 2011, 15:07

22 Apr 2020, 12:54

Offcourse,

Image

mert.sincan
Posts: 5281
Joined: 29 Jun 2013, 12:38

23 Apr 2020, 03:54

Thanks a lot! but, Could you please check it in 'Styles' tab of console (right side in your "**inspect elements" screenshot)? What font-family does the ui-icon/ui-icon* class have? Maybe it might have been overridden by another font-family.

Post Reply

Return to “Avalon - PrimeFaces”

  • Information
  • Who is online

    Users browsing this forum: No registered users and 3 guests