2 ----------------------------------*/
9 text-decoration: none
!important
;
13 overflow: visible
; /* the overflow property removes extra width in IE */
15 .ui-button-icon-only {
16 width: 2.2em; /* to make room for the icon, a width needs to be set here */
18 button
.ui-button-icon-only
{
19 width: 2.4em; /* button elements seem to need a little more width */
21 .ui-button-icons-only {
24 button
.ui-button-icons-only
{
28 /*button text element */
29 .ui-button .ui-button-text {
33 .ui-button-text-only .ui-button-text {
34 padding: 0.3em 1em 0.25em 1em;
36 .ui-button-icon-only
.ui-button-text
,
37 .ui-button-icons-only .ui-button-text {
39 text-indent: -9999999px;
41 .ui-button-text-icon-primary
.ui-button-text
,
42 .ui-button-text-icons .ui-button-text {
43 padding: 0.3em 1em 0.25em 2.1em;
45 .ui-button-text-icon-secondary
.ui-button-text
,
46 .ui-button-text-icons .ui-button-text {
47 padding: 0.3em 2.1em 0.25em 1em;
49 .ui-button-text-icons .ui-button-text {
54 /* no icon support for input elements, provide padding by default */
59 /*button icon element(s) */
60 .ui-button-icon-only
.ui-icon
,
61 .ui-button-text-icon-primary
.ui-icon
,
62 .ui-button-text-icon-secondary
.ui-icon
,
63 .ui-button-text-icons
.ui-icon
,
64 .ui-button-text-icon
.ui-icon
,
65 .ui-button-icons-only .ui-icon {
70 .ui-button-icon-only .ui-icon {
74 .ui-button-text-icon-primary
.ui-button-icon-primary
,
75 .ui-button-text-icon
.ui-button-icon-primary
,
76 .ui-button-text-icons
.ui-button-icon-primary
,
77 .ui-button-icons-only .ui-button-icon-primary {
80 .ui-button-text-icon-secondary
.ui-button-icon-secondary
,
81 .ui-button-text-icon
.ui-button-icon-secondary
,
82 .ui-button-text-icons
.ui-button-icon-secondary
,
83 .ui-button-icons-only .ui-button-icon-secondary {
91 .ui-buttonset .ui-button {
97 button
.ui-button::-moz-focus-inner
{
99 padding: 0; /* reset extra padding in Firefox */
103 margin: 0.5em 0 0.5em 0.4em;
104 border: 1px solid
#a6a6a6 !important
;
106 background: #f2f2f2 url
(images
/button-off
.png
) repeat-x scroll
50% 100% !important
;
115 /* This is normally handled in jquery.ui.theme.css, but in our case, the corner
116 styling of our buttons doesn't match our default widget corner styling */
117 .ui-button
.ui-corner-all
,
118 .ui-button
.ui-corner-top
,
119 .ui-button
.ui-corner-left
,
120 .ui-button.ui-corner-tl {
121 -moz-border-radius-topleft: 4px;
122 -webkit-border-top-left-radius: 4px;
123 border-top-left-radius: 4px;
125 .ui-button
.ui-corner-all
,
126 .ui-button
.ui-corner-top
,
127 .ui-button
.ui-corner-right
,
128 .ui-button.ui-corner-tr {
129 -moz-border-radius-topright: 4px;
130 -webkit-border-top-right-radius: 4px;
131 border-top-right-radius: 4px;
133 .ui-button
.ui-corner-all
,
134 .ui-button
.ui-corner-bottom
,
135 .ui-button
.ui-corner-left
,
136 .ui-button.ui-corner-bl {
137 -moz-border-radius-bottomleft: 4px;
138 -webkit-border-bottom-left-radius: 4px;
139 border-bottom-left-radius: 4px;
141 .ui-button
.ui-corner-all
,
142 .ui-button
.ui-corner-bottom
,
143 .ui-button
.ui-corner-right
,
144 .ui-button.ui-corner-br {
145 -moz-border-radius-bottomright: 4px;
146 -webkit-border-bottom-right-radius: 4px;
147 border-bottom-right-radius: 4px;
150 body
.ui-button:hover
{
151 border-color: #6e7273;
153 background: #e1e1e1 url
(images
/button-over
.png
) repeat-x scroll
50% 100% !important
;
155 body
.ui-button:active
,
156 body
.ui-button:focus
{
157 border-color: #707271;
159 background: #bfbfbf url
(images
/button-down
.png
) repeat-x scroll
50% 100% !important
;
161 body
.ui-button
.disabled
{
163 border-color: #cccccc;
165 background: #f2f2f2 url
(images
/button-disabled
.png
) repeat-x scroll
50% 100% !important
;
167 /* Disables the annoying dashed border Firefox puts on active buttons */
168 body button
.ui-button::-moz-focus-inner
{
171 /* Give large buttons some extra padding */
172 body
.ui-button-large
{
175 /* Use white icons for colored buttons */
176 .ui-button-green .ui-icon, .ui-button-blue .ui-icon, .ui-button-red .ui-icon, .ui-button-orange .ui-icon {
178 background-image: url
(images
/ui-icons_ffffff_256x240
.png
) !important
;
183 body
.ui-button
.ui-button-green
{
184 color: white
!important
;
185 border-color: #97af7e !important
;
187 background: #3cb677 url
(images
/button-green
.png
) repeat-x scroll
50% 100% !important
;
189 body
.ui-button
.ui-button-green:hover
{
190 border-color: #778e61 !important
;
192 background: #339b65 url
(images
/button-green-hover
.png
) repeat-x scroll
50% 100% !important
;
194 body
.ui-button
.ui-button-green
.ui-button-large
{
196 background: #3cb677 url
(images
/button-green-large
.png
) repeat-x scroll
50% 100% !important
;
198 body
.ui-button
.ui-button-green
.ui-button-large:hover
{
200 background: #339b65 url
(images
/button-green-hover-large
.png
) repeat-x scroll
50% 100% !important
;
202 body
.ui-button
.ui-button-green
.disabled
{
203 filter:alpha
(opacity
=50);
205 -khtml-opacity: 0.50;
211 body
.ui-button
.ui-button-blue
{
212 color: white
!important
;
213 border-color: #628acb !important
;
215 background: #3365ba url
(images
/button-blue
.png
) repeat-x scroll
50% 100% !important
;
217 body
.ui-button
.ui-button-blue:hover
{
218 border-color: #5375ad !important
;
220 background: #2b569e url
(images
/button-blue-hover
.png
) repeat-x scroll
50% 100% !important
;
222 body
.ui-button
.ui-button-blue
.ui-button-large
{
224 background: #3365ba url
(images
/button-blue-large
.png
) repeat-x scroll
50% 100% !important
;
226 body
.ui-button
.ui-button-blue
.ui-button-large:hover
{
228 background: #2b569e url
(images
/button-blue-hover-large
.png
) repeat-x scroll
50% 100% !important
;
230 body
.ui-button
.ui-button-blue
.disabled
{
231 filter:alpha
(opacity
=50);
233 -khtml-opacity: 0.50;
239 body
.ui-button
.ui-button-red
{
240 color: white
!important
;
241 border-color: #af977e !important
;
243 background: #cb0000 url
(images
/button-red
.png
) repeat-x scroll
50% 100% !important
;
245 body
.ui-button
.ui-button-red:hover
{
246 border-color: #8e7761 !important
;
248 background: #ad0000 url
(images
/button-red-hover
.png
) repeat-x scroll
50% 100% !important
;
250 body
.ui-button
.ui-button-red
.ui-button-large
{
252 background: #cb0000 url
(images
/button-red
.png
) repeat-x scroll
50% 100% !important
;
254 body
.ui-button
.ui-button-red
.ui-button-large:hover
{
256 background: #ad0000 url
(images
/button-red-hover
.png
) repeat-x scroll
50% 100% !important
;
258 body
.ui-button
.ui-button-red
.disabled
{
259 filter:alpha
(opacity
=50);
261 -khtml-opacity: 0.50;
267 body
.ui-button
.ui-button-orange
{
268 color: white
!important
;
269 border-color: #f3a863 !important
;
271 background: #f07f14 url
(images
/button-orange
.png
) repeat-x scroll
50% 100% !important
;
273 body
.ui-button
.ui-button-orange:hover
{
274 border-color: #ce9055 !important
;
276 background: #cc6c11 url
(images
/button-orange-hover
.png
) repeat-x scroll
50% 100% !important
;
278 body
.ui-button
.ui-button-orange
.ui-button-large
{
280 background: #f07f14 url
(images
/button-orange-large
.png
) repeat-x scroll
50% 100% !important
;
282 body
.ui-button
.ui-button-orange
.ui-button-large:hover
{
284 background: #cc6c11 url
(images
/button-orange-hover-large
.png
) repeat-x scroll
50% 100% !important
;
286 body
.ui-button
.ui-button-orange
.disabled
{
287 filter:alpha
(opacity
=50);
289 -khtml-opacity: 0.50;