]> git.wh0rd.org - tt-rss.git/blame - lib/dijit/themes/claro/layout/AccordionContainer.css
remove call-by-reference to comply with php 5.4
[tt-rss.git] / lib / dijit / themes / claro / layout / AccordionContainer.css
CommitLineData
81bea17a
AD
1/* Accordion
2 *
3 * Styling AccordionContainer basically means styling the accordion pane (dijitAccordionInnerContainer)
4 * and the title inside of it (dijitAccordionTitle). There are 4 basic states to style:
5 *
6 * 1. closed pane (and default styling):
7 * .dijitAccordionInnerContainer - container for each accordion child
8 * .dijitAccordionTitle - title for each accordion child
9 *
10 * 2. active closed pane (ie, mouse down on a title bar)
11 * .dijitAccordionInnerContainerActive - for background-color, border
12 * .dijitAccordionInnerContainerActive dijitAccordionTitle - for text color
13 *
14 * 3. open pane (expanded child)
15 * .dijitAccordionChildWrapper - wraps around the child widget (typically ContentPane)
16 * setting a margin so that there's blue trim all the way around the child
17 *
18 * These rules need to override the closed pane active:
19 *
20 * .dijitAccordionInnerContainerSelected - for background-color, border
21 * .dijitAccordionInnerContainerSelected .dijitAccordionTitle - for text color
22 *
23 * 4. hovered pane, open or closed
24 * The selectors below affect hovering over both a closed pane (ie, hovering a title bar),
25 * and hovering over an open pane. Also, treat mouse down on an open pane as a hover:
26 *
27 * .dijitAccordionInnerContainerHover, .dijitAccordionInnerContainerSelectedActive - for background-color, border
28 * .dijitAccordionInnerContainerHover .dijitAccordionTitle - for text color
29 */
2f01fe57 30.claro .dijitAccordionContainer {
81bea17a 31 border: none;
2f01fe57
AD
32}
33.claro .dijitAccordionInnerContainer {
81bea17a
AD
34 background-color: #efefef;
35 /* gray, for closed pane */
36
37 border: solid 1px #b5bcc7;
38 margin-bottom: 1px;
39 -webkit-transition-property: background-color, border;
40 -moz-transition-property: background-color, border;
41 transition-property: background-color, border;
42 -webkit-transition-duration: 0.3s;
43 -moz-transition-duration: 0.3s;
44 transition-duration: 0.3s;
45 -webkit-transition-timing-function: linear;
46 -moz-transition-timing-function: linear;
47 transition-timing-function: linear;
2f01fe57
AD
48}
49.claro .dijitAccordionTitle {
81bea17a
AD
50 background-color: transparent;
51 /* pick up color from dijitAccordionInnerContainer */
52
53 background-image: url("images/accordion.png");
54 background-position: 0 0;
55 background-repeat: repeat-x;
56 padding: 5px 7px 2px 7px;
57 min-height: 17px;
58 color: #4a4a4a;
59}
60.claro .dijitAccordionTitleHover {
61 color: #000000;
2f01fe57
AD
62}
63.dj_ie6 .claro .dijitAccordionTitle {
81bea17a
AD
64 background-image: none;
65}
66.claro .dijitAccordionContainer .dijitAccordionChildWrapper {
67 /* this extends the blue trim styling of the title bar to wrapping around the node.
68 * done by setting margin
69 */
70
71 background-color: #ffffff;
72 border: 1px solid #769dc0;
73 margin: 0 2px 2px;
2f01fe57
AD
74}
75.claro .dijitAccordionContainer .dijitAccordionContainer-child {
81bea17a
AD
76 /* this is affecting the child widget itself */
77
78 padding: 9px;
2f01fe57 79}
81bea17a 80/* Active state for closed pane */
2f01fe57 81.claro .dijitAccordionInnerContainerActive {
81bea17a
AD
82 border: 1px solid #769dc0;
83 background-color: #7dbefa;
84 -webkit-transition-duration: 0.1s;
85 -moz-transition-duration: 0.1s;
86 transition-duration: 0.1s;
2f01fe57
AD
87}
88.claro .dijitAccordionInnerContainerActive .dijitAccordionTitle {
81bea17a
AD
89 background-position: 0 -136px;
90 color: #000000;
2f01fe57 91}
81bea17a 92/* Open (a.k.a. selected) pane */
2f01fe57 93.claro .dijitAccordionInnerContainerSelected {
81bea17a
AD
94 border-color: #769dc0;
95 background-color: #cfe5fa;
2f01fe57
AD
96}
97.claro .dijitAccordionInnerContainerSelected .dijitAccordionTitle {
81bea17a
AD
98 color: #000000;
99 background-position: 0 0;
100 /* avoid effect when clicking the title of the open pane */
101
2f01fe57 102}
81bea17a 103/* Hovering open or closed pane */
2f01fe57 104.claro .dijitAccordionInnerContainerHover dijitAccordionTitle {
81bea17a
AD
105 /* both open and closed */
106
107 color: #000000;
2f01fe57 108}
81bea17a
AD
109.claro .dijitAccordionInnerContainerHover, .claro .dijitAccordionInnerContainerSelectedActive {
110 /* note: clicking the currently selected Accordion pane should have no effect, so treating same as hover. */
111
112 border: 1px solid #769dc0;
113 background-color: #abd6ff;
114 -webkit-transition-duration: 0.2s;
115 -moz-transition-duration: 0.2s;
116 transition-duration: 0.2s;
2f01fe57 117}
81bea17a
AD
118.claro .dijitAccordionInnerContainerSelectedHover .dijitAccordionChildWrapper, .claro .dijitAccordionInnerContainerSelectedActive .dijitAccordionChildWrapper {
119 background-color: #ffffff;
120 border: 1px solid #769dc0 !important;
121 -webkit-box-shadow: inset 0 0 3px rgba(0, 0, 0, 0.25);
122 -moz-box-shadow: inset 0 0 3px rgba(0, 0, 0, 0.25);
123 box-shadow: inset 0 0 3px rgba(0, 0, 0, 0.25);
2f01fe57 124}