What Changed
Starting with v20.2, CSS files we ship have the UTF-8 encoding.
Reasons for Change
In v20.2 we migrated to SASS. The SASS compiler always creates files with the UTF-8 encoding. If a file has non-ASCII characters, the compiler also adds the @charset declaration at the beginning of the file:
CSS@charset "UTF-8";
Since our icons are encoded in CSS files with non-ASCII characters, all these CSS files (except for dx.common.css) have the @charset declaration. For more information about this declaration, you can see the following document: SASS - --no-charset.
Impact on Existing Apps
In most cases, this change will not impact an application. However, depending on how the browser decodes a CSS file in your application, you can see incorrect symbols instead of our icons:
How to Update Existing Apps
To address the issue, do the following:
- Check that the file that references our CSS files has the UTF-8 charset. Refer to this article to learn more: https://www.w3schools.com/charsets/
- Check that your server returns CSS files with the
UTF-8charset. The 'charset' attribute of the 'Content-Type' header should be 'UTF-8': https://www.w3.org/International/O-HTTP-charset - If you have an ASP.NET application and create a bundle with our scripts and CSS files, make sure that the bundle file has the '@charset' declaration at the beginning of the file as described in the following ticket: ASP.NET Core - Icons are incorrectly displayed in DevExtreme components and certain CSS files are not requested.