RadStyleSheetManager and .NET themes

4 posts, 0 answers
  1. Edward
    Edward avatar
    4 posts
    Member since:
    Jul 2014

    Posted 21 Mar Link to this post

    Is it possible to use .NET themes with RadStyleSheetManager?

    When I use a RadStyleSheetManager to combine my external stylesheets, it places the WebResource file AFTER the .NET themes stylesheet in the Head tag, with the result that the theme I'm trying to apply from the App_Themes folder is overridden by the base styles in the external stylesheets combined by the Telerik control. As in:

    <head>

    <link href="../App_Themes/Demo_Theme/Demo_Theme.css" type="text/css" rel="stylesheet">

    <link href="/QReg/Telerik.Web.UI.WebResource.axd?d=PMrIT5dOWaVYIcpFWUE4nL08EMI2VcWAw0rknd-hZDTwvbi5j9SontBAefw4vSph5ju3TcQNZ2u3pCuQ6PYF0RLbspBmxlwTBIWwYaZtNs3fJnQ30&amp;t=635918753441826527&amp;compress=1&amp;_TSM_CombinedScripts_=%3b%3b%7c635941629785528787%3ab27e5558%3a59f3f810%3a95dff68a%3a74ee2317%3a6cdcd2e9%3a6581de0b%3a88af4fc4" type="text/css" rel="stylesheet">

    </head>

    Is there a way to get the StyleSheetManager to place its webresource file before the .NET themes file?

    Thanks

  2. Veselin Tsvetanov
    Admin
    Veselin Tsvetanov avatar
    283 posts

    Posted 23 Mar Link to this post

    Hello Edward,

    When combining our build-in skins and external custom styles, our RadStyleSheetManager always places the skins file after the custom styles. If you want to avoid this issue, you could do one of the following:

    • In case that your custom styles depend on one of the predefined skins, you should make sure that the selectors you are using in your custom CSS are stronger than those used in our skin implementation;
    • In case you don't depend on our built-in skins, you could simply disable them;

    Regards,

    Veselin Tsvetanov
    Telerik
    Do you need help with upgrading your ASP.NET AJAX, WPF or WinForms projects? Check the Telerik API Analyzer and share your thoughts.
  3. UI for ASP.NET Ajax is Ready for VS 2017
  4. Edward
    Edward avatar
    4 posts
    Member since:
    Jul 2014

    Posted 24 Mar in reply to Veselin Tsvetanov Link to this post

    Hi Veselin,

    In that case, I think it is probably better I don't use RadStyleSheetManager. The issue is more to do with the relationship between my own style sheets and the stylesheet within the .NET themes folder, which overrides some of the classes in the former style sheets. If .NET themes always places its stylesheet before the WebResource file the RadStyleSheetManager creates, it is placing it before my custom stylesheets that your control is managing. I already have the !important keyword against some of those styles in the base custom stylesheets, since they need to override some of the Telerik skins. Those properties can't be overridden in the theme stylesheet, therefore, unless I remove them from the base style sheets, but I'm trying to keep the theme stylesheet as minimal as possible for the end designer.

    Maybe I'm not seeing that clearly, but that seems to be the case.

  5. Veselin Tsvetanov
    Admin
    Veselin Tsvetanov avatar
    283 posts

    Posted 25 Mar Link to this post

    Hi Edward,

    As far as I can understand, you have the following scenario:
    - In your implementation you use one or more of the Telerik built-in skins;
    - You have custom base stylesheet, that you include in the RadStyleSheetManager;
    - You also have different themes, based on the above, that you are not including in the RadStyleSheetManager;

    If the problem is that you want to load your custom base stylesheet before the specific theme stylesheet, you could do one of the following:
    - You could include both the above stylesheets in the RadStyleSheetManager and you can use the OrderIndex property of the StyleSheetReference;
    - You could manually add both stylesheets to your page without using RadStyleSheetManager.

    Keep in mind that in both cases if not disabled, our skins will be the last to be loaded. There is one more thing. Generally, using the !important directive is not a recommended approach. In most cases, our skin styles can be overridden using stronger CSS selectors.

    Regards,
    Veselin Tsvetanov
    Telerik
    Do you need help with upgrading your ASP.NET AJAX, WPF or WinForms projects? Check the Telerik API Analyzer and share your thoughts.
Back to Top