Jump to content
Sign in to follow this  
wonderwoman

Styling buttons

Recommended Posts

wonderwoman    0
wonderwoman

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
catrina    103
catrina

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?


Please read the docs before posting. Please do not private message me unless I ask you to.

Designer | Catrina Dulay

Founder | Catrina and Mouse

Share this post


Link to post
Share on other sites
wonderwoman    0
wonderwoman

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

Share this post


Link to post
Share on other sites
Danny    1,327
Danny

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;
	}


Please search our forums, before posting!

Share this post


Link to post
Share on other sites
wonderwoman    0
wonderwoman

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
Danny    1,327
Danny

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.


Please search our forums, before posting!

Share this post


Link to post
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now

Sign in to follow this  

×