]> git.wh0rd.org Git - tt-rss.git/blob - css/dijit.css
add custom styles for .dijitDropDownButton
[tt-rss.git] / css / dijit.css
1 /* Tree */
2
3 .claro .dijitTreeRow .dijitCheckBox {
4         position : relative;
5         top : -2px;
6 }
7
8 .claro .dijitTreeLabel {
9         outline : 0;
10 }
11
12 .claro .dijitTree .feedParam {
13         color : #555;
14         float : right;
15         margin-right : 1em;
16 }
17
18 .claro .dijitTree .filterRules {
19         display : block;
20         color : #ccc;
21         font-size : 10px;
22         margin-left : 100px;
23 }
24
25 .claro .dijitTree .filterRules span {
26         display : block;
27         color : green;
28 }
29
30 #filterDlg_Matches span.filterRule {
31         color : green;
32 }
33
34 .claro .dijitTree .filterRules span.inverse,
35 #filterDlg_Matches span.filterRule.inverse {
36         color : red;
37 }
38
39
40 .claro .dijitTree .labelParam {
41         float : right;
42         margin-right : 1em;
43 }
44
45 .claro .dijitTree .dijitTreeLabel.Disabled, 
46 .claro .dijitTree .labelParam.Disabled {
47         color : #555;
48 }
49
50 .claro .dijitTreeRow.Error {
51         color : red;
52 }
53
54 .claro .dijitTreeRow.Hidden {
55         display : none;
56 }
57
58 .claro .dijitTreeNode .loadingNode {
59         margin-left : 3px;
60         height : 9px;
61 }
62
63 .claro .dijitFolderClosed,
64 .claro .dijitFolderOpened {
65         display : none;
66 }
67
68 .claro .dijitTreeNode .dijitCheckBox {
69         margin-left : 4px;
70 }
71
72 .claro .dijitTreeIsRoot > .dijitTreeRow > .dijitTreeExpando {
73         margin-left : 5px;
74 }
75
76 .claro .dijitTree .dijitTreeExpando {
77         margin-top : 0px;
78         opacity : 0.6;
79 }
80
81 .claro .dijitTree .dijitTreeNode {
82         padding : 0px;
83         border-width : 0px;
84 }
85
86 .claro .dijitTree .dijitTreeRow {
87         max-width: 100%;
88         overflow: hidden;
89         text-overflow: ellipsis;
90 }
91
92 .claro .dijitTree .dijitTreeRowSelected {
93         background : white;
94 }
95
96 .claro #feedTree.dijitTree .dijitTreeRowSelected {
97         box-shadow : -1px 0px 2px -1px rgba(0,0,0,0.1);
98 }
99
100 .claro .dijitTree .dijitTreeRowHover {
101         background : #f0f0f0;
102         border-color : #ddd;
103 }
104
105 .claro .dijitTree .dijitTreeRowSelected {
106         background : white;
107         border-color : #ddd;
108 }
109
110 .claro .dijitTreeRowSelected .dijitTreeLabel {
111         text-shadow : 1px 1px 2px #fff;
112 }
113
114 .claro .dijitTreeRow .dijitTreeExpando {
115         background-image: url("../images/treeExpandImages.png");
116         position : relative;
117         top : -1px;
118 }
119
120 .claro .dijitTreeRow .dijitTreeExpandoLeaf {
121         background : none;
122
123
124 /* Toolbar */
125
126 .claro .dijitToolbar {
127         background : #f5f5f5;
128         border-color : #ddd;
129         /* text-rendering: optimizelegibility;
130         font-family : "Segoe WP Semibold", "Segoe UI Semibold", 
131                 "Segoe UI Web Semibold", "Segoe UI", "Helvetica Neue",
132                 Helvetica, Arial, sans-serif; */
133 }
134
135 /* .claro .dijitToolbar {
136         text-shadow : 1px 1px 2px #fff;
137 } */
138
139 .claro .dijitDialog .dijitToolbar {
140         border : 1px solid #ddd;
141 }
142
143 /* Dialog */
144
145 .claro .dijitDialog h2 {
146         margin-top : 0px;
147         margin-bottom : 4px;
148         border-width : 0px;
149 }
150
151 .claro .dijitMenuItemLabel {
152         font-size : 13px;
153 }
154
155 /* Checkbox */
156
157 .claro .dijitCheckBox {
158         background-image : url("../images/untick.png");
159         background-color : transparent;
160         width : 15px;
161         height : 15px;
162         margin : 1px;
163         opacity : 0.7;
164         background-position : center center;    
165         transition : opacity 0.25s;
166         -webkit-transition : opacity 0.25s;
167         /* border : 1px solid #b5bcc7; */
168         padding : 1px;
169 }
170
171  .claro .dijitCheckBox:hover {
172         opacity : 1;
173 }
174
175 .claro .dijitCheckBox.dijitCheckBoxDisabled:hover {
176         opacity : 0.7;
177 }
178
179 .claro .dijitCheckBox.dijitCheckBoxChecked {
180         border-color : #69C671;
181         background-image : url("../images/tick.png");
182         opacity : 1;
183 }
184
185 /* Various buttons */
186
187 .claro .dijitButton .dijitButtonNode,
188 .claro .dijitDropDownButton .dijitButtonNode,
189 .claro .dijitComboButton .dijitButtonNode, 
190 .claro .dijitToolbar .dijitDropDownButton .dijitButtonNode,
191 .claro .dijitToolbar .dijitComboButton,
192 .claro .dijitToolbar .dijitComboButton .dijitButtonNode {
193         background : none;
194         border-color : transparent;
195         box-shadow : none;
196 }
197
198 button,
199 input[type="submit"] {
200         font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
201         font-size : 14px;
202 }
203
204 button,
205 input[type="submit"],
206 .claro .dijitButton,
207 .claro .dijitDropDownButton .dijitDownArrowButton,
208 .claro .dijitComboButton {
209   display: inline-block;
210   padding: 4px 12px;
211   margin-bottom: 0;
212   font-size: 14px;
213   line-height: 20px;
214   color: #333333;
215   text-align: center;
216   text-shadow: 0 1px 1px rgba(255, 255, 255, 0.75);
217   vertical-align: middle;
218   cursor: pointer;
219   background-color: #f5f5f5;
220   background-image: -moz-linear-gradient(top, #ffffff, #e6e6e6);
221   background-image: -webkit-linear-gradient(top, #ffffff, #e6e6e6);
222   background-image: linear-gradient(to bottom, #ffffff, #e6e6e6);
223   background-repeat: repeat-x;
224   border: 1px solid #cccccc;
225   border-color: rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.25);
226   border-bottom-color: #b3b3b3;
227   -webkit-border-radius: 4px;
228   border-radius: 4px;
229   -webkit-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.2), 0 1px 2px rgba(0, 0, 0, 0.05);
230   box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.2), 0 1px 2px rgba(0, 0, 0, 0.05);
231 }
232
233 button:hover,
234 button:focus,
235 button:active,
236 input[type="submit"]:hover,
237 input[type="submit"]:focus,
238 input[type="submit"]:active,
239 .claro .dijitButton:hover,
240 .claro .dijitButton:focus,
241 .claro .dijitButton:active,
242 .claro .dijitDropDownButton .dijitDownArrowButton:hover,
243 .claro .dijitDropDownButton .dijitDownArrowButton:focus,
244 .claro .dijitDropDownButton .dijitDownArrowButton:active,
245 .claro .dijitComboButton:hover,
246 .claro .dijitComboButton:focus,
247 .claro .dijitComboButton:active,
248 .claro .dijitButton.dijitButtonDisabled {
249   color: #333333;
250   background-color: #e6e6e6;
251 }
252
253 button:active,
254 input[type="submit"]:active,
255 .claro .dijitButton:active,
256 .claro .dijitDropDownButton .dijitDownArrowButton:active,
257 .claro .dijitComboButton:active {
258         background-color: #cccccc \9;
259 }
260
261 .claro .dijitToolbar .dijitButton,
262 .claro .dijitToolbar .dijitButton.dijitHover,
263 .claro .dijitToolbar .dijitComboButton,
264 .claro .dijitToolbar .dijitDropDownButton .dijitDownArrowButton,
265 .claro .dijitToolbar .dijitComboButton.dijitHover {
266         background : none;
267         border-color : transparent;
268         box-shadow : none;
269         padding : 0px;
270         margin : 0px;
271         line-height : auto;
272         text-shadow : none;
273 }
274
275 .claro .dijitToolbar .dijitDropDownButton .dijitButtonText,
276 .claro .dijitToolbar .dijitComboButton .dijitButtonText {
277         padding : 0px;
278 }
279
280 .claro .dijitToolbar .dijitDropDownButton .dijitButtonNode {
281         border-radius : 4px;
282 }
283
284 .claro .dijitToolbar .dijitButton.dijitHover,
285 .claro .dijitToolbar .dijitDropDownButton.dijitHover .dijitButtonNode,
286 .claro .dijitToolbar .dijitComboButton.dijitHover {
287         border-color : #ccc;
288 }
289
290 .claro .dijitToolbar .dijitButton.dijitHover .dijitButtonNode,
291 .claro .dijitToolbar .dijitButton.dijitButtonActive .dijitButtonNode {
292         background : none;
293 }
294
295 .claro .dijitToolbar .dijitButton .dijitButtonContents,
296 .claro .dijitToolbar .dijitDropDownButton .dijitButtonContents,
297 .claro .dijitToolbar .dijitComboButton .dijitButtonContents {
298         font-size : 13px;
299 }
300
301 button:hover,
302 button:focus,
303 input[type="submit"]:hover,
304 input[type="submit"]:focus,
305 .claro .dijitButton:hover,
306 .claro .dijitDropDownButton .dijitDownArrowButton:hover,
307 .claro .dijitToolbar .dijitButton:hover .dijitButtonNode,
308 .claro .dijitToolbar .dijitButton.dijitHover .dijitButtonNode,
309 .claro .dijitButton:focus,
310 .claro .dijitComboButton:hover,
311 .claro .dijitComboButton:focus {
312   color: #333333;
313   text-decoration: none;
314   background-position: 0 -15px;
315   -webkit-transition: background-position 0.1s linear;
316   transition: background-position 0.1s linear;
317 }
318
319 button:focus,
320 input[type="submit"]:focus,
321 .claro .dijitButton:focus,
322 .claro .dijitDropDownButton .dijitDownArrowButton:focus,
323 .claro .dijitComboButton:focus {
324   outline: thin dotted #333;
325   outline: 5px auto -webkit-focus-ring-color;
326   outline-offset: -2px;
327 }
328
329 button:active,
330 input[type="submit"]:active,
331 .claro .dijitButton:active,
332 .claro .dijitComboButton:active,
333 .claro .dijitToolbar .dijitDropDownButton.dijitOpened,
334 .claro .dijitToolbar .dijitComboButton.dijitOpened,
335 .claro .dijitToolbar .dijitButton.dijitButtonActive .dijitButtonNode {
336   background-image: none;
337   outline: 0;
338   -webkit-box-shadow: inset 0 2px 4px rgba(0, 0, 0, 0.15), 0 1px 2px rgba(0, 0, 0, 0.05);
339   box-shadow: inset 0 2px 4px rgba(0, 0, 0, 0.15), 0 1px 2px rgba(0, 0, 0, 0.05);
340 }
341
342 input[type="submit"][disabled],
343 button[disabled],
344 .claro .dijitButton[disabled],
345 .claro .dijitDropDownButton .dijitDownArrowButton[disabled],
346 .claro .dijitButton.dijitButtonDisabled,
347 .claro .dijitComboButton.dijitButtonDisabled {
348   cursor: default;
349   background-image: none;
350   opacity: 0.65;
351   filter: alpha(opacity=65);
352   -webkit-box-shadow: none;
353   box-shadow: none;
354 }
355
356 .claro .dijitButton .dijitButtonContents,
357 .claro .dijitDropDownButton .dijitButtonContents,
358 .claro .dijitComboButton .dijitButtonContents {
359         font-size : 14px;
360         font-weight : normal;
361         line-height : 20px;
362 }
363
364 .claro .dijitButton.small .dijitButtonText {
365         font-size : 11px;
366 }
367
368 .claro .dijitMenu {
369         border-color : #ccc;
370 }
371
372 .claro .dijitMenu .dijitMenuItem.dijitHover,
373 .claro .dijitMenu .dijitMenuItem.dijitFocused,
374 .claro .dijitMenuTable .dijitMenuItem.dijitHover .dijitMenuItemLabel,
375 .claro .dijitMenuTable .dijitMenuItem.dijitFocused .dijitMenuItemLabel {
376         background : #eee;
377         border-color : transparent;
378 }
379
380 .claro .dijitButton .dijitButtonNode,
381 .claro .dijitComboButton .dijitButtonNode {
382         padding : 0px;
383 }
384
385 /* Other stuff */
386
387 /* .claro .dijitAccordionTitleFocus {
388         text-shadow : 1px 1px 2px #fff;
389
390
391 .claro .dijitAccordionTitle {
392         text-rendering: optimizelegibility;
393         font-family : "Segoe WP Semibold", "Segoe UI Semibold", 
394                 "Segoe UI Web Semibold", "Segoe UI", "Helvetica Neue",
395                 Helvetica, Arial, sans-serif;
396 } */
397
398 .claro .dijitAccordionInnerContainer.dijitAccordionInnerContainerSelected {
399         border-color : #ccc;
400 }
401
402 .claro .dijitAccordionContainer .dijitAccordionChildWrapper {
403         border-color : #ddd;
404 }
405
406 /* Tabs */
407
408 .claro .dijitTabContent {
409         background : #eee;
410 }
411
412 .claro .dijitTabContent.dijitTabChecked,
413 .claro .dijitTabContent.dijitTabHover,
414 .claro .dijitTabContent.dijitFocused {
415         background : white;
416 }
417
418 .claro .dijitTabPaneWrapper, 
419 .claro .dijitTabContainerTop-tabs,
420 .claro .dijitTab,
421 .claro .dijitAccordionInnerContainer {
422         border-color : #ddd;
423 }
424