Merge "Bug 44855, Bug 37743: Improved vector button styles for jquery.ui"
authorTrevor Parscal <tparscal@wikimedia.org>
Mon, 29 Apr 2013 22:37:12 +0000 (22:37 +0000)
committerGerrit Code Review <gerrit@wikimedia.org>
Mon, 29 Apr 2013 22:37:12 +0000 (22:37 +0000)
35 files changed:
resources/jquery.ui/themes/vector/images/button-blue-hover-large.png [deleted file]
resources/jquery.ui/themes/vector/images/button-blue-hover.png [deleted file]
resources/jquery.ui/themes/vector/images/button-blue-large.png [deleted file]
resources/jquery.ui/themes/vector/images/button-blue.png [deleted file]
resources/jquery.ui/themes/vector/images/button-disabled-blue.png [deleted file]
resources/jquery.ui/themes/vector/images/button-disabled-green.png [deleted file]
resources/jquery.ui/themes/vector/images/button-disabled-red.png [deleted file]
resources/jquery.ui/themes/vector/images/button-disabled.png [deleted file]
resources/jquery.ui/themes/vector/images/button-down-blue.png [deleted file]
resources/jquery.ui/themes/vector/images/button-down-green.png [deleted file]
resources/jquery.ui/themes/vector/images/button-down-red.png [deleted file]
resources/jquery.ui/themes/vector/images/button-down.png [deleted file]
resources/jquery.ui/themes/vector/images/button-green-hover-large.png [deleted file]
resources/jquery.ui/themes/vector/images/button-green-hover.png [deleted file]
resources/jquery.ui/themes/vector/images/button-green-large.png [deleted file]
resources/jquery.ui/themes/vector/images/button-green.png [deleted file]
resources/jquery.ui/themes/vector/images/button-large-disabled-green.png [deleted file]
resources/jquery.ui/themes/vector/images/button-large-off-green.png [deleted file]
resources/jquery.ui/themes/vector/images/button-off-blue.png [deleted file]
resources/jquery.ui/themes/vector/images/button-off-green.png [deleted file]
resources/jquery.ui/themes/vector/images/button-off-red.png [deleted file]
resources/jquery.ui/themes/vector/images/button-off.png [deleted file]
resources/jquery.ui/themes/vector/images/button-orange-hover-large.png [deleted file]
resources/jquery.ui/themes/vector/images/button-orange-hover.png [deleted file]
resources/jquery.ui/themes/vector/images/button-orange-large.png [deleted file]
resources/jquery.ui/themes/vector/images/button-orange.png [deleted file]
resources/jquery.ui/themes/vector/images/button-over-blue.png [deleted file]
resources/jquery.ui/themes/vector/images/button-over-green.png [deleted file]
resources/jquery.ui/themes/vector/images/button-over-red.png [deleted file]
resources/jquery.ui/themes/vector/images/button-over.png [deleted file]
resources/jquery.ui/themes/vector/images/button-red-hover-large.png [deleted file]
resources/jquery.ui/themes/vector/images/button-red-hover.png [deleted file]
resources/jquery.ui/themes/vector/images/button-red-large.png [deleted file]
resources/jquery.ui/themes/vector/images/button-red.png [deleted file]
resources/jquery.ui/themes/vector/jquery.ui.button.css [changed mode: 0644->0755]

diff --git a/resources/jquery.ui/themes/vector/images/button-blue-hover-large.png b/resources/jquery.ui/themes/vector/images/button-blue-hover-large.png
deleted file mode 100644 (file)
index 8f7cf74..0000000
Binary files a/resources/jquery.ui/themes/vector/images/button-blue-hover-large.png and /dev/null differ
diff --git a/resources/jquery.ui/themes/vector/images/button-blue-hover.png b/resources/jquery.ui/themes/vector/images/button-blue-hover.png
deleted file mode 100644 (file)
index 1fc2816..0000000
Binary files a/resources/jquery.ui/themes/vector/images/button-blue-hover.png and /dev/null differ
diff --git a/resources/jquery.ui/themes/vector/images/button-blue-large.png b/resources/jquery.ui/themes/vector/images/button-blue-large.png
deleted file mode 100644 (file)
index 22ee5e5..0000000
Binary files a/resources/jquery.ui/themes/vector/images/button-blue-large.png and /dev/null differ
diff --git a/resources/jquery.ui/themes/vector/images/button-blue.png b/resources/jquery.ui/themes/vector/images/button-blue.png
deleted file mode 100644 (file)
index 2e6d121..0000000
Binary files a/resources/jquery.ui/themes/vector/images/button-blue.png and /dev/null differ
diff --git a/resources/jquery.ui/themes/vector/images/button-disabled-blue.png b/resources/jquery.ui/themes/vector/images/button-disabled-blue.png
deleted file mode 100644 (file)
index 28eb1fc..0000000
Binary files a/resources/jquery.ui/themes/vector/images/button-disabled-blue.png and /dev/null differ
diff --git a/resources/jquery.ui/themes/vector/images/button-disabled-green.png b/resources/jquery.ui/themes/vector/images/button-disabled-green.png
deleted file mode 100644 (file)
index 0e29d85..0000000
Binary files a/resources/jquery.ui/themes/vector/images/button-disabled-green.png and /dev/null differ
diff --git a/resources/jquery.ui/themes/vector/images/button-disabled-red.png b/resources/jquery.ui/themes/vector/images/button-disabled-red.png
deleted file mode 100644 (file)
index ede6998..0000000
Binary files a/resources/jquery.ui/themes/vector/images/button-disabled-red.png and /dev/null differ
diff --git a/resources/jquery.ui/themes/vector/images/button-disabled.png b/resources/jquery.ui/themes/vector/images/button-disabled.png
deleted file mode 100644 (file)
index e4e4ec1..0000000
Binary files a/resources/jquery.ui/themes/vector/images/button-disabled.png and /dev/null differ
diff --git a/resources/jquery.ui/themes/vector/images/button-down-blue.png b/resources/jquery.ui/themes/vector/images/button-down-blue.png
deleted file mode 100644 (file)
index 766e574..0000000
Binary files a/resources/jquery.ui/themes/vector/images/button-down-blue.png and /dev/null differ
diff --git a/resources/jquery.ui/themes/vector/images/button-down-green.png b/resources/jquery.ui/themes/vector/images/button-down-green.png
deleted file mode 100644 (file)
index 90969c3..0000000
Binary files a/resources/jquery.ui/themes/vector/images/button-down-green.png and /dev/null differ
diff --git a/resources/jquery.ui/themes/vector/images/button-down-red.png b/resources/jquery.ui/themes/vector/images/button-down-red.png
deleted file mode 100644 (file)
index f625729..0000000
Binary files a/resources/jquery.ui/themes/vector/images/button-down-red.png and /dev/null differ
diff --git a/resources/jquery.ui/themes/vector/images/button-down.png b/resources/jquery.ui/themes/vector/images/button-down.png
deleted file mode 100644 (file)
index c646757..0000000
Binary files a/resources/jquery.ui/themes/vector/images/button-down.png and /dev/null differ
diff --git a/resources/jquery.ui/themes/vector/images/button-green-hover-large.png b/resources/jquery.ui/themes/vector/images/button-green-hover-large.png
deleted file mode 100644 (file)
index dd8851e..0000000
Binary files a/resources/jquery.ui/themes/vector/images/button-green-hover-large.png and /dev/null differ
diff --git a/resources/jquery.ui/themes/vector/images/button-green-hover.png b/resources/jquery.ui/themes/vector/images/button-green-hover.png
deleted file mode 100644 (file)
index 19c3991..0000000
Binary files a/resources/jquery.ui/themes/vector/images/button-green-hover.png and /dev/null differ
diff --git a/resources/jquery.ui/themes/vector/images/button-green-large.png b/resources/jquery.ui/themes/vector/images/button-green-large.png
deleted file mode 100644 (file)
index a8e830e..0000000
Binary files a/resources/jquery.ui/themes/vector/images/button-green-large.png and /dev/null differ
diff --git a/resources/jquery.ui/themes/vector/images/button-green.png b/resources/jquery.ui/themes/vector/images/button-green.png
deleted file mode 100644 (file)
index 54c418e..0000000
Binary files a/resources/jquery.ui/themes/vector/images/button-green.png and /dev/null differ
diff --git a/resources/jquery.ui/themes/vector/images/button-large-disabled-green.png b/resources/jquery.ui/themes/vector/images/button-large-disabled-green.png
deleted file mode 100644 (file)
index f76f7b0..0000000
Binary files a/resources/jquery.ui/themes/vector/images/button-large-disabled-green.png and /dev/null differ
diff --git a/resources/jquery.ui/themes/vector/images/button-large-off-green.png b/resources/jquery.ui/themes/vector/images/button-large-off-green.png
deleted file mode 100644 (file)
index f997431..0000000
Binary files a/resources/jquery.ui/themes/vector/images/button-large-off-green.png and /dev/null differ
diff --git a/resources/jquery.ui/themes/vector/images/button-off-blue.png b/resources/jquery.ui/themes/vector/images/button-off-blue.png
deleted file mode 100644 (file)
index 82dedb5..0000000
Binary files a/resources/jquery.ui/themes/vector/images/button-off-blue.png and /dev/null differ
diff --git a/resources/jquery.ui/themes/vector/images/button-off-green.png b/resources/jquery.ui/themes/vector/images/button-off-green.png
deleted file mode 100644 (file)
index 109907f..0000000
Binary files a/resources/jquery.ui/themes/vector/images/button-off-green.png and /dev/null differ
diff --git a/resources/jquery.ui/themes/vector/images/button-off-red.png b/resources/jquery.ui/themes/vector/images/button-off-red.png
deleted file mode 100644 (file)
index 5a85b8a..0000000
Binary files a/resources/jquery.ui/themes/vector/images/button-off-red.png and /dev/null differ
diff --git a/resources/jquery.ui/themes/vector/images/button-off.png b/resources/jquery.ui/themes/vector/images/button-off.png
deleted file mode 100644 (file)
index cc5eb11..0000000
Binary files a/resources/jquery.ui/themes/vector/images/button-off.png and /dev/null differ
diff --git a/resources/jquery.ui/themes/vector/images/button-orange-hover-large.png b/resources/jquery.ui/themes/vector/images/button-orange-hover-large.png
deleted file mode 100644 (file)
index 6f0dbd5..0000000
Binary files a/resources/jquery.ui/themes/vector/images/button-orange-hover-large.png and /dev/null differ
diff --git a/resources/jquery.ui/themes/vector/images/button-orange-hover.png b/resources/jquery.ui/themes/vector/images/button-orange-hover.png
deleted file mode 100644 (file)
index a1077c5..0000000
Binary files a/resources/jquery.ui/themes/vector/images/button-orange-hover.png and /dev/null differ
diff --git a/resources/jquery.ui/themes/vector/images/button-orange-large.png b/resources/jquery.ui/themes/vector/images/button-orange-large.png
deleted file mode 100644 (file)
index 3d7f37f..0000000
Binary files a/resources/jquery.ui/themes/vector/images/button-orange-large.png and /dev/null differ
diff --git a/resources/jquery.ui/themes/vector/images/button-orange.png b/resources/jquery.ui/themes/vector/images/button-orange.png
deleted file mode 100644 (file)
index 02347cf..0000000
Binary files a/resources/jquery.ui/themes/vector/images/button-orange.png and /dev/null differ
diff --git a/resources/jquery.ui/themes/vector/images/button-over-blue.png b/resources/jquery.ui/themes/vector/images/button-over-blue.png
deleted file mode 100644 (file)
index 9edb7aa..0000000
Binary files a/resources/jquery.ui/themes/vector/images/button-over-blue.png and /dev/null differ
diff --git a/resources/jquery.ui/themes/vector/images/button-over-green.png b/resources/jquery.ui/themes/vector/images/button-over-green.png
deleted file mode 100644 (file)
index 47a0b1b..0000000
Binary files a/resources/jquery.ui/themes/vector/images/button-over-green.png and /dev/null differ
diff --git a/resources/jquery.ui/themes/vector/images/button-over-red.png b/resources/jquery.ui/themes/vector/images/button-over-red.png
deleted file mode 100644 (file)
index a244536..0000000
Binary files a/resources/jquery.ui/themes/vector/images/button-over-red.png and /dev/null differ
diff --git a/resources/jquery.ui/themes/vector/images/button-over.png b/resources/jquery.ui/themes/vector/images/button-over.png
deleted file mode 100644 (file)
index 558f1f8..0000000
Binary files a/resources/jquery.ui/themes/vector/images/button-over.png and /dev/null differ
diff --git a/resources/jquery.ui/themes/vector/images/button-red-hover-large.png b/resources/jquery.ui/themes/vector/images/button-red-hover-large.png
deleted file mode 100644 (file)
index 11ccef0..0000000
Binary files a/resources/jquery.ui/themes/vector/images/button-red-hover-large.png and /dev/null differ
diff --git a/resources/jquery.ui/themes/vector/images/button-red-hover.png b/resources/jquery.ui/themes/vector/images/button-red-hover.png
deleted file mode 100644 (file)
index 55a6174..0000000
Binary files a/resources/jquery.ui/themes/vector/images/button-red-hover.png and /dev/null differ
diff --git a/resources/jquery.ui/themes/vector/images/button-red-large.png b/resources/jquery.ui/themes/vector/images/button-red-large.png
deleted file mode 100644 (file)
index 8d089ef..0000000
Binary files a/resources/jquery.ui/themes/vector/images/button-red-large.png and /dev/null differ
diff --git a/resources/jquery.ui/themes/vector/images/button-red.png b/resources/jquery.ui/themes/vector/images/button-red.png
deleted file mode 100644 (file)
index 7a292fc..0000000
Binary files a/resources/jquery.ui/themes/vector/images/button-red.png and /dev/null differ
old mode 100644 (file)
new mode 100755 (executable)
index a6a1b54..9314ef6
@@ -29,6 +29,7 @@ button.ui-button-icons-only {
 .ui-button .ui-button-text {
        display: block;
        line-height: 1.4;
+       text-shadow: 0 1px 1px #fff;
 }
 .ui-button-text-only .ui-button-text {
        padding: 0.3em 1em 0.25em 1em;
@@ -98,17 +99,21 @@ button.ui-button::-moz-focus-inner {
        border: 0;
        padding: 0; /* reset extra padding in Firefox */
 }
-
-body .ui-button {
-       margin: 0.5em 0 0.5em 0.4em;
-       border: 1px solid #a6a6a6 !important;
+/* Disables the annoying dashed border Firefox puts on active buttons */
+body button.ui-button::-moz-focus-inner {
+       border: 0;
+}
+/* Give large buttons some extra padding */
+body .ui-button-large {
+       padding: 5px;
+}
+/* Use white icons for colored buttons */
+.ui-button-green .ui-icon,
+.ui-button-blue .ui-icon,
+.ui-button-red .ui-icon,
+.ui-button-orange .ui-icon {
        /* @embed */
-       background: #f2f2f2 url(images/button-off.png) repeat-x scroll 50% 100% !important;
-       cursor: pointer;
-       font-size: 1em;
-       line-height: 1.4em;
-       width: auto;
-       overflow: visible;
+       background-image: url(images/ui-icons_ffffff_256x240.png) !important;
 }
 
 /* Corner radius */
@@ -124,6 +129,7 @@ body .ui-button {
 }
 .ui-button.ui-corner-all,
 .ui-button.ui-corner-top,
+
 .ui-button.ui-corner-right,
 .ui-button.ui-corner-tr {
        -moz-border-radius-topright: 4px;
@@ -147,145 +153,230 @@ body .ui-button {
        border-bottom-right-radius: 4px;
 }
 
+body .ui-button {
+       color: #2779aa;
+       margin: 0.5em 0 0.5em 0.4em;
+       border: 1px solid #aaa !important;
+       background: #f0f0f0 !important;
+       background: -moz-linear-gradient(top, #fff 0%, #ddd 90%) !important; /* FF3.6+ */
+       background: -webkit-linear-gradient(top, #fff 0%, #ddd 90%) !important; /* Chrome10+, Safari5.1+ */
+       background: -o-linear-gradient(top, #fff 0%, #ddd 90%) !important; /* Opera 11.10+ */
+       background: -ms-linear-gradient(top, #fff 0%, #ddd 90%) !important; /* IE10+ */
+       background: linear-gradient(to bottom, #fff 0%, #ddd 90%) !important;
+       filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffff', endColorstr='#dddddd', GradientType=0); /* IE6-8 */
+       cursor: pointer;
+       font-size: 1em;
+       line-height: 1.4em;
+       width: auto;
+       overflow: visible;
+       -webkit-box-shadow: 0 1px 3px rgba(0,0,0,.2);
+       -moz-box-shadow: 0 1px 3px rgba(0,0,0,.2);
+       box-shadow: 0 1px 3px rgba(0,0,0,.2);
+}
 body .ui-button:hover {
-       border-color: #6e7273;
-       /* @embed */
-       background: #e1e1e1 url(images/button-over.png) repeat-x scroll 50% 100% !important;
+       color: #2779aa;
+       border-color: #bbb !important;
+       background: #fff !important;
+       background: -moz-linear-gradient(top, #fff 0%, #eee 90%) !important; /* FF3.6+ */
+       background: -webkit-linear-gradient(top, #fff 0%, #eee 90%) !important; /* Chrome10+, Safari5.1+ */
+       background: -o-linear-gradient(top, #fff 0%, #eee 90%) !important; /* Opera 11.10+ */
+       background: -ms-linear-gradient(top, #fff 0%, #eee 90%) !important; /* IE10+ */
+       background: linear-gradient(to bottom, #fff 0%, #eee 90%) !important;
+       filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffff', endColorstr='#eeeeee', GradientType=0); /* IE6-8 */
+       -webkit-box-shadow: 0 1px 3px rgba(0,0,0,.1);
+       -moz-box-shadow: 0 1px 3px rgba(0,0,0,.1);
+       box-shadow: 0 1px 3px rgba(0,0,0,.1);
 }
 body .ui-button:active,
 body .ui-button:focus {
-       border-color: #707271;
-       /* @embed */
-       background: #bfbfbf url(images/button-down.png) repeat-x scroll 50% 100% !important;
-}
-body .ui-button.disabled {
-       color: #7f7f7f;
-       border-color: #cccccc;
-       /* @embed */
-       background: #f2f2f2 url(images/button-disabled.png) repeat-x scroll 50% 100% !important;
-}
-/* Disables the annoying dashed border Firefox puts on active buttons */
-body button.ui-button::-moz-focus-inner {
-       border: 0;
-}
-/* Give large buttons some extra padding */
-body .ui-button-large {
-       padding: 5px;
-}
-/* Use white icons for colored buttons */
-.ui-button-green .ui-icon, .ui-button-blue .ui-icon, .ui-button-red .ui-icon, .ui-button-orange .ui-icon {
-       /* @embed */
-       background-image: url(images/ui-icons_ffffff_256x240.png) !important;
+       border-color: #8ad !important;
+       -webkit-box-shadow: 0 0 1px 1px rgba(167,215,249,.5);
+       -moz-box-shadow: 0 0 1px 1px rgba(167,215,249,.5);
+       box-shadow: 0 0 1px 1px rgba(167,215,249,.5);
+}
+body .ui-button:active {
+       background: #e0e0e0 !important;
+       background: -moz-linear-gradient(top, #f0f0f0 0%, #d0d0d0 90%) !important; /* FF3.6+ */
+       background: -webkit-linear-gradient(top, #f0f0f0 0%, #d0d0d0 90%) !important; /* Chrome10+, Safari5.1+ */
+       background: -o-linear-gradient(top, #f0f0f0 0%, #d0d0d0 90%) !important; /* Opera 11.10+ */
+       background: -ms-linear-gradient(top, #f0f0f0 0%, #d0d0d0 90%) !important; /* IE10+ */
+       background: linear-gradient(to bottom, #f0f0f0 0%, #d0d0d0 90%) !important;
+       filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#f0f0f0', endColorstr='#d0d0d0', GradientType=0); /* IE6-8 */
 }
 
 /* Green buttons */
-
+body .ui-button-green,
+body .ui-button-green .ui-button-text {
+       color: white;
+       text-shadow: 0 -1px 1px #072;
+}
 body .ui-button.ui-button-green {
-       color: white !important;
-       border-color: #97af7e !important;
-       /* @embed */
-       background: #3cb677 url(images/button-green.png) repeat-x scroll 50% 100% !important;
+       border-color: #294 !important;
+       background: #295 !important;
+       background: -moz-linear-gradient(top, #3c8 0%, #295 90%) !important; /* FF3.6+ */
+       background: -webkit-linear-gradient(top, #3c8 0%, #295 90%) !important; /* Chrome10+, Safari5.1+ */
+       background: -o-linear-gradient(top, #3c8 0%, #295 90%) !important; /* Opera 11.10+ */
+       background: -ms-linear-gradient(top, #3c8 0%, #295 90%) !important; /* IE10+ */
+       background: linear-gradient(to bottom, #3c8 0%, #295 90%) !important;
+       filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#33cc88', endColorstr='#229955', GradientType=0); /* IE6-8 */
+       -webkit-box-shadow: 0 1px 3px rgba(0,0,0,.3);
+       -moz-box-shadow: 0 1px 3px rgba(0,0,0,.3);
+       box-shadow: 0 1px 3px rgba(0,0,0,.3);
 }
 body .ui-button.ui-button-green:hover {
-       border-color: #778e61 !important;
-       /* @embed */
-       background: #339b65 url(images/button-green-hover.png) repeat-x scroll 50% 100% !important;
-}
-body .ui-button.ui-button-green.ui-button-large {
-       /* @embed */
-       background: #3cb677 url(images/button-green-large.png) repeat-x scroll 50% 100% !important;
-}
-body .ui-button.ui-button-green.ui-button-large:hover {
-       /* @embed */
-       background: #339b65 url(images/button-green-hover-large.png) repeat-x scroll 50% 100% !important;
-}
-body .ui-button.ui-button-green.disabled {
-       filter:alpha(opacity=50);
-       -moz-opacity:0.50;
-       -khtml-opacity: 0.50;
-       opacity: 0.50;
+       background: #33a055 !important;
+       background: -moz-linear-gradient(top, #44d388 0%, #33a055 90%) !important; /* FF3.6+ */
+       background: -webkit-linear-gradient(top, #44d388 0%, #33a055 90%) !important; /* Chrome10+, Safari5.1+ */
+       background: -o-linear-gradient(top, #44d388 0%, #33a055 90%) !important; /* Opera 11.10+ */
+       background: -ms-linear-gradient(top, #44d388 0%, #33a055 90%) !important; /* IE10+ */
+       background: linear-gradient(to bottom, #44d388 0%, #33a055 90%) !important;
+       filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#44d388', endColorstr='#33a055', GradientType=0); /* IE6-8 */
+       -webkit-box-shadow: 0 1px 3px rgba(0,0,0,.25);
+       -moz-box-shadow: 0 1px 3px rgba(0,0,0,.25);
+       box-shadow: 0 1px 3px rgba(0,0,0,.25);
+}
+body .ui-button.ui-button-green:active,
+body .ui-button.ui-button-green:focus {
+       border-color: #172 !important;
+       -webkit-box-shadow: 0 0 2px 2px rgba(167,215,249,.75);
+       -moz-box-shadow: 0 0 2px 2px rgba(167,215,249,.75);
+       box-shadow: 0 0 2px 2px rgba(167,215,249,.75);
+}
+body .ui-button.ui-button-green:active {
+       background: #338855 !important;
+       background: -moz-linear-gradient(top, #30c080 0%, #338855 90%) !important; /* FF3.6+ */
+       background: -webkit-linear-gradient(top, #30c080 0%, #338855 90%) !important; /* Chrome10+, Safari5.1+ */
+       background: -o-linear-gradient(top, #30c080 0%, #338855 90%) !important; /* Opera 11.10+ */
+       background: -ms-linear-gradient(top, #30c080 0%, #338855 90%) !important; /* IE10+ */
+       background: linear-gradient(to bottom, #30c080 0%, #338855 90%) !important;
+       filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#30c080', endColorstr='#338855', GradientType=0); /* IE6-8 */
 }
 
 /* Blue buttons */
-
+body .ui-button-blue,
+body .ui-button-blue .ui-button-text {
+       color: white;
+       text-shadow: 0 -1px 1px #037;
+}
 body .ui-button.ui-button-blue {
-       color: white !important;
-       border-color: #628acb !important;
-       /* @embed */
-       background: #3365ba url(images/button-blue.png) repeat-x scroll 50% 100% !important;
+       border-color: #468 !important;
+       background: #36b !important;
+       background: -moz-linear-gradient(top, #48e 0%, #36b 90%) !important; /* FF3.6+ */
+       background: -webkit-linear-gradient(top, #48e 0%, #36b 90%) !important; /* Chrome10+, Safari5.1+ */
+       background: -o-linear-gradient(top, #48e 0%, #36b 90%) !important; /* Opera 11.10+ */
+       background: -ms-linear-gradient(top, #48e 0%, #36b 90%) !important; /* IE10+ */
+       background: linear-gradient(to bottom, #48e 0%, #36b 90%) !important;
+       filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#4488ee', endColorstr='#3366bb', GradientType=0); /* IE6-8 */
+       -webkit-box-shadow: 0 1px 3px rgba(0,0,0,.35);
+       -moz-box-shadow: 0 1px 3px rgba(0,0,0,.35);
+       box-shadow: 0 1px 3px rgba(0,0,0,.35);
 }
 body .ui-button.ui-button-blue:hover {
-       border-color: #5375ad !important;
-       /* @embed */
-       background: #2b569e url(images/button-blue-hover.png) repeat-x scroll 50% 100% !important;
-}
-body .ui-button.ui-button-blue.ui-button-large {
-       /* @embed */
-       background: #3365ba url(images/button-blue-large.png) repeat-x scroll 50% 100% !important;
-}
-body .ui-button.ui-button-blue.ui-button-large:hover {
-       /* @embed */
-       background: #2b569e url(images/button-blue-hover-large.png) repeat-x scroll 50% 100% !important;
-}
-body .ui-button.ui-button-blue.disabled {
-       filter:alpha(opacity=50);
-       -moz-opacity:0.50;
-       -khtml-opacity: 0.50;
-       opacity: 0.50;
+       background: #36c !important;
+       background: -moz-linear-gradient(top, #59e 0%, #36c 90%) !important; /* FF3.6+ */
+       background: -webkit-linear-gradient(top, #59e 0%, #36c 90%) !important; /* Chrome10+, Safari5.1+ */
+       background: -o-linear-gradient(top, #59e 0%, #36c 90%) !important; /* Opera 11.10+ */
+       background: -ms-linear-gradient(top, #59e 0%, #36c 90%) !important; /* IE10+ */
+       background: linear-gradient(to bottom, #59e 0%, #36c 90%) !important;
+       filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#5599ee', endColorstr='#3366cc', GradientType=0); /* IE6-8 */
+}
+body .ui-button.ui-button-blue:active,
+body .ui-button.ui-button-blue:focus {
+       border-color: #357 !important;
+       -webkit-box-shadow: 0 0 2px 2px rgba(167,215,249,.75);
+       -moz-box-shadow: 0 0 2px 2px rgba(167,215,249,.75);
+       box-shadow: 0 0 2px 2px rgba(167,215,249,.75);
+}
+body .ui-button.ui-button-blue:active {
+       background: #3060a0 !important;
+       background: -moz-linear-gradient(top, #4080e0 0%, #3060a0 90%) !important; /* FF3.6+ */
+       background: -webkit-linear-gradient(top, #4080e0 0%, #3060a0 90%) !important; /* Chrome10+, Safari5.1+ */
+       background: -o-linear-gradient(top, #4080e0 0%, #3060a0 90%) !important; /* Opera 11.10+ */
+       background: -ms-linear-gradient(top, #4080e0 0%, #3060a0 90%) !important; /* IE10+ */
+       background: linear-gradient(to bottom, #4080e0 0%, #3060a0 90%) !important;
+       filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#4080e0', endColorstr='#3060a0', GradientType=0); /* IE6-8 */
 }
 
 /* Red buttons */
-
+body .ui-button-red,
+body .ui-button-red .ui-button-text {
+       color: white;
+       text-shadow: 0 -1px 1px #700;
+}
 body .ui-button.ui-button-red {
-       color: white !important;
-       border-color: #af977e !important;
-       /* @embed */
-       background: #cb0000 url(images/button-red.png) repeat-x scroll 50% 100% !important;
+       border-color: #944 !important;
+       background: #a22 !important;
+       background: -moz-linear-gradient(top, #d44 0%, #a22 90%) !important; /* FF3.6+ */
+       background: -webkit-linear-gradient(top, #d44 0%, #a22 90%) !important; /* Chrome10+, Safari5.1+ */
+       background: -o-linear-gradient(top, #d44 0%, #a22 90%) !important; /* Opera 11.10+ */
+       background: -ms-linear-gradient(top, #d44 0%, #a22 90%) !important; /* IE10+ */
+       background: linear-gradient(to bottom, #d44 0%, #a22 90%) !important;
+       filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#dd4444', endColorstr='#aa2222', GradientType=0); /* IE6-8 */
+       -webkit-box-shadow: 0 1px 3px rgba(0,0,0,.35);
+       -moz-box-shadow: 0 1px 3px rgba(0,0,0,.35);
+       box-shadow: 0 1px 3px rgba(0,0,0,.35);
 }
 body .ui-button.ui-button-red:hover {
-       border-color: #8e7761 !important;
-       /* @embed */
-       background: #ad0000 url(images/button-red-hover.png) repeat-x scroll 50% 100% !important;
-}
-body .ui-button.ui-button-red.ui-button-large {
-       /* @embed */
-       background: #cb0000 url(images/button-red.png) repeat-x scroll 50% 100% !important;
-}
-body .ui-button.ui-button-red.ui-button-large:hover {
-       /* @embed */
-       background: #ad0000 url(images/button-red-hover.png) repeat-x scroll 50% 100% !important;
-}
-body .ui-button.ui-button-red.disabled {
-       filter:alpha(opacity=50);
-       -moz-opacity:0.50;
-       -khtml-opacity: 0.50;
-       opacity: 0.50;
+       border-color: #a44 !important;
+       background: #b03333 !important;
+       background: -moz-linear-gradient(top, #ee4646 0%, #b03333 90%) !important; /* FF3.6+ */
+       background: -webkit-linear-gradient(top, #ee4646 0%, #b03333 90%) !important; /* Chrome10+, Safari5.1+ */
+       background: -o-linear-gradient(top, #ee4646 0%, #b03333 90%) !important; /* Opera 11.10+ */
+       background: -ms-linear-gradient(top, #ee4646 0%, #b03333 90%) !important; /* IE10+ */
+       background: linear-gradient(to bottom, #ee4646 0%, #b03333 90%) !important;
+       filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ee4646', endColorstr='#b03333', GradientType=0); /* IE6-8 */
+       -webkit-box-shadow: 0 1px 3px rgba(0,0,0,.3);
+       -moz-box-shadow: 0 1px 3px rgba(0,0,0,.3);
+       box-shadow: 0 1px 3px rgba(0,0,0,.3);
+}
+body .ui-button.ui-button-red:active,
+body .ui-button.ui-button-red:focus {
+       border-color: #747 !important;
+       -webkit-box-shadow: 0 0 2px 2px rgba(167,215,249,.7);
+       -moz-box-shadow: 0 0 2px 2px rgba(167,215,249,.7);
+       box-shadow: 0 0 2px 2px rgba(167,215,249,.7);
+}
+body .ui-button.ui-button-red:active {
+       background: #952020 !important;
+       background: -moz-linear-gradient(top, #d04545 0%, #952020 90%) !important; /* FF3.6+ */
+       background: -webkit-linear-gradient(top, #d04545 0%, #952020 90%) !important; /* Chrome10+, Safari5.1+ */
+       background: -o-linear-gradient(top, #d04545 0%, #952020 90%) !important; /* Opera 11.10+ */
+       background: -ms-linear-gradient(top, #d04545 0%, #952020 90%) !important; /* IE10+ */
+       background: linear-gradient(to bottom, #d04545 0%, #952020 90%) !important;
+       filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#d04545', endColorstr='#952020', GradientType=0); /* IE6-8 */
 }
 
-/* Orange buttons */
-
-body .ui-button.ui-button-orange {
-       color: white !important;
-       border-color: #f3a863 !important;
-       /* @embed */
-       background: #f07f14 url(images/button-orange.png) repeat-x scroll 50% 100% !important;
-}
-body .ui-button.ui-button-orange:hover {
-       border-color: #ce9055 !important;
-       /* @embed */
-       background: #cc6c11 url(images/button-orange-hover.png) repeat-x scroll 50% 100% !important;
-}
-body .ui-button.ui-button-orange.ui-button-large {
-       /* @embed */
-       background: #f07f14 url(images/button-orange-large.png) repeat-x scroll 50% 100% !important;
-}
-body .ui-button.ui-button-orange.ui-button-large:hover {
-       /* @embed */
-       background: #cc6c11 url(images/button-orange-hover-large.png) repeat-x scroll 50% 100% !important;
-}
-body .ui-button.ui-button-orange.disabled {
-       filter:alpha(opacity=50);
-       -moz-opacity:0.50;
-       -khtml-opacity: 0.50;
-       opacity: 0.50;
-}
+/* Disabled buttons */
+body .ui-button-green.disabled,
+body .ui-button-green.disabled:hover,
+body .ui-button-green.disabled:active,
+body .ui-button-green.disabled:focus,
+body .ui-button-blue.disabled,
+body .ui-button-blue.disabled:hover,
+body .ui-button-blue.disabled:active,
+body .ui-button-blue.disabled:focus,
+body .ui-button-red.disabled,
+body .ui-button-red.disabled:hover,
+body .ui-button-red.disabled:active,
+body .ui-button-red.disabled:focus,
+body .ui-button.disabled,
+body .ui-button.disabled:hover {
+       color: #aaa;
+       border-color: #ccc !important;
+       background: #eee !important;
+       background: -moz-linear-gradient(top, #f6f6f6 0%, #eee 90%) !important; /* FF3.6+ */
+       background: -webkit-linear-gradient(top, #f6f6f6 0%, #eee 90%) !important; /* Chrome10+, Safari5.1+ */
+       background: -o-linear-gradient(top, #f6f6f6 0%, #eee 90%) !important; /* Opera 11.10+ */
+       background: -ms-linear-gradient(top, #f6f6f6 0%, #eee 90%) !important; /* IE10+ */
+       background: linear-gradient(to bottom, #f6f6f6 0%, #eee 90%) !important;
+       filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#f6f6f6', endColorstr='#eeeeee', GradientType=0); /* IE6-8 */
+       -webkit-box-shadow: 0 1px 3px rgba(0,0,0,0);
+       -moz-box-shadow: 0 1px 3px rgba(0,0,0,0);
+       box-shadow: 0 1px 3px rgba(0,0,0,0);
+}
+body .ui-button-green.disabled .ui-button-text,
+body .ui-button-blue.disabled .ui-button-text,
+body .ui-button-red.disabled .ui-button-text {
+       color: #aaa;
+       text-shadow: 0 1px 1px #fff;
+}
\ No newline at end of file