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

Styles for RadDock

1 Answer 49 Views
Dock
This is a migrated thread and some comments may be shown as answers.
Greg
Top achievements
Rank 1
Greg asked on 21 Dec 2010, 05:21 PM
Prior to the recent Telerik update we had styles working for RadDockZones like below. These no longer work due to the update. On RadGrids we have set EnableEmbeddedBaseStylesheet="false" and we're thinking this is the same problem where a base stylesheet is being used instead of the styles we are specifying below. We've tried setting enablembeddedbasestylesheet to false on the RadDockZone and RadDockLayout. Why is it no longer picking up these styles? It seems to pick up .RadDockZone but nothing for .RadDock_Office2007 .rdTitle. Prior to the Telerik Upgrade the element had a class of rdTitle.

<em class="rdTitle">Quick Links</em>

After the upgrade, this class is gone so we can't seem to style this element. 

<em style="width: 249px;">lz_Quick Links</em>

 

.RadDock_Office2007

 

 

.rdTitle

 

{

 

 

 

text-align:left !important;

 

 

 

 

padding-left: 5px;

 

}

 

.RadDock_Office2007

 

 

.rdHTitlebar .rdTitle {

 

 

 

 

background-color:Transparent !important;

 

 

 

 

padding-left: 5px;

 

}

 

1 Answer, 1 is accepted

Sort by
0
Bozhidar
Telerik team
answered on 22 Dec 2010, 08:50 AM
Hello Greg,

With Q3.2009 we have introduced an improved rendering that solves a number of previous issues reported by our customers. Unfortunately, the old custom skins will not work with the new rendering. Using old custom skins with RadDock Q3 2009 will guide you how to port old skins to the new rendering.

Something similar to your code will look like that:

<%@ Register TagPrefix="telerik" Namespace="Telerik.Web.UI" Assembly="Telerik.Web.UI" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<head runat="server">
    <title></title>
    <style type="text/css">
        .RadDock_Office2007 .rdTitleBar em
        {
            text-align: left !important;
            padding-left: 5px !important;
            color: Red !important;/* just to show the class is applied */
                 background-color: Transparent !important;
        }
    </style>
</head>
<body>
    <form id="form1" runat="server">
    <asp:ScriptManager ID="ScriptManager1" runat="server">
    </asp:ScriptManager>
    <telerik:RadDockZone ID="RadDockZone1" runat="server" Width="300px" Skin="Office2007">
        <telerik:RadDock ID="RadDock1" runat="server" Title="Dock 1" Skin="Office2007">
            <ContentTemplate>
                <div>
                    This is dock 1<br />
                    This is dock 1<br />
                    This is dock 1<br />
                    This is dock 1<br />
                    This is dock 1<br />
                    This is dock 1<br />
                    This is dock 1<br />
                </div>
            </ContentTemplate>
        </telerik:RadDock>
    </telerik:RadDockZone>
    </form>
</body>
</html>

Please, note that now the RadDcok control uses background images for top, bottom left and right edges, and your style background-color: transparent could not be applied. If you want to remove them, you should set the classes where the images are applied to background-image: none.

All the best,
Bojo
the Telerik team
Browse the vast support resources we have to jump start your development with RadControls for ASP.NET AJAX. See how to integrate our AJAX controls seamlessly in SharePoint 2007/2010 visiting our common SharePoint portal.
Tags
Dock
Asked by
Greg
Top achievements
Rank 1
Answers by
Bozhidar
Telerik team
Share this question
or