Various CSS issues after upgrading to 7.10.4

Hello there,

I have done an upgrade from an existing SugarCRM 6.5 to the latest SuiteCRM 7.10.4 using the following upgrade path:
1.) SugarCRM 6.5 to SuiteCRM 7.1.8
2.) 7.1.7 to 7.3.2
3.) 7.3.2 to 7.4.4
4.) 7.4.4 to 7.6.10
5.) 7.6.10 to 7.8.18
6.) 7.8.18 to 7.10.4

The upgrades themselves ran through without any issues. I ran Quick Repair & Rebuild and cleared my browser’s cache following each upgrade step.

So far SuiteCRM seems to run fine with the exception of some weird CSS issues such as missing buttons and the active list filters are hidden behind the navigation and filter buttons:

List views:

Dashlets:

I’ve ran Quick Repair & Rebuild and the cache/themes folder. I have the following server config:

Ubuntu 16.04 LTS
Apache, PHP 7.2, MariaDB 10.2

Any ideas on how to solve this issue?

Many thanks in advance.

You can try a few other repairs from Admin / Repair. Anything Javascript related.

Some of the things you see in your screenshots are actually CSS bugs in the product. It’s better if you just look them up on GitHub, and open new issues if necessary.

Basically, in 7.10 we added four new colour schemes, then that was proving difficult to manage in terms of icons (getting them to contrast with the button background, when that background could have vastly different colours according to the subtheme). So in 7.10.2 (I think) we had to change our icon set to get more control over that. What you see are the things that are left to be fixed after this change, which was quite impacting.

You can compare with what you see in the demo site, to know if the issues are only in your system, although the theme might not be like yours. Sometimes it’s a good idea to keep a fresh SuiteCRM install in a VM so you can check it for things like these.

1 Like

Thanks for your quick reply. I’ve compared my installation to the SuiteCRM Demo and it seems that the missing icons are an issue on my installation only, unless the demo has some implemented fixes which were not yet pushed to the official download package. I’ve ran all of the JS related repair options, emptied the browser cache but the issue persists unfortunately.

The demo is a standard install, no extra fixes in there.

Do you have any customizations or add-ons that might justify the difference in your installation? Anything in the custom directory could be affecting this.

You can also try a more directed approach: look at a working installation, check the names and paths of the missing icons, then go looking ofr them in your main server, and check permissions on those files…

Great, thanks for the pointers. Regarding the icons, I’ve noticed that some of the font files in /themes/SuiteP/fonts were empty/had no data, so I’ve replaced them with the fonts from the standard 7.10.4 package and following a repair/rebuild and emptying the browser’s cache the icons appeared! I suppose that during the last upgrade step the fonts didn’t get copied properly for some reason.

The only issue that’s left are the Start/Prev/Next/End buttons on the dashboard dashlets, however this is more of cosmetical issue. I will search on Github and keep a lookout for future maintenance releases.

1 Like