How to fix broken icons (Semantic UI font icons not loading)

What happens:

We use a server-side LESS compiler which generates a file called semantic.css, containing the colours and fonts, and saves it to /wp-content/uploads/wpjobster/semantic.css.

Some servers can not handle this and the output file may be broken. This is when the icons stop loading (some other styles may also be broken).

If you have just changed your domain name, this may also be the issue because the semantic.css file will contain links to assets with your previous domain name.

Quick solution:

The quickest fix is to delete the semantic.css file from /wp-content/uploads/wpjobster/ via FTP.

Keep in mind that if there is a server issue, this will not solve the root problem, and each time you will try to compile your colours they may break again. 

If the issue was because of a domain name change, you can try to compile the colours again.

Final solution:

Ask your hosting support to disable ModSecurity, then go to Jobster Design > General > Colours > Pick, save and compile the colours. If the icons are being displayed properly, you don't have to do anything else.

If the issue is still present:

0. Make sure that you don't use any caching plugins. Some clients had such issues while using Redis Object Cache.

1. Install and activate Prevent Browser Caching plugin which can be found as free from wp-admin -> Plugins -> Add New. 

2. Open Inspector of the current browser that you are using and make sure that you have cache disabled. Keep inspector opened for the following 2 points

3. Go to wp-admin -> Settings -> Prevent Browser Caching and click on "Update CSS/JS files now" button

4. Go to Jobster Design > General > Colours > Pick, save and compile the colours (this will create and compile the necessary semantic.css file)