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

Color based theme

2 Answers 64 Views
General Discussions
This is a migrated thread and some comments may be shown as answers.
Kaushal
Top achievements
Rank 1
Kaushal asked on 25 Oct 2013, 04:47 AM
Hello friends,
I am working on a new project which is having about 15 different big modules. we are having requirement like each module should be having its own recognition factor by color. That means Module1 is having Red, Module2 is having Blue, Module3 is having Green and so on. This means when a user get inside the module all look and feel should resemble this color across controls. If user get inside Module1 (which should be using Red color), then all controls (RadGrid, RadCombo or whatever control that is used) should give look and feel of Red. This will give a recognition factor to user.
So, I am trying to figure this out in Telerik Controls. As, we also require to use some advanced functionalities like scheduler, advanced functionality in Grid. My question is; does telerik controls having  any type of mechanism to change the color of the controls based on the theme color of the module? I see that it has only some few set of read available skins. So, any option to above specified requirement?
Thanks for any help

2 Answers, 1 is accepted

Sort by
0
Kaushal
Top achievements
Rank 1
answered on 25 Oct 2013, 12:11 PM
anybody?
0
Bozhidar
Telerik team
answered on 29 Oct 2013, 08:23 AM
Hi,

I am not quite sure what you are trying to achieve, but you could set a different skin for the different modules you are using. As we do not have a RedColored skin, you should choose between the existing skins, or you could create a custom one. So if you have a Grey Module and you set a Office2010Silver skin for that module, when the user enters i, the colors will match that specific module. This a simple example showing a tab strip and each tab strip represents a different module. Under each different module I placed EadEditor control using different skin:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<head id="Head1" runat="server">
    <title></title>
    <style type="text/css">
         
    </style>
</head>
<body>
    <form id="form1" runat="server">
    <asp:ScriptManager ID="ScriptManager1" runat="server">
    </asp:ScriptManager>
    <telerik:RadTabStrip runat="server" ID="RadTabStrip1" Orientation="HorizontalTop"
        SelectedIndex="0" MultiPageID="RadMultiPage1" CssClass="tabstrip" Skin="Glow">
        <Tabs>
            <telerik:RadTab Text="Module Grey">
            </telerik:RadTab>
            <telerik:RadTab Text="Module Blue">
            </telerik:RadTab>
            <telerik:RadTab Text="Module Sunset">
            </telerik:RadTab>
        </Tabs>
    </telerik:RadTabStrip>
    <telerik:RadMultiPage runat="server" ID="RadMultiPage1" SelectedIndex="0" Width="400px"
        CssClass="multiPage">
        <telerik:RadPageView runat="server" ID="RadPageView1">
            <telerik:RadEditor runat="server" Skin="Office2010Silver"></telerik:RadEditor>
        </telerik:RadPageView>
        <telerik:RadPageView runat="server" ID="RadPageView2">
            <telerik:RadEditor ID="RadEditor1" runat="server" Skin="Office2010Blue"></telerik:RadEditor>
        </telerik:RadPageView>
        <telerik:RadPageView runat="server" ID="RadPageView3">
            <telerik:RadEditor ID="RadEditor2" runat="server" Skin="Sunset"></telerik:RadEditor>
        </telerik:RadPageView>
    </telerik:RadMultiPage>
    </form>
</body>
</html>

This is a simple example but shows how you could set different skin in different situation. I have prepared a short video file showing the result in the browser from the above code and how the color scheme is changes when you switch between different modes.

Regards,
Bozhidar
Telerik
If you want to get updates on new releases, tips and tricks and sneak peeks at our product labs directly from the developers working on the RadControls for ASP.NET AJAX, subscribe to the blog feed now.
Tags
General Discussions
Asked by
Kaushal
Top achievements
Rank 1
Answers by
Kaushal
Top achievements
Rank 1
Bozhidar
Telerik team
Share this question
or