AUTHOR: Marin Bratanov
DATE MODIFIED : July 21, 2017
DATE POSTED: January 09, 2017
Use the Material skin without an active Internet connection.
The Material skin requires an active Internet connection in order to download the Roboto font. If the client does not have access to the cloud, the page may load slowly while the browser waits for the request to time out. You may also get errors in the console similar to net::ERR_NAME_RESOLUTION_FAILED for the fonts.gstatic.com domain requests.
The guidelines Google provide for using their fonts indicate that these fonts are to be requested from their cloud. This is the first and foremost reason why such requests are needed, and why we have documented this information.
The second reason is the several variations of this font are extremely large and will, effectively, double the Telerik assembly size, should we bring them with our controls. This is not an acceptable solution for the many clients, especially those working in a SharePoint environment. Another downside to this is that such a resource copy is likely to lag behind updates Google implement.
There is a way to override the way we load the Roboto font in order to reference local files:
Note: You can use only the code snippet below and put it in your own site stylesheet in order to override the font we use. In this case you will still have the requests to the cloud, but they will not break the skin appearance. This may be an acceptable solution in some cases and it is easier to implement and maintain.
FF, U+EFFD, U+F
An important note on this approach is that you will need to ensure the correct font variation is available. You can use the following site as a starting point: https://fonts.google.com/specimen/Roboto. When you click the Select This Font in the top right-hand side you will get a popup with links that contain the appropriate code and URLs for your browser, depending on the fonts it supports (e.g., woff, ttf, eot). This is where you will need to tweak your setup.