Custom CSS with MemberMouse and Enofld - Support | Kriesi.at

Viewing 6 posts - 1 through 6 (of 6 total)

Author

Posts

September 16, 2014 at 6:56 am #319597

Hello, I have recently setup MemberMouse with my Enfold theme. It seems as if Enfold strips out the CSS MM uses and makes it look pretty ugly.

Is there anyway for me to get the MM CSS to work or am I stuck hiring a Developer to get my Membership core pages looking good?

Thanks for your help on this.

-Seth

September 16, 2014 at 3:16 pm #319908

Yigit

Keymaster

Hi sethriley!

Can you post a link and show us how it should look like?

Cheers!
Yigit

September 16, 2014 at 5:13 pm #320008

sethriley

Participant

Yeah sure. MemberMouse gives the option to disable or enable CSS for the core pages. http://screencast.com/t/l5eMJwVL

Checkout Page: https://membermouse.com/checkout/?rid=pG52Vl

My Account Page: http://screencast.com/t/LxbbIkCVxkV

And the login form should look like the checkout page only with a simple login form.

MemberMouse uses their own Membership plugin on their site so just by visiting the site you can see some of the functionality they use in their plugin. https://membermouse.com/

Let me know if you need anything else.

PS. I checked the MemberMouse Custom CSS options to output the CSS I wanted to use but Enfold Overrides its somehow.

Thanks

September 18, 2014 at 12:33 am #320802

Josue

Inactive Moderator

Hey!

Open /wp-content/themes/enfold/css/base.css and remove from line 184 to line 253:


	#top form {
		margin-bottom: 20px; }
	#top fieldset {
		margin-bottom: 20px; }
	#top .input-text,
	#top input[type="text"],
	#top input[type="input"],
	#top input[type="password"],
	#top input[type="email"],
	#top input[type="number"],
    #top input[type="url"],
    #top input[type="tel"],
    #top input[type="search"],
	#top textarea,
	#top select {
		 -webkit-appearance: none;
		border: 1px solid #e1e1e1;
		padding: 8px 6px;
		outline: none;
		font: 13px "HelveticaNeue", "Helvetica Neue", Helvetica, Arial, sans-serif;
		color: #777;
		margin: 0;
		width: 210px;
		max-width: 100%;
		display: block;
		margin-bottom: 20px;
		background: #fff;
		border-radius: 0px;
		}

	#top input[type="text"]:focus,
	#top input[type="password"]:focus,
	#top input[type="email"]:focus,
	#top input[type="number"]:focus,
    #top input[type="url"]:focus,
    #top input[type="tel"]:focus,
    #top input[type="search"]:focus,
	#top textarea:focus {
		box-shadow: 0px 0px 2px 0px rgba(0,0,0,0.2);
 		color: #555;
		}
	#top textarea {
		min-height: 60px; line-height:1.5em;}
	#top label{
		display: block;
		font-weight: bold;
		font-size: 12px;  }
	#top legend {
		display: block;
		font-weight: normal;
		font-size: 15px;  }
	#top select {
		width: 220px; }
	#top input[type="checkbox"] {
		display: inline; }
	#top label span,
	#top legend span {
		font-weight: normal;
		font-size: 13px;
		color: #444; }

	#top textarea{width:100%;}

#top #wrap_all .valid .text_input, #top #wrap_all .valid .text_area, #top #wrap_all .valid .select{border:1px solid #9AA600;} /*#70A41B*/
#top #wrap_all .error .text_input, #top #wrap_all .error .text_area, #top #wrap_all .error .select{border:1px solid #DF653E;}
#top #wrap_all .ajax_alert .text_input, #top #wrap_all .ajax_alert .text_area, #top #wrap_all .ajax_alert .select{border:1px solid #ffb628;}
#top #wrap_all .valid  .input_checkbox_label{color:#9AA600;}
#top #wrap_all .error  .input_checkbox_label{color:#DF653E;}

Regards,
Josue

September 18, 2014 at 11:05 am #321078

sethriley

Participant

If I delete this code will it effect anything else on the site. or is there something I should be aware of?

Thank you for your help on this guys!

September 18, 2014 at 7:45 pm #321433

Josue

Inactive Moderator

Hi Seth!

Yes, that will make any Enfold contact form loss its styling, is that a problem for you?

Best regards,
Josue