2 ----------------------------------*/
9 text-decoration: none
!important
;
13 overflow: visible
; /* the overflow property removes extra width in IE */
16 /*button text element */
17 .ui-button .ui-button-text {
20 text-shadow: 0 1px 1px #fff;
22 .ui-button-text-only .ui-button-text {
23 padding: 0.3em 1em 0.25em 1em;
25 .ui-button-icon-only
.ui-button-text
,
26 .ui-button-icons-only .ui-button-text {
28 text-indent: -9999999px;
30 .ui-button-text-icon-primary
.ui-button-text
,
31 .ui-button-text-icons .ui-button-text {
32 padding: 0.3em 1em 0.25em 2.1em;
34 .ui-button-text-icon-secondary
.ui-button-text
,
35 .ui-button-text-icons .ui-button-text {
36 padding: 0.3em 2.1em 0.25em 1em;
38 .ui-button-text-icons .ui-button-text {
43 /* no icon support for input elements, provide padding by default */
48 /*button icon element(s) */
49 .ui-button-icon-only
.ui-icon
,
50 .ui-button-text-icon-primary
.ui-icon
,
51 .ui-button-text-icon-secondary
.ui-icon
,
52 .ui-button-text-icons
.ui-icon
,
53 .ui-button-text-icon
.ui-icon
,
54 .ui-button-icons-only .ui-icon {
59 .ui-button-icon-only .ui-icon {
63 .ui-button-text-icon-primary
.ui-button-icon-primary
,
64 .ui-button-text-icon
.ui-button-icon-primary
,
65 .ui-button-text-icons
.ui-button-icon-primary
,
66 .ui-button-icons-only .ui-button-icon-primary {
69 .ui-button-text-icon-secondary
.ui-button-icon-secondary
,
70 .ui-button-text-icon
.ui-button-icon-secondary
,
71 .ui-button-text-icons
.ui-button-icon-secondary
,
72 .ui-button-icons-only .ui-button-icon-secondary {
80 .ui-buttonset .ui-button {
86 button
.ui-button::-moz-focus-inner
{
88 padding: 0; /* reset extra padding in Firefox */
90 /* Disables the annoying dashed border Firefox puts on active buttons */
91 body button
.ui-button::-moz-focus-inner
{
94 /* Give large buttons some extra padding */
95 body
.ui-button-large
{
98 /* Use white icons for colored buttons */
99 .ui-button-green
.ui-icon
,
100 .ui-button-blue
.ui-icon
,
101 .ui-button-red
.ui-icon
,
102 .ui-button-orange .ui-icon {
104 background-image: url
(images
/ui-icons_ffffff_256x240
.png
) !important
;
108 /* This is normally handled in jquery.ui.theme.css, but in our case, the corner
109 styling of our buttons doesn't match our default widget corner styling */
110 .ui-button
.ui-corner-all
,
111 .ui-button
.ui-corner-top
,
112 .ui-button
.ui-corner-left
,
113 .ui-button.ui-corner-tl {
114 -moz-border-radius-topleft: 4px;
115 -webkit-border-top-left-radius: 4px;
116 border-top-left-radius: 4px;
118 .ui-button
.ui-corner-all
,
119 .ui-button
.ui-corner-top
,
121 .ui-button
.ui-corner-right
,
122 .ui-button.ui-corner-tr {
123 -moz-border-radius-topright: 4px;
124 -webkit-border-top-right-radius: 4px;
125 border-top-right-radius: 4px;
127 .ui-button
.ui-corner-all
,
128 .ui-button
.ui-corner-bottom
,
129 .ui-button
.ui-corner-left
,
130 .ui-button.ui-corner-bl {
131 -moz-border-radius-bottomleft: 4px;
132 -webkit-border-bottom-left-radius: 4px;
133 border-bottom-left-radius: 4px;
135 .ui-button
.ui-corner-all
,
136 .ui-button
.ui-corner-bottom
,
137 .ui-button
.ui-corner-right
,
138 .ui-button.ui-corner-br {
139 -moz-border-radius-bottomright: 4px;
140 -webkit-border-bottom-right-radius: 4px;
141 border-bottom-right-radius: 4px;
146 margin: 0.5em 0 0.5em 0.4em;
147 border: 1px solid
#aaa !important
;
148 background: #f0f0f0 !important
;
149 background: -moz-linear-gradient
(top
, #fff 0%, #ddd 90%) !important
; /* FF3.6+ */
150 background: -webkit-linear-gradient
(top
, #fff 0%, #ddd 90%) !important
; /* Chrome10+, Safari5.1+ */
151 background: -o-linear-gradient
(top
, #fff 0%, #ddd 90%) !important
; /* Opera 11.10+ */
152 background: -ms-linear-gradient
(top
, #fff 0%, #ddd 90%) !important
; /* IE10+ */
153 background: linear-gradient
(to bottom
, #fff 0%, #ddd 90%) !important
;
154 filter: progid:DXImageTransform
.Microsoft
.gradient
(startColorstr
='#ffffff', endColorstr
='#dddddd', GradientType
=0); /* IE6-8 */
160 box-shadow: 0 1px 3px rgba
(0,0,0,.2);
163 body
.ui-button-icon-only
{
167 body
.ui-button-icons-only
{
171 body
.ui-button:hover
{
173 border-color: #bbb !important
;
174 background: #fff !important
;
175 background: -moz-linear-gradient
(top
, #fff 0%, #eee 90%) !important
; /* FF3.6+ */
176 background: -webkit-linear-gradient
(top
, #fff 0%, #eee 90%) !important
; /* Chrome10+, Safari5.1+ */
177 background: -o-linear-gradient
(top
, #fff 0%, #eee 90%) !important
; /* Opera 11.10+ */
178 background: -ms-linear-gradient
(top
, #fff 0%, #eee 90%) !important
; /* IE10+ */
179 background: linear-gradient
(to bottom
, #fff 0%, #eee 90%) !important
;
180 filter: progid:DXImageTransform
.Microsoft
.gradient
(startColorstr
='#ffffff', endColorstr
='#eeeeee', GradientType
=0); /* IE6-8 */
181 box-shadow: 0 1px 3px rgba
(0,0,0,.1);
183 body
.ui-button:active
,
184 body
.ui-button:focus
{
185 border-color: #8ad !important
;
186 box-shadow: 0 0 1px 1px rgba
(167,215,249,.5);
188 body
.ui-button:active
{
189 background: #e0e0e0 !important
;
190 background: -moz-linear-gradient
(top
, #f0f0f0 0%, #d0d0d0 90%) !important
; /* FF3.6+ */
191 background: -webkit-linear-gradient
(top
, #f0f0f0 0%, #d0d0d0 90%) !important
; /* Chrome10+, Safari5.1+ */
192 background: -o-linear-gradient
(top
, #f0f0f0 0%, #d0d0d0 90%) !important
; /* Opera 11.10+ */
193 background: -ms-linear-gradient
(top
, #f0f0f0 0%, #d0d0d0 90%) !important
; /* IE10+ */
194 background: linear-gradient
(to bottom
, #f0f0f0 0%, #d0d0d0 90%) !important
;
195 filter: progid:DXImageTransform
.Microsoft
.gradient
(startColorstr
='#f0f0f0', endColorstr
='#d0d0d0', GradientType
=0); /* IE6-8 */
199 body
.ui-button-green
,
200 body
.ui-button-green
.ui-button-text
{
202 text-shadow: 0 -1px 1px #072;
204 body
.ui-button
.ui-button-green
{
205 border-color: #294 !important
;
206 background: #295 !important
;
207 background: -moz-linear-gradient
(top
, #3c8 0%, #295 90%) !important
; /* FF3.6+ */
208 background: -webkit-linear-gradient
(top
, #3c8 0%, #295 90%) !important
; /* Chrome10+, Safari5.1+ */
209 background: -o-linear-gradient
(top
, #3c8 0%, #295 90%) !important
; /* Opera 11.10+ */
210 background: -ms-linear-gradient
(top
, #3c8 0%, #295 90%) !important
; /* IE10+ */
211 background: linear-gradient
(to bottom
, #3c8 0%, #295 90%) !important
;
212 filter: progid:DXImageTransform
.Microsoft
.gradient
(startColorstr
='#33cc88', endColorstr
='#229955', GradientType
=0); /* IE6-8 */
213 box-shadow: 0 1px 3px rgba
(0,0,0,.3);
215 body
.ui-button
.ui-button-green:hover
{
216 background: #33a055 !important
;
217 background: -moz-linear-gradient
(top
, #44d388 0%, #33a055 90%) !important
; /* FF3.6+ */
218 background: -webkit-linear-gradient
(top
, #44d388 0%, #33a055 90%) !important
; /* Chrome10+, Safari5.1+ */
219 background: -o-linear-gradient
(top
, #44d388 0%, #33a055 90%) !important
; /* Opera 11.10+ */
220 background: -ms-linear-gradient
(top
, #44d388 0%, #33a055 90%) !important
; /* IE10+ */
221 background: linear-gradient
(to bottom
, #44d388 0%, #33a055 90%) !important
;
222 filter: progid:DXImageTransform
.Microsoft
.gradient
(startColorstr
='#44d388', endColorstr
='#33a055', GradientType
=0); /* IE6-8 */
223 box-shadow: 0 1px 3px rgba
(0,0,0,.25);
225 body
.ui-button
.ui-button-green:active
,
226 body
.ui-button
.ui-button-green:focus
{
227 border-color: #172 !important
;
228 box-shadow: 0 0 2px 2px rgba
(167,215,249,.75);
230 body
.ui-button
.ui-button-green:active
{
231 background: #338855 !important
;
232 background: -moz-linear-gradient
(top
, #30c080 0%, #338855 90%) !important
; /* FF3.6+ */
233 background: -webkit-linear-gradient
(top
, #30c080 0%, #338855 90%) !important
; /* Chrome10+, Safari5.1+ */
234 background: -o-linear-gradient
(top
, #30c080 0%, #338855 90%) !important
; /* Opera 11.10+ */
235 background: -ms-linear-gradient
(top
, #30c080 0%, #338855 90%) !important
; /* IE10+ */
236 background: linear-gradient
(to bottom
, #30c080 0%, #338855 90%) !important
;
237 filter: progid:DXImageTransform
.Microsoft
.gradient
(startColorstr
='#30c080', endColorstr
='#338855', GradientType
=0); /* IE6-8 */
241 body
.ui-button-blue
,
242 body
.ui-button-blue
.ui-button-text
{
244 text-shadow: 0 -1px 1px #037;
246 body
.ui-button
.ui-button-blue
{
247 border-color: #468 !important
;
248 background: #36b !important
;
249 background: -moz-linear-gradient
(top
, #48e 0%, #36b 90%) !important
; /* FF3.6+ */
250 background: -webkit-linear-gradient
(top
, #48e 0%, #36b 90%) !important
; /* Chrome10+, Safari5.1+ */
251 background: -o-linear-gradient
(top
, #48e 0%, #36b 90%) !important
; /* Opera 11.10+ */
252 background: -ms-linear-gradient
(top
, #48e 0%, #36b 90%) !important
; /* IE10+ */
253 background: linear-gradient
(to bottom
, #48e 0%, #36b 90%) !important
;
254 filter: progid:DXImageTransform
.Microsoft
.gradient
(startColorstr
='#4488ee', endColorstr
='#3366bb', GradientType
=0); /* IE6-8 */
255 box-shadow: 0 1px 3px rgba
(0,0,0,.35);
257 body
.ui-button
.ui-button-blue:hover
{
258 background: #36c !important
;
259 background: -moz-linear-gradient
(top
, #59e 0%, #36c 90%) !important
; /* FF3.6+ */
260 background: -webkit-linear-gradient
(top
, #59e 0%, #36c 90%) !important
; /* Chrome10+, Safari5.1+ */
261 background: -o-linear-gradient
(top
, #59e 0%, #36c 90%) !important
; /* Opera 11.10+ */
262 background: -ms-linear-gradient
(top
, #59e 0%, #36c 90%) !important
; /* IE10+ */
263 background: linear-gradient
(to bottom
, #59e 0%, #36c 90%) !important
;
264 filter: progid:DXImageTransform
.Microsoft
.gradient
(startColorstr
='#5599ee', endColorstr
='#3366cc', GradientType
=0); /* IE6-8 */
266 body
.ui-button
.ui-button-blue:active
,
267 body
.ui-button
.ui-button-blue:focus
{
268 border-color: #357 !important
;
269 box-shadow: 0 0 2px 2px rgba
(167,215,249,.75);
271 body
.ui-button
.ui-button-blue:active
{
272 background: #3060a0 !important
;
273 background: -moz-linear-gradient
(top
, #4080e0 0%, #3060a0 90%) !important
; /* FF3.6+ */
274 background: -webkit-linear-gradient
(top
, #4080e0 0%, #3060a0 90%) !important
; /* Chrome10+, Safari5.1+ */
275 background: -o-linear-gradient
(top
, #4080e0 0%, #3060a0 90%) !important
; /* Opera 11.10+ */
276 background: -ms-linear-gradient
(top
, #4080e0 0%, #3060a0 90%) !important
; /* IE10+ */
277 background: linear-gradient
(to bottom
, #4080e0 0%, #3060a0 90%) !important
;
278 filter: progid:DXImageTransform
.Microsoft
.gradient
(startColorstr
='#4080e0', endColorstr
='#3060a0', GradientType
=0); /* IE6-8 */
283 body
.ui-button-red
.ui-button-text
{
285 text-shadow: 0 -1px 1px #700;
287 body
.ui-button
.ui-button-red
{
288 border-color: #944 !important
;
289 background: #a22 !important
;
290 background: -moz-linear-gradient
(top
, #d44 0%, #a22 90%) !important
; /* FF3.6+ */
291 background: -webkit-linear-gradient
(top
, #d44 0%, #a22 90%) !important
; /* Chrome10+, Safari5.1+ */
292 background: -o-linear-gradient
(top
, #d44 0%, #a22 90%) !important
; /* Opera 11.10+ */
293 background: -ms-linear-gradient
(top
, #d44 0%, #a22 90%) !important
; /* IE10+ */
294 background: linear-gradient
(to bottom
, #d44 0%, #a22 90%) !important
;
295 filter: progid:DXImageTransform
.Microsoft
.gradient
(startColorstr
='#dd4444', endColorstr
='#aa2222', GradientType
=0); /* IE6-8 */
296 box-shadow: 0 1px 3px rgba
(0,0,0,.35);
298 body
.ui-button
.ui-button-red:hover
{
299 border-color: #a44 !important
;
300 background: #b03333 !important
;
301 background: -moz-linear-gradient
(top
, #ee4646 0%, #b03333 90%) !important
; /* FF3.6+ */
302 background: -webkit-linear-gradient
(top
, #ee4646 0%, #b03333 90%) !important
; /* Chrome10+, Safari5.1+ */
303 background: -o-linear-gradient
(top
, #ee4646 0%, #b03333 90%) !important
; /* Opera 11.10+ */
304 background: -ms-linear-gradient
(top
, #ee4646 0%, #b03333 90%) !important
; /* IE10+ */
305 background: linear-gradient
(to bottom
, #ee4646 0%, #b03333 90%) !important
;
306 filter: progid:DXImageTransform
.Microsoft
.gradient
(startColorstr
='#ee4646', endColorstr
='#b03333', GradientType
=0); /* IE6-8 */
307 box-shadow: 0 1px 3px rgba
(0,0,0,.3);
309 body
.ui-button
.ui-button-red:active
,
310 body
.ui-button
.ui-button-red:focus
{
311 border-color: #747 !important
;
312 box-shadow: 0 0 2px 2px rgba
(167,215,249,.7);
314 body
.ui-button
.ui-button-red:active
{
315 background: #952020 !important
;
316 background: -moz-linear-gradient
(top
, #d04545 0%, #952020 90%) !important
; /* FF3.6+ */
317 background: -webkit-linear-gradient
(top
, #d04545 0%, #952020 90%) !important
; /* Chrome10+, Safari5.1+ */
318 background: -o-linear-gradient
(top
, #d04545 0%, #952020 90%) !important
; /* Opera 11.10+ */
319 background: -ms-linear-gradient
(top
, #d04545 0%, #952020 90%) !important
; /* IE10+ */
320 background: linear-gradient
(to bottom
, #d04545 0%, #952020 90%) !important
;
321 filter: progid:DXImageTransform
.Microsoft
.gradient
(startColorstr
='#d04545', endColorstr
='#952020', GradientType
=0); /* IE6-8 */
324 /* Disabled buttons */
325 body
.ui-button-green
.disabled
,
326 body
.ui-button-green
.disabled:hover
,
327 body
.ui-button-green
.disabled:active
,
328 body
.ui-button-green
.disabled:focus
,
329 body
.ui-button-blue
.disabled
,
330 body
.ui-button-blue
.disabled:hover
,
331 body
.ui-button-blue
.disabled:active
,
332 body
.ui-button-blue
.disabled:focus
,
333 body
.ui-button-red
.disabled
,
334 body
.ui-button-red
.disabled:hover
,
335 body
.ui-button-red
.disabled:active
,
336 body
.ui-button-red
.disabled:focus
,
337 body
.ui-button
.disabled
,
338 body
.ui-button
.disabled:hover
{
340 border-color: #ccc !important
;
341 background: #eee !important
;
342 background: -moz-linear-gradient
(top
, #f6f6f6 0%, #eee 90%) !important
; /* FF3.6+ */
343 background: -webkit-linear-gradient
(top
, #f6f6f6 0%, #eee 90%) !important
; /* Chrome10+, Safari5.1+ */
344 background: -o-linear-gradient
(top
, #f6f6f6 0%, #eee 90%) !important
; /* Opera 11.10+ */
345 background: -ms-linear-gradient
(top
, #f6f6f6 0%, #eee 90%) !important
; /* IE10+ */
346 background: linear-gradient
(to bottom
, #f6f6f6 0%, #eee 90%) !important
;
347 filter: progid:DXImageTransform
.Microsoft
.gradient
(startColorstr
='#f6f6f6', endColorstr
='#eeeeee', GradientType
=0); /* IE6-8 */
348 box-shadow: 0 1px 3px rgba
(0,0,0,0);
350 body
.ui-button-green
.disabled
.ui-button-text
,
351 body
.ui-button-blue
.disabled
.ui-button-text
,
352 body
.ui-button-red
.disabled
.ui-button-text
{
354 text-shadow: 0 1px 1px #fff;