1 <%@ Page Language="C#" AutoEventWireup="true" CodeBehind="Css.aspx.cs" Inherits="ZeeControls2Demo.WebDock.Basic.Css" Theme="Default" %>
2
3 <%@ Register Assembly="ZettaCube.ZeeControls" Namespace="ZettaCube.ZeeControls" TagPrefix="cc1" %>
4
5 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
6
7 <html xmlns="http://www.w3.org/1999/xhtml" >
8 <head runat="server">
9 <title>Panel Styling With CSS </title>
10
11 <script type="text/javascript" src="../../common.js"></script>
12
13 <style type="text/css">
14
15 /* Override default styles */
16 .ZCWD
17 {
18 border: #375310 35px solid;
19 }
20
21 .ZCWDMainContent
22 {
23 padding: 20px;
24 background-color: #ffe8b8;
25 }
26
27 .ZCWDPanel
28 {
29 background-color: #caffc1;
30 border: 1px dashed green;
31 }
32
33 .ZCWDPanelTitleBar
34 {
35 padding-left: 2px;
36 background-color: #57683f;
37 color: #caffc1;
38 }
39
40 .ZCWDPanelContent
41 {
42 padding: 5px;
43 }
44
45 .ZCWDPanelTabStrip
46 {
47 }
48
49 .ZCWDPanelTabStripActiveTab, .ZCWDPanelTabStripActiveTabRollover
50 {
51 background-color: #57683f;
52 color: #caffc1;
53 }
54
55 .ZCWDPanelTabStripInactiveTab, .ZCWDPanelTabStripInactiveTabRollover
56 {
57 background-color: #748655;
58 color: #99ac8e;
59 }
60
61 </style>
62
63 </head>
64 <body>
65 <form id="form1" runat="server">
66 <div>
67
68 <cc1:WebDock ID="WebDock1" runat="server" FitParent="FitWindow" Height="664px" Width="839px">
69 <MainContent>
70 <strong>
71 Panel Styling With CSS<br />
72 </strong>
73 <br />
74 Appearances of panels, containers, and tab strips can be customized with CSS.
75
76 <div id="blah1" class="blah"></div>
77
78 </MainContent>
79 <TabStripProps ImagesFolderUrl="~/images/tabs" />
80 <Panels>
81 <cc1:WebDockPanel runat="server">
82 <Tabs>
83 <cc1:WebDockTabbedPanel runat="server" ImageFileName="Folders.gif" Title="Folders">
84 <Content>
85 Content of Folders
86 <div id="blah2" class="blah"></div>
87 </Content>
88 </cc1:WebDockTabbedPanel>
89 <cc1:WebDockTabbedPanel runat="server" ImageFileName="Servers.gif" Title="Servers">
90 <Content>
91 Content of Servers
92 </Content>
93 </cc1:WebDockTabbedPanel>
94 </Tabs>
95 </cc1:WebDockPanel>
96 <cc1:WebDockPanel runat="server" Dock="Bottom">
97 <Tabs>
98 <cc1:WebDockTabbedPanel runat="server" ImageFileName="FindResults.gif" Title="Find Results">
99 <Content>
100 Content of Find Results
101 <div id="blah3" class="blah"></div>
102 </Content>
103 </cc1:WebDockTabbedPanel>
104 <cc1:WebDockTabbedPanel runat="server" ImageFileName="Output.gif" Title="Output">
105 <Content>
106 Content of Output
107 </Content>
108 </cc1:WebDockTabbedPanel>
109 <cc1:WebDockTabbedPanel runat="server" ImageFileName="Breakpoints.gif" Title="Breakpoints">
110 <Content>
111 Content of Breakpoints
112 </Content>
113 </cc1:WebDockTabbedPanel>
114 </Tabs>
115 </cc1:WebDockPanel>
116 <cc1:WebDockPanel runat="server" Dock="Right" ActiveTabIndex="1">
117 <Tabs>
118 <cc1:WebDockTabbedPanel runat="server" ImageFileName="Properties.gif" Title="Properties">
119 <Content>
120 Content of Properties
121 </Content>
122 </cc1:WebDockTabbedPanel>
123 <cc1:WebDockTabbedPanel runat="server" ImageFileName="References.gif" Title="References">
124 <Content>
125 Content of References
126 </Content>
127 </cc1:WebDockTabbedPanel>
128 </Tabs>
129 </cc1:WebDockPanel>
130 </Panels>
131 <ActionButtonProps ShowMaximize="True" HasCustomActionIcons="True" ImagesFolderUrl="~/images/actionbuttons" />
132 <SplitterProps HasBackground="True" HasRollOverImages="True" HasThumbImage="True"
133 ImagesFolderUrl="~/images/splitter" LiveRefresh="True" Thickness="6" ThumbImageLength="50" />
134 </cc1:WebDock>
135
136
137 </div>
138 </form>
139
140 <script type="text/javascript">
141 GenLongContent('blah1', 1);
142 GenLongContent('blah2', 1);
143 GenLongContent('blah3', 1);
144 </script>
145
146 </body>
147 </html>
148
1 using System;
2 using System.Data;
3 using System.Configuration;
4 using System.Collections;
5 using System.Web;
6 using System.Web.Security;
7 using System.Web.UI;
8 using System.Web.UI.WebControls;
9 using System.Web.UI.WebControls.WebParts;
10 using System.Web.UI.HtmlControls;
11
12 namespace ZeeControls2Demo.WebDock.Basic
13 {
14 public partial class Css : System.Web.UI.Page
15 {
16 protected void Page_Load(object sender, EventArgs e)
17 {
18
19 }
20 }
21 }
22
1 body
2 {
3 font-family: Tahoma, Geneva;
4 font-size: 10pt;
5 }
6
7 .ZCWDMainContent, .ZCWDPanelContent
8 {
9 padding: 3px;
10 }
11
12 .ZCWDPanelTitleBar
13 {
14 padding-left: 3px;
15 }
16
17 .ZCWSPanel
18 {
19 padding: 3px;
20 }
21
22 .title
23 {
24 display: block;
25 font-weight:bold;
26 line-height: 24px;
27 }
28
29 .indent
30 {
31 padding: 10px;
32 padding-left: 30px;
33 }
34
35 .blah
36 {
37 color: Gray;
38 }
39
40 .tableRowHeader
41 {
42 color: #666666;
43 }
44
45 .tableColumnHeader
46 {
47 color: #666666;
48 }
49
1 <%--
2 Default skin template. The following skins are provided as examples only.
3
4 1. Named control skin. The SkinId should be uniquely defined because
5 duplicate SkinId's per control type are not allowed in the same theme.
6
7 <asp:GridView runat="server" SkinId="gridviewSkin" BackColor="White" >
8 <AlternatingRowStyle BackColor="Blue" />
9 </asp:GridView>
10
11 2. Default skin. The SkinId is not defined. Only one default
12 control skin per control type is allowed in the same theme.
13
14 <asp:Image runat="server" ImageUrl="~/images/image1.jpg" />
15 --%>