Archived

This topic is now archived and is closed to further replies.

  • 0

Styling buttons

Question

Posted · Report post

This should be easy, I'm just going around in circles for hours now and not seeing it. Can someone kindly point me in the direction of where the button styling is? I just want to change mine from grey to orange. I must be missing something obvious. :-(

Share this post


Link to post
Share on other sites

7 answers to this question

Posted · Report post

Oh - you're a legend Danny! Just tried it - works! You have saved sooo much of my time. The code is a lot more complicated than I would have guessed. I owe you a beer! And to anyone else reading this post, I have it working with GravityForms as well. Woot!

Share this post


Link to post
Share on other sites

Posted · Report post

Hi WonderWoman, FYI, if yo update to 2.2. you will be able to use shortcodes to create buttons like you see here. http://demo.pagelines.com/framework/tools/ Scroll down until you see buttons.

Share this post


Link to post
Share on other sites

Posted · Report post

The button color can most likely be changed using CSS added to Custom Code > Custom CSS in the theme settings. Which buttons on your site are you referring to exactly? Are you referring to the ones in your feature slider?

Share this post


Link to post
Share on other sites

Posted · Report post

Sorry, Catrina, should have been more specific. I meant the defaul "submit" type buttons.

Share this post


Link to post
Share on other sites

Posted · Report post

Hi Wonderwoman, I have provided you with the code used for most buttons. All you need to do is edit the code to match your color scheme and then add it to your custom CSS.

input[type="submit"], .submit, input[type="button"], .button, input[type="reset"], .reset {
	padding: 4px 9px;
	cursor: pointer;
	text-decoration: none;
	-moz-box-sizing: content-box;
	-webkit-box-sizing: content-box;
	box-sizing: content-box;
	-webkit-border-radius: 4px;
	-moz-border-radius: 4px;
	border-radius: 4px;
	color: black;
	text-shadow: 0 1px 0 rgba(255, 255, 255, 0.5);
	border: 1px solid #BBB;
	background: #EEE;
	background: -moz-linear-gradient(top,white 0%,gainsboro 100%);
	background: -webkit-gradient(linear,left top,left bottom,color-stop(0%,white),color-stop(100%,gainsboro));
	background: -webkit-linear-gradient(top,white 0%,gainsboro 100%);
	background: -o-linear-gradient(top,white 0%,gainsboro 100%);
	background: -ms-linear-gradient(top,white 0%,gainsboro 100%);
	background: linear-gradient(top,white 0%,gainsboro 100%);
	filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffff',endColorstr='#d3d3d3',GradientType=0);
	box-shadow: inset 1px 1px 0px white;
	}

Share this post


Link to post
Share on other sites