]> git.wh0rd.org - tt-rss.git/blame - lib/dijit/themes/claro/Dialog.css
upgrade dojo to 1.8.3 (refs #570)
[tt-rss.git] / lib / dijit / themes / claro / Dialog.css
CommitLineData
81bea17a
AD
1/* Dialog
2 *
3 * Styling Dialog includes two sections: Dialog and Tooltip & TooltipDialog
4 *
5 * Dialog:
6 * 1. Dialog (default styling):
7 * .dijitDialog - styles for dialog's bounding box
8 *
9 * 2. Dialog title
10 * .dijitDialogTitleBar - styles for the title container at the top of dialog
11 * .dijitDialogTitle - the text container in dialog title
12 *
13 * 3. Dialog content
14 * .dijitDialogPaneContent - main container for content area and action bar
15 * .dijitDialogPaneContentArea - styles for content container
16 *
17 * 4. Dialog action bar
18 * .dijitDialogPaneActionBar - styles for action buttons lie at the bottom of dialog pane content
19 *
20 * 5. Dialog underlay
21 * .dijitDialogUnderlay - div under the dialog which used for separate dialog and page content
22 *
23 *
24 * Tooltip & TooltipDialog:
25 * 1. tooltip content container:
26 * .dijitTooltipContainer - tooltip content container
27 *
28 * 2. tooltip connector:
29 * .dijitTooltipConnector - tooltip anchor includes 4 direction(up, down, left, right)
30 */
2f01fe57 31.claro .dijitDialog {
1354d172 32 border: 1px solid #759dc0;
81bea17a
AD
33 -webkit-box-shadow: 0 1px 5px rgba(0, 0, 0, 0.25);
34 -moz-box-shadow: 0 1px 5px rgba(0, 0, 0, 0.25);
35 box-shadow: 0 1px 5px rgba(0, 0, 0, 0.25);
36}
2f01fe57 37.claro .dijitDialogPaneContent {
81bea17a 38 background: #ffffff repeat-x top left;
1354d172 39 border-top: 1px solid #759dc0;
81bea17a
AD
40 padding: 10px 8px;
41 position: relative;
2f01fe57
AD
42}
43.claro .dijitDialogPaneContentArea {
81bea17a
AD
44 /* trick to get action bar (gray bar at bottom with OK/cancel buttons) to span from
45 * left to right but still indent dialog content
46 */
47 margin: -10px -8px;
48 padding: 10px 8px;
2f01fe57
AD
49}
50.claro .dijitDialogPaneActionBar {
81bea17a
AD
51 /* gray bar at bottom of dialog with OK/Cancel buttons */
52
53 background-color: #efefef;
54 padding: 3px 5px 2px 7px;
55 text-align: right;
56 border-top: 1px solid #d3d3d3;
57 margin: 10px -8px -10px;
2f01fe57 58}
f0cfe83e
AD
59.claro .dijitTooltipDialog .dijitDialogPaneActionBar {
60 -webkit-border-bottom-right-radius: 4px;
61 -webkit-border-bottom-left-radius: 4px;
62 border-bottom-right-radius: 4px;
63 border-bottom-left-radius: 4px;
64 -moz-border-radius-bottomright: 4px;
65 -moz-border-radius-bottomleft: 4px;
66 margin: 10px -10px -8px;
67}
2f01fe57 68.claro .dijitDialogPaneActionBar .dijitButton {
81bea17a 69 float: none;
2f01fe57
AD
70}
71.claro .dijitDialogTitleBar {
81bea17a
AD
72 /* outer container for the titlebar of the dialog */
73
74 border: 1px solid #ffffff;
75 border-top: none;
76 background-color: #abd6ff;
f0cfe83e 77 background-image: url("images/standardGradient.png");
81bea17a 78 background-repeat: repeat-x;
f0cfe83e
AD
79 background-image: -moz-linear-gradient(rgba(255, 255, 255, 0.7) 0%, rgba(255, 255, 255, 0) 100%);
80 background-image: -webkit-linear-gradient(rgba(255, 255, 255, 0.7) 0%, rgba(255, 255, 255, 0) 100%);
81 background-image: -o-linear-gradient(rgba(255, 255, 255, 0.7) 0%, rgba(255, 255, 255, 0) 100%);
82 background-image: linear-gradient(rgba(255, 255, 255, 0.7) 0%, rgba(255, 255, 255, 0) 100%);
83 _background-image: none;
81bea17a 84 padding: 5px 7px 4px 7px;
2f01fe57
AD
85}
86.claro .dijitDialogTitle {
81bea17a
AD
87 /* typography and styling of the dialog title */
88
89 padding: 0 1px;
90 font-size: 1.091em;
1354d172 91 color: #000000;
2f01fe57
AD
92}
93.claro .dijitDialogCloseIcon {
81bea17a
AD
94 /* the default close icon for the dialog */
95
96 background: url("images/dialogCloseIcon.png");
97 background-repeat: no-repeat;
98 position: absolute;
99 right: 5px;
100 height: 15px;
101 width: 21px;
2f01fe57
AD
102}
103.dj_ie6 .claro .dijitDialogCloseIcon {
81bea17a 104 background-image: url("images/dialogCloseIcon8bit.png");
2f01fe57
AD
105}
106.claro .dijitDialogCloseIconHover {
81bea17a 107 background-position: -21px;
2f01fe57
AD
108}
109.claro .dijitDialogCloseIconActive {
81bea17a 110 background-position: -42px;
2f01fe57 111}
81bea17a
AD
112/* Tooltip and TooltipDialog */
113.claro .dijitTooltip, .claro .dijitTooltipDialog {
114 /* the outermost dom node, holding the connector and container */
115
116 background: transparent;
117 /* make the area on the sides of the arrow transparent */
118
2f01fe57
AD
119}
120.dijitTooltipBelow {
81bea17a
AD
121 /* leave room for arrow above content */
122
123 padding-top: 13px;
124 padding-left: 3px;
125 padding-right: 3px;
2f01fe57
AD
126}
127.dijitTooltipAbove {
81bea17a
AD
128 /* leave room for arrow below content */
129
130 padding-bottom: 13px;
131 padding-left: 3px;
132 padding-right: 3px;
2f01fe57
AD
133}
134.claro .dijitTooltipContainer {
81bea17a
AD
135 /* the part with the text */
136
137 background-color: #ffffff;
f0cfe83e
AD
138 background-image: -moz-linear-gradient(bottom, rgba(207, 229, 250, 0.1) 0px, #ffffff 10px);
139 background-image: -webkit-linear-gradient(bottom, rgba(207, 229, 250, 0.1) 0px, #ffffff 10px);
140 background-image: -o-linear-gradient(bottom, rgba(207, 229, 250, 0.1) 0px, #ffffff 10px);
141 background-image: linear-gradient(bottom, rgba(207, 229, 250, 0.1) 0px, #ffffff 10px);
81bea17a 142 background-position: bottom;
1354d172 143 border: 1px solid #759dc0;
81bea17a
AD
144 padding: 6px 8px;
145 -moz-border-radius: 4px;
146 border-radius: 4px;
147 -webkit-box-shadow: 0 1px 3px rgba(0, 0, 0, 0.25);
148 -moz-box-shadow: 0 1px 3px rgba(0, 0, 0, 0.25);
149 box-shadow: 0 1px 3px rgba(0, 0, 0, 0.25);
150 font-size: 1em;
1354d172 151 color: #000000;
81bea17a 152}
2f01fe57 153.claro .dijitTooltipConnector {
81bea17a
AD
154 /* the arrow piece */
155
156 border: 0;
157 z-index: 2;
158 background-image: url("images/tooltip.png");
159 background-repeat: no-repeat;
160 width: 16px;
161 height: 14px;
2f01fe57
AD
162}
163.dj_ie6 .claro .dijitTooltipConnector {
81bea17a 164 background-image: url("images/tooltip8bit.png");
2f01fe57
AD
165}
166.claro .dijitTooltipABRight .dijitTooltipConnector {
81bea17a
AD
167 /* above or below tooltip, but the arrow appears on the right,
168 and the right edges of target and tooltip are aligned rather than the left */
169
170 left: auto !important;
171 right: 3px;
2f01fe57
AD
172}
173.claro .dijitTooltipBelow .dijitTooltipConnector {
81bea17a
AD
174 /* the arrow piece for tooltips below an element */
175
176 top: 0;
177 left: 3px;
178 background-position: -31px 0;
179 width: 16px;
180 height: 14px;
2f01fe57
AD
181}
182.claro .dijitTooltipAbove .dijitTooltipConnector {
81bea17a
AD
183 /* the arrow piece for tooltips above an element */
184
185 bottom: 0;
186 left: 3px;
187 background-position: -15px 0;
188 width: 16px;
189 height: 14px;
2f01fe57 190}
81bea17a
AD
191.dj_ie7 .claro .dijitTooltipAbove .dijitTooltipConnector, .dj_ie6 .claro .dijitTooltipAbove .dijitTooltipConnector {
192 bottom: -1px;
2f01fe57
AD
193}
194.claro .dijitTooltipLeft {
81bea17a 195 padding-right: 14px;
2f01fe57
AD
196}
197.claro .dijitTooltipLeft .dijitTooltipConnector {
81bea17a
AD
198 /* the arrow piece for tooltips to the left of an element, bottom borders aligned */
199
200 right: 0;
201 background-position: 0 0;
202 width: 16px;
203 height: 14px;
2f01fe57
AD
204}
205.claro .dijitTooltipRight {
81bea17a 206 padding-left: 14px;
2f01fe57
AD
207}
208.claro .dijitTooltipRight .dijitTooltipConnector {
81bea17a
AD
209 /* the arrow piece for tooltips to the right of an element, bottom borders aligned */
210
211 left: 0;
212 background-position: -48px 0;
213 width: 16px;
214 height: 14px;
2f01fe57
AD
215}
216.claro .dijitDialogUnderlay {
81bea17a 217 background: #ffffff;
2f01fe57 218}