Icon on menu bar are not correctly shown

[patricevincent]

Hi all,
I need your help. I am testing Valence and Sencha Architect.
I have made with Autocode (nice !) an application that i open in Architect.
All is ok.
In Architect, i upgrade to EXTJS 5.1 (Project settings, Framework).
After that, the + icon and Download icon are not drawing (only a small box is visible). (Please see attached files).
Did i made something wrong ?
Thanks for your help,
Patrice

[richard.milone]

If you want to upgrade to Ext JS 5.x then a tweak to the CSS is required:

1) In Sencha Architect go to Resources/ValenceTheme in the Project Inspector

2) Within the ValenceTheme you will see an entry for ValenceIconFonts. Double-click that to see the CSS code.

3) Find the CSS for .vvicon-16 and place this CSS after that block:

.vvicon-in-toolbar{
font-size:16px!important;
text-align:center;
padding-top:8px;
line-height:0!important;
}

4) In Design mode click on your icons that are showing incorrectly, then navigate to the iconCls property.

5) Change the part of the old iconCls that is "vvicon-16" to "vvicon-in-toolbar". For example, on the plus button the iconCls will show as "vvicon-16 vvicon-plus". You will change that to "vvicon-in-toolbar vvicon-plus".

[patricevincent]

Hi Richard,
Thanks for the quick reply.
I have modified that way and that's ok now !