Hi,
I've created a custom skin and embed all resource in an assembly.
All is loaded properly in the aspx page.
In my solution, I only reference Telerik.Web.UI and CustomSkin assemblies, I did not reference Telerik.Web.UI.Skins.
When debugging the aspx page in IE through F12,..
I saw that for ImageGallery's Next Button for example,..
background-image: none
.RadImageGallery : none
.RadImageGallery : url('/xxx/xxx/WebResource.axd?d=xxxxx&t=xxxx') <== this is striked-out
The first .RadImageGallery (none value) is coming from Telerik.Web.UI assembly (Telerik.Web.UI.Skins.ImageGallery.css)
The second .RadImageGallery (WebResource.axd value) is coming from the CustomSkin assembly, but is overridden by the first .RadImageGallery from Telerik.Web.UI assembly
As such, the image of the Next button is not shown.
Question is, if I have a ASP.NET Theme with a Skin File of :
<telerik:RadImageGallery runat="server" EnableEmbeddedSkins="false" Skin="TelerikRadControl" RenderMode="Lightweight" />
why is Telerik.Web.UI.Skins.ImageGallery.css still being loaded / part of the css ?
shouldn't the CustomSkin assembly be the only one loaded into the page?
Thanks,
Henry
I've created a custom skin and embed all resource in an assembly.
All is loaded properly in the aspx page.
In my solution, I only reference Telerik.Web.UI and CustomSkin assemblies, I did not reference Telerik.Web.UI.Skins.
When debugging the aspx page in IE through F12,..
I saw that for ImageGallery's Next Button for example,..
background-image: none
.RadImageGallery : none
.RadImageGallery : url('/xxx/xxx/WebResource.axd?d=xxxxx&t=xxxx') <== this is striked-out
The first .RadImageGallery (none value) is coming from Telerik.Web.UI assembly (Telerik.Web.UI.Skins.ImageGallery.css)
The second .RadImageGallery (WebResource.axd value) is coming from the CustomSkin assembly, but is overridden by the first .RadImageGallery from Telerik.Web.UI assembly
As such, the image of the Next button is not shown.
Question is, if I have a ASP.NET Theme with a Skin File of :
<telerik:RadImageGallery runat="server" EnableEmbeddedSkins="false" Skin="TelerikRadControl" RenderMode="Lightweight" />
why is Telerik.Web.UI.Skins.ImageGallery.css still being loaded / part of the css ?
shouldn't the CustomSkin assembly be the only one loaded into the page?
Thanks,
Henry
3 Answers, 1 is accepted
0
Hi ,
I suggest you to increase the specificity of the CSS rules as the following example
For more information please refer to this blog article.
I hope this helps.
Regards,
Galin
Telerik
I suggest you to increase the specificity of the CSS rules as the following example
div.RadImageGallery { background: red;}For more information please refer to this blog article.
I hope this helps.
Regards,
Galin
Telerik
Check out the Telerik Platform - the only platform that combines a rich set of UI tools with powerful cloud services to develop web, hybrid and native mobile apps.
0
Henry
Top achievements
Rank 1
Rank 1
answered on 27 Sep 2014, 03:19 AM
Thanks for your feedback Galin.
I actually use Visual Style Builder , chose Metro, and changed color to green and save all.
I then followed (http://www.telerik.com/forums/tool-for-embedding-custom-skins-into-an-assembly) to put it all in an assembly.
I would have thought by using Visual Style Builder, the new skin will override all telerik skins (including the one in Telerik.Web.UI)
Based on the links you gave, is it then possible to load my custom assembly last? ,.. instead of loading the skin in Telerik.Web.UI last (I assume this is the "Default" skin?)
Thanks for the blog link for the specificity. Is there an easy way to this to all styles generated by Visual Style Builder ?
Or indeed need to modify the generated css files?
Thanks in advance!
I actually use Visual Style Builder , chose Metro, and changed color to green and save all.
I then followed (http://www.telerik.com/forums/tool-for-embedding-custom-skins-into-an-assembly) to put it all in an assembly.
I would have thought by using Visual Style Builder, the new skin will override all telerik skins (including the one in Telerik.Web.UI)
Based on the links you gave, is it then possible to load my custom assembly last? ,.. instead of loading the skin in Telerik.Web.UI last (I assume this is the "Default" skin?)
Thanks for the blog link for the specificity. Is there an easy way to this to all styles generated by Visual Style Builder ?
Or indeed need to modify the generated css files?
Thanks in advance!
0
Hello ,
In case you are using a custom assembly (dll), these CSS files will be loaded after the base styles.
This is the best way to use the custom skins and I suggest you to try our new Skin Assembly Builder tool.
Otherwise you should link the styles in body part, e.g.
I hope this helps.
Regards,
Galin
Telerik
In case you are using a custom assembly (dll), these CSS files will be loaded after the base styles.
This is the best way to use the custom skins and I suggest you to try our new Skin Assembly Builder tool.
Otherwise you should link the styles in body part, e.g.
<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default.aspx.cs" Inherits="Default" %><%@ Register Assembly="Telerik.Web.UI" Namespace="Telerik.Web.UI" TagPrefix="telerik" %><!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml"><head runat="server"> <title></title></head><body> <link href="ImageGallery.CustomSkin.css" rel="stylesheet" /> <form id="form1" runat="server"> ... ... ... ... </form></body></html>I hope this helps.
Regards,
Galin
Telerik
Check out the Telerik Platform - the only platform that combines a rich set of UI tools with powerful cloud services to develop web, hybrid and native mobile apps.