]>
Commit | Line | Data |
---|---|---|
81bea17a AD |
1 | /* TabContainer |
2 | * | |
3 | * Styling TabContainer means styling the TabList and Its content container (dijitTitlePane) | |
4 | * | |
5 | * Tab List: (including 4 kinds of tab location) | |
6 | * .dijitTabContainerTop-tabs - tablist container at top | |
7 | * .dijitTabContainerBottom-tabs - tablist container at bottom | |
8 | * .dijitTabContainerLeft-tabs - tablist container at left | |
9 | * .dijitTabContainerRight-tabs - tablist container at right | |
10 | * | |
11 | * Tab Strip Button: | |
12 | * .dijitTabStripIcon - tab strip button icon | |
13 | * .dijitTabStripMenuIcon - down arrow icon position | |
14 | * .dijitTabStripSlideLeftIcon - left arrow icon position | |
15 | * .dijitTabStripSlideRightIcon - right arrow icon position | |
16 | * | |
17 | * .tabStripButtonDisabled - styles for disabled tab strip buttons | |
18 | * | |
19 | * Tab Button: | |
f0cfe83e AD |
20 | * .dijitTabContainerTop-tabs .dijitTab - styles for top tab button container |
21 | * .dijitTabContainerBottom-tabs .dijitTab - styles for bottom tab button container | |
22 | * .dijitTabContainerLeft-tabs .dijitTab - styles for left tab button container | |
23 | * .dijitTabContainerRight-tabs .dijitTab - styles for right tab button container | |
81bea17a | 24 | * |
f0cfe83e | 25 | * .dijitTabContainerTop-tabs .dijitTabChecked .dijitTab |
81bea17a AD |
26 | * - styles for selected status of top tab button |
27 | * same to Bottom, Left, Right Tabs | |
28 | * | |
f0cfe83e AD |
29 | * .dijitTabHover .dijitTab - styles when mouse hover on tab buttons |
30 | * .dijitTabActive .dijitTab - styles when mouse down on tab buttons | |
31 | * .dijitTabChecked .dijitTab - styles when on buttons of selected tab | |
81bea17a AD |
32 | * |
33 | * .dijitTabCloseButton - the close action buttons lie at the right top of each tab button on closable tabs | |
34 | * .dijitTabCloseButtonHover - styles when mouse hover on close action button | |
35 | * .dijitTabCloseButtonActive - styles when mouse down on close action button | |
36 | * | |
37 | * Tab Button: (checked status) | |
38 | * | |
39 | * Tab Content Container: | |
40 | * .dijitTabContainerTop-dijitContentPane | |
41 | * .dijitTabContainerBottom-dijitContentPane | |
42 | * .dijitTabContainerLeft-dijitContentPane | |
43 | * .dijitTabContainerRight-dijitContentPane - for background and padding | |
44 | * | |
45 | * Nested Tabs: | |
46 | * .dijitTabContainerNested - Container for nested tabs | |
47 | * .dijitTabContainerTabListNested - tab list container for nested tabs | |
48 | */ | |
49 | /*** some common features ***/ | |
2f01fe57 | 50 | .claro .dijitTabPaneWrapper { |
81bea17a | 51 | background: #ffffff; |
2f01fe57 AD |
52 | } |
53 | .claro .dijitTabPaneWrapper, | |
54 | .claro .dijitTabContainerTop-tabs, | |
55 | .claro .dijitTabContainerBottom-tabs, | |
56 | .claro .dijitTabContainerLeft-tabs, | |
57 | .claro .dijitTabContainerRight-tabs { | |
81bea17a AD |
58 | /* todo: add common class name for this div */ |
59 | ||
60 | border-color: #b5bcc7; | |
2f01fe57 AD |
61 | } |
62 | .claro .dijitTabCloseButton { | |
1354d172 | 63 | background: url("../layout/images/tabClose.png") no-repeat; |
81bea17a AD |
64 | width: 14px; |
65 | height: 14px; | |
66 | margin-left: 5px; | |
67 | margin-right: -5px; | |
2f01fe57 AD |
68 | } |
69 | .claro .dijitTabCloseButtonHover { | |
81bea17a | 70 | background-position: -14px; |
2f01fe57 AD |
71 | } |
72 | .claro .dijitTabCloseButtonActive { | |
81bea17a | 73 | background-position: -28px; |
2f01fe57 AD |
74 | } |
75 | .claro .dijitTabSpacer { | |
81bea17a AD |
76 | /* set the spacer invisible. note that height:0 doesn't work on IE/quirks, it's still 10px. */ |
77 | ||
78 | display: none; | |
2f01fe57 | 79 | } |
f0cfe83e AD |
80 | .claro .dijitTab { |
81 | border: 1px solid #b5bcc7; | |
81bea17a AD |
82 | background-color: #efefef; |
83 | -webkit-transition-property: background-color, border; | |
84 | -moz-transition-property: background-color, border; | |
85 | transition-property: background-color, border; | |
86 | -webkit-transition-duration: 0.35s; | |
87 | -moz-transition-duration: 0.35s; | |
88 | transition-duration: 0.35s; | |
1354d172 | 89 | color: #494949; |
2f01fe57 | 90 | } |
f0cfe83e AD |
91 | .claro .dijitTabHover { |
92 | border-color: #759dc0; | |
81bea17a AD |
93 | background-color: #abd6ff; |
94 | -webkit-transition-duration: 0.25s; | |
95 | -moz-transition-duration: 0.25s; | |
96 | transition-duration: 0.25s; | |
97 | color: #000000; | |
2f01fe57 | 98 | } |
f0cfe83e AD |
99 | .claro .dijitTabActive { |
100 | border-color: #759dc0; | |
1354d172 | 101 | background-color: #7dbdfa; |
81bea17a AD |
102 | color: #000000; |
103 | -webkit-transition-duration: 0.1s; | |
104 | -moz-transition-duration: 0.1s; | |
105 | transition-duration: 0.1s; | |
2f01fe57 | 106 | } |
f0cfe83e AD |
107 | .claro .dijitTabChecked { |
108 | border-color: #b5bcc7; | |
81bea17a AD |
109 | background-color: #cfe5fa; |
110 | color: #000000; | |
2f01fe57 | 111 | } |
f0cfe83e AD |
112 | .claro .dijitTabDisabled { |
113 | background-color: #d3d3d3; | |
2f01fe57 | 114 | } |
f0cfe83e | 115 | .claro .tabStripButton { |
81bea17a | 116 | background-color: transparent; |
81bea17a | 117 | border: none; |
2f01fe57 | 118 | } |
81bea17a AD |
119 | /*** end common ***/ |
120 | /*************** top tab ***************/ | |
2f01fe57 | 121 | .claro .dijitTabContainerTop-tabs .dijitTab { |
f0cfe83e AD |
122 | /* unselected (and not hovered/pressed) tab */ |
123 | ||
81bea17a AD |
124 | top: 1px; |
125 | /* used for overlap */ | |
126 | ||
127 | margin-right: 1px; | |
81bea17a AD |
128 | padding: 3px 6px; |
129 | border-bottom-width: 0; | |
81bea17a AD |
130 | min-width: 60px; |
131 | text-align: center; | |
f0cfe83e | 132 | background-image: url("images/tabTopUnselected.png"); |
81bea17a | 133 | background-repeat: repeat-x; |
f0cfe83e AD |
134 | background-image: -moz-linear-gradient(top, #ffffff 0px, #ffffff 1px, rgba(255, 255, 255, 0.1) 2px, rgba(255, 255, 255, 0.6) 7px, rgba(255, 255, 255, 0) 100%); |
135 | background-image: -webkit-linear-gradient(top, #ffffff 0px, #ffffff 1px, rgba(255, 255, 255, 0.1) 2px, rgba(255, 255, 255, 0.6) 7px, rgba(255, 255, 255, 0) 100%); | |
136 | background-image: -o-linear-gradient(top, #ffffff 0px, #ffffff 1px, rgba(255, 255, 255, 0.1) 2px, rgba(255, 255, 255, 0.6) 7px, rgba(255, 255, 255, 0) 100%); | |
137 | background-image: linear-gradient(top, #ffffff 0px, #ffffff 1px, rgba(255, 255, 255, 0.1) 2px, rgba(255, 255, 255, 0.6) 7px, rgba(255, 255, 255, 0) 100%); | |
81bea17a AD |
138 | -webkit-box-shadow: 0 -1px 1px rgba(0, 0, 0, 0.04); |
139 | -moz-box-shadow: 0 -1px 1px rgba(0, 0, 0, 0.04); | |
140 | box-shadow: 0 -1px 1px rgba(0, 0, 0, 0.04); | |
141 | } | |
f0cfe83e AD |
142 | .claro .dijitTabContainerTop-tabs .dijitTabChecked { |
143 | /* selected tab */ | |
144 | ||
145 | padding-bottom: 4px; | |
146 | padding-top: 9px; | |
147 | background-image: url("images/tabTopSelected.png"); | |
148 | background-image: -moz-linear-gradient(top, #ffffff 0px, #ffffff 1px, rgba(255, 255, 255, 0) 2px, #ffffff 7px); | |
149 | background-image: -webkit-linear-gradient(top, #ffffff 0px, #ffffff 1px, rgba(255, 255, 255, 0) 2px, #ffffff 7px); | |
150 | background-image: -o-linear-gradient(top, #ffffff 0px, #ffffff 1px, rgba(255, 255, 255, 0) 2px, #ffffff 7px); | |
151 | background-image: linear-gradient(top, #ffffff 0px, #ffffff 1px, rgba(255, 255, 255, 0) 2px, #ffffff 7px); | |
81bea17a AD |
152 | -webkit-box-shadow: 0 -1px 2px rgba(0, 0, 0, 0.05); |
153 | -moz-box-shadow: 0 -1px 2px rgba(0, 0, 0, 0.05); | |
154 | box-shadow: 0 -1px 2px rgba(0, 0, 0, 0.05); | |
2f01fe57 | 155 | } |
81bea17a AD |
156 | /** end top tab **/ |
157 | /*************** bottom tab ***************/ | |
2f01fe57 | 158 | .claro .dijitTabContainerBottom-tabs .dijitTab { |
f0cfe83e AD |
159 | /* unselected (and not hovered/pressed) tab */ |
160 | ||
81bea17a AD |
161 | top: -1px; |
162 | /* used for overlap */ | |
163 | ||
164 | margin-right: 1px; | |
81bea17a AD |
165 | padding: 3px 6px; |
166 | border-top-width: 0; | |
81bea17a AD |
167 | min-width: 60px; |
168 | text-align: center; | |
f0cfe83e | 169 | background-image: url("images/tabBottomUnselected.png"); |
81bea17a | 170 | background-repeat: repeat-x; |
f0cfe83e AD |
171 | background-position: bottom; |
172 | background-image: -moz-linear-gradient(bottom, #ffffff 0px, #ffffff 1px, rgba(255, 255, 255, 0.1) 2px, rgba(255, 255, 255, 0.6) 7px, rgba(255, 255, 255, 0) 100%); | |
173 | background-image: -webkit-linear-gradient(bottom, #ffffff 0px, #ffffff 1px, rgba(255, 255, 255, 0.1) 2px, rgba(255, 255, 255, 0.6) 7px, rgba(255, 255, 255, 0) 100%); | |
174 | background-image: -o-linear-gradient(bottom, #ffffff 0px, #ffffff 1px, rgba(255, 255, 255, 0.1) 2px, rgba(255, 255, 255, 0.6) 7px, rgba(255, 255, 255, 0) 100%); | |
175 | background-image: linear-gradient(bottom, #ffffff 0px, #ffffff 1px, rgba(255, 255, 255, 0.1) 2px, rgba(255, 255, 255, 0.6) 7px, rgba(255, 255, 255, 0) 100%); | |
81bea17a AD |
176 | -webkit-box-shadow: 0 1px 1px rgba(0, 0, 0, 0.04); |
177 | -moz-box-shadow: 0 1px 1px rgba(0, 0, 0, 0.04); | |
178 | box-shadow: 0 1px 1px rgba(0, 0, 0, 0.04); | |
179 | } | |
f0cfe83e | 180 | /* selected tab */ |
2f01fe57 | 181 | .claro .dijitTabContainerBottom-tabs .dijitTabChecked { |
f0cfe83e AD |
182 | padding-bottom: 9px; |
183 | padding-top: 4px; | |
184 | background-image: url("images/tabBottomSelected.png"); | |
185 | background-image: -moz-linear-gradient(bottom, #ffffff 0px, #ffffff 1px, rgba(255, 255, 255, 0) 2px, #ffffff 7px); | |
186 | background-image: -webkit-linear-gradient(bottom, #ffffff 0px, #ffffff 1px, rgba(255, 255, 255, 0) 2px, #ffffff 7px); | |
187 | background-image: -o-linear-gradient(bottom, #ffffff 0px, #ffffff 1px, rgba(255, 255, 255, 0) 2px, #ffffff 7px); | |
188 | background-image: linear-gradient(bottom, #ffffff 0px, #ffffff 1px, rgba(255, 255, 255, 0) 2px, #ffffff 7px); | |
81bea17a AD |
189 | -webkit-box-shadow: 0 1px 2px rgba(0, 0, 0, 0.05); |
190 | -moz-box-shadow: 0 1px 2px rgba(0, 0, 0, 0.05); | |
191 | box-shadow: 0 1px 2px rgba(0, 0, 0, 0.05); | |
2f01fe57 | 192 | } |
81bea17a AD |
193 | /** end bottom tab **/ |
194 | /*************** left tab ***************/ | |
2f01fe57 | 195 | .claro .dijitTabContainerLeft-tabs .dijitTab { |
f0cfe83e AD |
196 | /* unselected (and not hovered/pressed) tab */ |
197 | ||
81bea17a AD |
198 | left: 1px; |
199 | /* used for overlap */ | |
200 | ||
201 | margin-bottom: 1px; | |
81bea17a | 202 | padding: 3px 8px 4px 4px; |
f0cfe83e | 203 | background-image: url("images/tabLeftUnselected.png"); |
81bea17a | 204 | background-repeat: repeat-y; |
f0cfe83e AD |
205 | background-image: -moz-linear-gradient(left, #ffffff 0px, #ffffff 1px, rgba(255, 255, 255, 0.1) 2px, rgba(255, 255, 255, 0.6) 7px, rgba(255, 255, 255, 0) 100%); |
206 | background-image: -webkit-linear-gradient(left, #ffffff 0px, #ffffff 1px, rgba(255, 255, 255, 0.1) 2px, rgba(255, 255, 255, 0.6) 7px, rgba(255, 255, 255, 0) 100%); | |
207 | background-image: -o-linear-gradient(left, #ffffff 0px, #ffffff 1px, rgba(255, 255, 255, 0.1) 2px, rgba(255, 255, 255, 0.6) 7px, rgba(255, 255, 255, 0) 100%); | |
208 | background-image: linear-gradient(left, #ffffff 0px, #ffffff 1px, rgba(255, 255, 255, 0.1) 2px, rgba(255, 255, 255, 0.6) 7px, rgba(255, 255, 255, 0) 100%); | |
2f01fe57 | 209 | } |
f0cfe83e AD |
210 | /* selected tab */ |
211 | .claro .dijitTabContainerLeft-tabs .dijitTabChecked { | |
212 | border-right-width: 0; | |
81bea17a | 213 | padding-right: 9px; |
f0cfe83e AD |
214 | background-image: url("images/tabLeftSelected.png"); |
215 | background-image: -moz-linear-gradient(left, rgba(255, 255, 255, 0.5) 0px, #ffffff 30px); | |
216 | background-image: -webkit-linear-gradient(left, rgba(255, 255, 255, 0.5) 0px, #ffffff 30px); | |
217 | background-image: -o-linear-gradient(left, rgba(255, 255, 255, 0.5) 0px, #ffffff 30px); | |
218 | background-image: linear-gradient(left, rgba(255, 255, 255, 0.5) 0px, #ffffff 30px); | |
81bea17a AD |
219 | -webkit-box-shadow: -1px 0 2px rgba(0, 0, 0, 0.05); |
220 | -moz-box-shadow: -1px 0 2px rgba(0, 0, 0, 0.05); | |
221 | box-shadow: -1px 0 2px rgba(0, 0, 0, 0.05); | |
222 | } | |
223 | /** end left tab **/ | |
224 | /*************** right tab ***************/ | |
2f01fe57 | 225 | .claro .dijitTabContainerRight-tabs .dijitTab { |
f0cfe83e AD |
226 | /* unselected (and not hovered/pressed) tab */ |
227 | ||
81bea17a AD |
228 | left: -1px; |
229 | /* used for overlap */ | |
230 | ||
231 | margin-bottom: 1px; | |
81bea17a | 232 | padding: 3px 8px 4px 4px; |
f0cfe83e | 233 | background-image: url("images/tabRightUnselected.png"); |
81bea17a | 234 | background-repeat: repeat-y; |
f0cfe83e AD |
235 | background-position: right; |
236 | background-image: -moz-linear-gradient(right, #ffffff 0px, #ffffff 1px, rgba(255, 255, 255, 0.1) 2px, rgba(255, 255, 255, 0.6) 7px, rgba(255, 255, 255, 0) 100%); | |
237 | background-image: -webkit-linear-gradient(right, #ffffff 0px, #ffffff 1px, rgba(255, 255, 255, 0.1) 2px, rgba(255, 255, 255, 0.6) 7px, rgba(255, 255, 255, 0) 100%); | |
238 | background-image: -o-linear-gradient(right, #ffffff 0px, #ffffff 1px, rgba(255, 255, 255, 0.1) 2px, rgba(255, 255, 255, 0.6) 7px, rgba(255, 255, 255, 0) 100%); | |
239 | background-image: linear-gradient(right, #ffffff 0px, #ffffff 1px, rgba(255, 255, 255, 0.1) 2px, rgba(255, 255, 255, 0.6) 7px, rgba(255, 255, 255, 0) 100%); | |
240 | } | |
241 | .claro .dijitTabContainerRight-tabs .dijitTabChecked { | |
242 | /* selected tab */ | |
243 | ||
81bea17a | 244 | padding-left: 5px; |
f0cfe83e AD |
245 | border-left-width: 0; |
246 | background-image: url("images/tabRightSelected.png"); | |
247 | background-image: -moz-linear-gradient(right, rgba(255, 255, 255, 0.5) 0px, #ffffff 30px); | |
248 | background-image: -webkit-linear-gradient(right, rgba(255, 255, 255, 0.5) 0px, #ffffff 30px); | |
249 | background-image: -o-linear-gradient(right, rgba(255, 255, 255, 0.5) 0px, #ffffff 30px); | |
250 | background-image: linear-gradient(right, rgba(255, 255, 255, 0.5) 0px, #ffffff 30px); | |
81bea17a AD |
251 | -webkit-box-shadow: 1px 0 2px rgba(0, 0, 0, 0.07); |
252 | -moz-box-shadow: 1px 0 2px rgba(0, 0, 0, 0.07); | |
253 | box-shadow: 1px 0 2px rgba(0, 0, 0, 0.07); | |
254 | } | |
255 | /** end right tab **/ | |
256 | /** round corner **/ | |
f0cfe83e | 257 | .claro .dijitTabContainerTop-tabs .dijitTab { |
81bea17a AD |
258 | -moz-border-radius: 2px 2px 0 0; |
259 | border-radius: 2px 2px 0 0; | |
260 | } | |
f0cfe83e | 261 | .claro .dijitTabContainerBottom-tabs .dijitTab { |
81bea17a AD |
262 | -moz-border-radius: 0 0 2px 2px; |
263 | border-radius: 0 0 2px 2px; | |
264 | } | |
f0cfe83e | 265 | .claro .dijitTabContainerLeft-tabs .dijitTab { |
81bea17a AD |
266 | -moz-border-radius: 2px 0 0 2px; |
267 | border-radius: 2px 0 0 2px; | |
268 | } | |
f0cfe83e | 269 | .claro .dijitTabContainerRight-tabs .dijitTab { |
81bea17a AD |
270 | -moz-border-radius: 0 2px 2px 0; |
271 | border-radius: 0 2px 2px 0; | |
272 | } | |
273 | /************ left/right scroll buttons + menu button ************/ | |
2f01fe57 | 274 | .claro .tabStripButton { |
1354d172 | 275 | background-color: #e5f2fe; |
81bea17a | 276 | border: 1px solid #b5bcc7; |
2f01fe57 AD |
277 | } |
278 | .claro .dijitTabListContainer-top .tabStripButton { | |
81bea17a AD |
279 | padding: 4px 3px; |
280 | margin-top: 7px; | |
f0cfe83e AD |
281 | background-image: -moz-linear-gradient(top, #ffffff 0px, rgba(255, 255, 255, 0.1) 1px, rgba(255, 255, 255, 0.6) 6px, rgba(255, 255, 255, 0) 100%); |
282 | background-image: -webkit-linear-gradient(top, #ffffff 0px, rgba(255, 255, 255, 0.1) 1px, rgba(255, 255, 255, 0.6) 6px, rgba(255, 255, 255, 0) 100%); | |
283 | background-image: -o-linear-gradient(top, #ffffff 0px, rgba(255, 255, 255, 0.1) 1px, rgba(255, 255, 255, 0.6) 6px, rgba(255, 255, 255, 0) 100%); | |
284 | background-image: linear-gradient(top, #ffffff 0px, rgba(255, 255, 255, 0.1) 1px, rgba(255, 255, 255, 0.6) 6px, rgba(255, 255, 255, 0) 100%); | |
2f01fe57 AD |
285 | } |
286 | .claro .dijitTabListContainer-bottom .tabStripButton { | |
f0cfe83e AD |
287 | padding: 4px 3px; |
288 | margin-bottom: 7px; | |
289 | background-image: -moz-linear-gradient(bottom, #ffffff 0px, rgba(255, 255, 255, 0.1) 1px, rgba(255, 255, 255, 0.6) 6px, rgba(255, 255, 255, 0) 100%); | |
290 | background-image: -webkit-linear-gradient(bottom, #ffffff 0px, rgba(255, 255, 255, 0.1) 1px, rgba(255, 255, 255, 0.6) 6px, rgba(255, 255, 255, 0) 100%); | |
291 | background-image: -o-linear-gradient(bottom, #ffffff 0px, rgba(255, 255, 255, 0.1) 1px, rgba(255, 255, 255, 0.6) 6px, rgba(255, 255, 255, 0) 100%); | |
292 | background-image: linear-gradient(bottom, #ffffff 0px, rgba(255, 255, 255, 0.1) 1px, rgba(255, 255, 255, 0.6) 6px, rgba(255, 255, 255, 0) 100%); | |
2f01fe57 AD |
293 | } |
294 | .claro .tabStripButtonHover { | |
81bea17a | 295 | background-color: #abd6ff; |
2f01fe57 AD |
296 | } |
297 | .claro .tabStripButtonActive { | |
1354d172 | 298 | background-color: #7dbdfa; |
2f01fe57 AD |
299 | } |
300 | .claro .dijitTabStripIcon { | |
81bea17a AD |
301 | height: 15px; |
302 | width: 15px; | |
303 | margin: 0 auto; | |
304 | background: url("../form/images/buttonArrows.png") no-repeat -75px 50%; | |
305 | background-color: transparent; | |
2f01fe57 | 306 | } |
81bea17a AD |
307 | .claro .dijitTabStripSlideRightIcon { |
308 | background-position: -24px 50%; | |
2f01fe57 AD |
309 | } |
310 | .claro .dijitTabStripMenuIcon { | |
81bea17a | 311 | background-position: -51px 50%; |
2f01fe57 | 312 | } |
81bea17a AD |
313 | /*disabled styles for tab strip buttons*/ |
314 | .claro .dijitTabListContainer-top .tabStripButtonDisabled, .claro .dijitTabListContainer-bottom .tabStripButtonDisabled { | |
315 | background-color: #d3d3d3; | |
316 | border: 1px solid #b5bcc7; | |
317 | /* to match border of TabContainer itself */ | |
318 | ||
2f01fe57 AD |
319 | } |
320 | .claro .tabStripButtonDisabled .dijitTabStripSlideLeftIcon { | |
81bea17a | 321 | background-position: -175px 50%; |
2f01fe57 AD |
322 | } |
323 | .claro .tabStripButtonDisabled .dijitTabStripSlideRightIcon { | |
81bea17a | 324 | background-position: -124px 50%; |
2f01fe57 AD |
325 | } |
326 | .claro .tabStripButtonDisabled .dijitTabStripMenuIcon { | |
81bea17a AD |
327 | background-position: -151px 50%; |
328 | } | |
329 | /* Nested Tabs */ | |
2f01fe57 | 330 | .claro .dijitTabContainerNested .dijitTabListWrapper { |
81bea17a | 331 | height: auto; |
2f01fe57 AD |
332 | } |
333 | .claro .dijitTabContainerNested .dijitTabContainerTop-tabs { | |
81bea17a | 334 | border-bottom: solid 1px #b5bcc7; |
f0cfe83e | 335 | padding: 2px 2px 4px; |
2f01fe57 | 336 | } |
f0cfe83e | 337 | .claro .dijitTabContainerTabListNested .dijitTab { |
81bea17a AD |
338 | background: rgba(255, 255, 255, 0) none repeat scroll 0 0; |
339 | border: none; | |
340 | padding: 4px; | |
341 | border-color: rgba(118, 157, 192, 0); | |
342 | -webkit-transition-property: background-color, border-color; | |
343 | -moz-transition-property: background-color, border-color; | |
344 | transition-property: background-color, border-color; | |
345 | -webkit-transition-duration: 0.3s; | |
346 | -moz-transition-duration: 0.3s; | |
347 | transition-duration: 0.3s; | |
348 | -moz-border-radius: 2px; | |
349 | border-radius: 2px; | |
2f01fe57 | 350 | } |
f0cfe83e | 351 | .claro .dijitTabContainerTabListNested .dijitTab { |
81bea17a AD |
352 | background: none; |
353 | border: none; | |
354 | top: 0; | |
355 | /* to override top: 1px/-1px for normal tabs */ | |
356 | ||
357 | -webkit-box-shadow: none; | |
358 | -moz-box-shadow: none; | |
359 | box-shadow: none; | |
2f01fe57 | 360 | } |
f0cfe83e | 361 | .claro .dijitTabContainerTabListNested .dijitTabHover { |
1354d172 | 362 | background-color: #e5f2fe; |
81bea17a AD |
363 | border: solid 1px #cfe5fa; |
364 | padding: 3px; | |
365 | -webkit-transition-duration: 0.2s; | |
366 | -moz-transition-duration: 0.2s; | |
367 | transition-duration: 0.2s; | |
2f01fe57 AD |
368 | } |
369 | .claro .dijitTabContainerTabListNested .dijitTabHover .tabLabel { | |
81bea17a | 370 | text-decoration: none; |
2f01fe57 | 371 | } |
f0cfe83e | 372 | .claro .dijitTabContainerTabListNested .dijitTabActive { |
1354d172 | 373 | border: solid 1px #759dc0; |
81bea17a | 374 | padding: 3px; |
f0cfe83e AD |
375 | background: #abd6ff url("images/tabNested.png") repeat-x; |
376 | background-image: -moz-linear-gradient(rgba(255, 255, 255, 0.61) 0%, rgba(255, 255, 255, 0) 17%, rgba(255, 255, 255, 0) 83%, rgba(255, 255, 255, 0.61) 100%); | |
377 | background-image: -webkit-linear-gradient(rgba(255, 255, 255, 0.61) 0%, rgba(255, 255, 255, 0) 17%, rgba(255, 255, 255, 0) 83%, rgba(255, 255, 255, 0.61) 100%); | |
378 | background-image: -o-linear-gradient(rgba(255, 255, 255, 0.61) 0%, rgba(255, 255, 255, 0) 17%, rgba(255, 255, 255, 0) 83%, rgba(255, 255, 255, 0.61) 100%); | |
379 | background-image: linear-gradient(rgba(255, 255, 255, 0.61) 0%, rgba(255, 255, 255, 0) 17%, rgba(255, 255, 255, 0) 83%, rgba(255, 255, 255, 0.61) 100%); | |
81bea17a AD |
380 | -webkit-transition-duration: 0.1s; |
381 | -moz-transition-duration: 0.1s; | |
382 | transition-duration: 0.1s; | |
2f01fe57 | 383 | } |
f0cfe83e | 384 | .claro .dijitTabContainerTabListNested .dijitTabChecked { |
81bea17a | 385 | padding: 3px; |
1354d172 | 386 | border: solid 1px #759dc0; |
81bea17a | 387 | background-color: #cfe5fa; |
2f01fe57 AD |
388 | } |
389 | .claro .dijitTabContainerTabListNested .dijitTabChecked .tabLabel { | |
81bea17a AD |
390 | text-decoration: none; |
391 | background-image: none; | |
2f01fe57 AD |
392 | } |
393 | .claro .dijitTabPaneWrapperNested { | |
81bea17a AD |
394 | border: none; |
395 | /* prevent double border */ | |
396 | ||
2f01fe57 | 397 | } |
f0cfe83e AD |
398 | .claro .dijitTab, .claro .tabStripButton { |
399 | _background-image: none !important; | |
2f01fe57 | 400 | } |