This is a migrated thread and some comments may be shown as answers.

Best approach to use custom skins & embedded skins together

1 Answer 32 Views

General Discussions

This is a migrated thread and some comments may be shown as answers.

Bryan asked on 30 Aug 2016, 02:46 PM

Hi,

So I am upgrading the UI of an old product that has a combination of Webcontrols and Web.UI controls. I plan to bring the older controls up to date but need to keep support and CSS for the older controls in place.
The older controls use a combination of skins and lots of bad css.
I will be using theme builder to create a custom skin and using lightweight rendering and EnableEmbeddedSkins="False" for new controls.
I have done one control so far and I am getting issues with the embedded skins overwriting my new skin using the WebResources.axd
I know I can use important to override but that's a very bad approach, especially on a large project... Is there a good approach to increase the specificity for the new skin files so all their properties are applied over the existing base properties where applicable.
I was thinking of using an ID to prefix all new skin selectors with and wrapping each updated control in a div of that id.. not 100% this is a good approach though.
eg..
#newControls .RadGrid_MyMetro{ ... }

and then give updated controls a div wrapped around it with ID="newControls" or something like that.
1. will this work throughout the project
2. Are there better approaches?

Thanks

Best approach to use custom skins & embedded skins together

1 Answer, 1 is accepted