Forum:How do i change the button color?

How do I change the color of the wiki buttons? WifiShadow 23:38, August 10, 2010 (UTC)
 * cb=250...r=notIE (line 352)
 * a.wikia-button:active, span.wikia-button a:active, input[type="submit"]:active, input[type="reset"]:active, input[type="button"]:active, button:active { background-image:-moz-linear-gradient(center top, #006722 20%, #009933 70%); color:#FFFFFF; }


 * cb=250...r=notIE (line 287)
 * a.wikia-button, span.wikia-button a, input[type="submit"], input[type="reset"], input[type="button"], button { -moz-border-radius:7px 7px 7px 7px; -moz-box-shadow:0 0 0 1px #2C802C; background-color:#009933; background image:-moz-linear-gradient(center top, #009933 20%, #006722 70%); border:1px solid #BEDDBE; color:#FFFFFF; cursor:pointer; display:inline-block; font:bold 12px/17px "Lucida Grande",sans-serif; height:17px; margin:0; padding:0 7px; text-decoration:none; white-space:nowrap; }


 * That is how it's currently set -- 00:02, August 11, 2010 (UTC)

Edit the "@group BUTTONS" section in the Monaco.css, below is from the Wikia Obsession.

The IE color gradients are a little different and have a "FF" in front of the normal 6 digit hex for the color.

/* @group BUTTONS */

a.wikia-button, a.wikia-button:visited, span.wikia-button a, span.wikia-button a:visited, input[type="submit"], input[type="reset"], input[type="button"], button { background-color: #0C710A; background-image: -moz-linear-gradient(top, #0F910D 20%, #0C710A 70%); background-image: -webkit-gradient(linear, 0% 20%, 0% 70%, from(#0F910D), to(#0C710A)); border-color: #FFFFFF; box-shadow: 0 1px 0 #0C6B0A, 0 -1px 0 #0C6B0A, 1px 0 0 #0C6B0A, -1px 0 0 #0C6B0A; color: #FFFFFF; -moz-box-shadow: 0 0 0 1px #0C6B0A; -webkit-box-shadow: 0 1px 0 #0C6B0A, 0 -1px 0 #0C6B0A, 1px 0 0 #0C6B0A, -1px 0 0 #0C6B0A; }

/* IE Styles */ a.wikia-button, span.wikia-button a, input[type="submit"], input[type="reset"], input[type="button"], button { filter:progid:DXImageTransform.Microsoft.Gradient(GradientType=0, StartColorStr="#FF0F910D", EndColorStr="#FF0C710A"); outline: 1px solid #0C6B0A\9; }

/* Hover and Active states */ a.wikia-button:hover, span.wikia-button a:hover, input[type="submit"]:hover, input[type="reset"]:hover, input[type="button"]:hover, button:hover { text-shadow: #000 0 1px 1px; }

a.wikia-button:active, span.wikia-button a:active, input[type="submit"]:active, input[type="reset"]:active, input[type="button"]:active, button:active { color: #FFF; background-image: -moz-linear-gradient(top, #0C710A 20%, #0F910D 70%); background-image: -webkit-gradient(linear, 0% 20%, 0% 70%, from(#0C710A), to(#0F910D)); } There are some specific colors in the Stock Themes section of the Logo Creation Wiki, just copy the "@group BUTTONS".
 * --Sxerks 00:15, August 11, 2010 (UTC)

Thanks you both for the reply's. It turned out that this line background-image: -moz-linear-gradient(top, #0F910D 20%, #0C710A 70%); I had it background-image: -moz-linear-gradient(top, #0F910D 20%, #0C710A70%);

Changing it worked, but ended up following the later suggestion of copying the buttons part of the stock them. WifiShadow 00:55, August 11, 2010 (UTC)
 * There is a button generator here. —Manyman (talk) 07:30, August 11, 2010 (UTC)


 * Awesome find, worked great and got the exact colors I wanted. WifiShadow 11:44, August 11, 2010 (UTC)