Hi All,
I've got to say the Telerik controls are awsome, and the community is even better. I have converted my entire project from a competitor to Telerik over the past 6 weeks and have gotted all the info I need from the forums and documentation.
Well up until now, but I dont think this is a hard one....
I'm enabling my users to select their own skins. this is all great for the Rad controls and Decorated form elements.
However I'm missing the boat on how to apply the same styles to some simple elements like an html link. When using the black theme links show up in the standard blue which is hard to see.
I know I can apply a style for the links using regular CSS but that wont work so well when I have a black vs white background.
The second item I want to know is if I can reuse some of the background images that are present in the headers of elements like the grid and splitter for things like a table row background that would be reflected when the skin is changed (So I can't apply a specific styl e name like Telerik_Web20_class).
Thanks in advance for any replies!
I've got to say the Telerik controls are awsome, and the community is even better. I have converted my entire project from a competitor to Telerik over the past 6 weeks and have gotted all the info I need from the forums and documentation.
Well up until now, but I dont think this is a hard one....
I'm enabling my users to select their own skins. this is all great for the Rad controls and Decorated form elements.
However I'm missing the boat on how to apply the same styles to some simple elements like an html link. When using the black theme links show up in the standard blue which is hard to see.
I know I can apply a style for the links using regular CSS but that wont work so well when I have a black vs white background.
The second item I want to know is if I can reuse some of the background images that are present in the headers of elements like the grid and splitter for things like a table row background that would be reflected when the skin is changed (So I can't apply a specific styl e name like Telerik_Web20_class).
Thanks in advance for any replies!
3 Answers, 1 is accepted
0
Hi Mooka,
We are happy you like out control suite and we do our best to constantly improve it.
Straight on your questions about FormDecorator. The control is meant to style primarily form controls - buttons, input boxes, fieldsets, checkboxes and radiobuttons. When we planned the features of the control we decided to leave it up to the users to decide on the non-form controls, and this is why, for example there isn't special styling for links. However, with a little trick you may manage to achieve what you've started. Here we go:
Use FireBug or IE Dev Toolbar on a page with FormDecorator to locate the HTML element of the page (or the decoration zone ID). You will notice that a couple of classes have been added to these, i.e:
<html class="RadForm RadForm_Vista rfdButton rfdScrollBars rfdZone rfdLabel rfdHeading rfdTextbox rfdTextarea rfdFieldset rfdRadio rfdCheckbox" xmlns="http://www.w3.org/1999/xhtml" jQuery1256626419551="13">
Among all of these you will notice the class in red, which is skin-specific, and will allow you to style any element inside that parent. For example you will be able to specify CSS for headings for the different skins:
.RadForm_Vista h1
{
color: red;
}
... for the Vista skin, or:
RadForm_Black h1
{
color: lime;
}
... And so on... You just need to add your new rules in a separate CSS file and make sure it is loaded on the page. Also, please, have in mind that certain settings may need to have a higher CSS specificity (or the magic of the !important flag of CSS), otherwise that may not apply.
Best wishes,
Martin Ivanov
the Telerik team
Instantly find answers to your questions on the new Telerik Support Portal.
Watch a video on how to optimize your support resource searches and check out more tips on the blogs.
We are happy you like out control suite and we do our best to constantly improve it.
Straight on your questions about FormDecorator. The control is meant to style primarily form controls - buttons, input boxes, fieldsets, checkboxes and radiobuttons. When we planned the features of the control we decided to leave it up to the users to decide on the non-form controls, and this is why, for example there isn't special styling for links. However, with a little trick you may manage to achieve what you've started. Here we go:
Use FireBug or IE Dev Toolbar on a page with FormDecorator to locate the HTML element of the page (or the decoration zone ID). You will notice that a couple of classes have been added to these, i.e:
<html class="RadForm RadForm_Vista rfdButton rfdScrollBars rfdZone rfdLabel rfdHeading rfdTextbox rfdTextarea rfdFieldset rfdRadio rfdCheckbox" xmlns="http://www.w3.org/1999/xhtml" jQuery1256626419551="13">
Among all of these you will notice the class in red, which is skin-specific, and will allow you to style any element inside that parent. For example you will be able to specify CSS for headings for the different skins:
.RadForm_Vista h1
{
color: red;
}
... for the Vista skin, or:
RadForm_Black h1
{
color: lime;
}
... And so on... You just need to add your new rules in a separate CSS file and make sure it is loaded on the page. Also, please, have in mind that certain settings may need to have a higher CSS specificity (or the magic of the !important flag of CSS), otherwise that may not apply.
Best wishes,
Martin Ivanov
the Telerik team
Instantly find answers to your questions on the new Telerik Support Portal.
Watch a video on how to optimize your support resource searches and check out more tips on the blogs.
0
Bryan Kowalchuk
Top achievements
Rank 1
Rank 1
answered on 12 Apr 2010, 06:58 PM
I also love the Telerik stuff, but the overall skinning strategy is a little short. It appears that If I want to skin an entire site, I would need two sets of skins for each theme; the Telerik skin and another one for all the other elements. It would be great if the Telerik skinning could also work for other elements ( H1, A ), that way it could be used for skinning a entire site.
0
Hello Bryan,
We considered such option when we started working on the RadFormDecorator control, but our research showed that the majority of developers prefer to have control over the styling of links, major headings (H1 / H2 / H3) etc. elements that are most commonly used on a page.
Greetings,
Georgi Tunev
the Telerik team
Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Public Issue Tracking system and vote to affect the priority of the items.
We considered such option when we started working on the RadFormDecorator control, but our research showed that the majority of developers prefer to have control over the styling of links, major headings (H1 / H2 / H3) etc. elements that are most commonly used on a page.
Greetings,
Georgi Tunev
the Telerik team
Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Public Issue Tracking system and vote to affect the priority of the items.