MEC Single Event Page CSS Help

Any way to get the buttons on an individual MEC Event Page to use the X-theme CSS button styles?

See http://dev.zebulonpike.coloradodar.org/chapter-events/annual-membership-tea/?occurrence=2017-08-19

Hi there.

Thanks for writing in.

Please add this code to your global custom javascript.

jQuery( '.mec-events-button' ).addClass('x-btn').css('color', '#fff');

This will apply the button styling from your configured button color in theme’s options.

Thanks!

This doesn’t appear to work. It didn’t have any effect. I tried the following setting (based on the setting for the events listing page)
and was close but text is still black and the hover color doesn’t change.

.mec-events-button {
color: #fff;
border-color: #282b2d;
background-color: rgb(0,73,144);
margin-bottom: 0.25em;
text-shadow: 0 0.075em 0.075em rgba(0,0,0,0.5);
box-shadow: 0 0.25em 0 0 rgb(0,35,75), 0 4px 9px rgba(0,0,0,0.75);
border-radius: 100em;
}

.mec-events-button:hover {
color: #fff;
border-color: #141516;
background-color: rgb(225,58,62);
margin-bottom: 0.25em;
text-shadow: 0 0.075em 0.075em rgba(0,0,0,0.5);
box-shadow: 0 0.25em 0 0 rgb(120,26,31), 0 4px 9px rgba(0,0,0,0.75);
}

Hi again,

Remove your code and add this in your Child Theme’s style.css file:

.mec-events-button {
    color: #fff !important;
    border-color: #282b2d !important;
    background-color: rgb(0,73,144) !important;
    margin-bottom: 0.25em !important;
    text-shadow: 0 0.075em 0.075em rgba(0,0,0,0.5) !important;
    box-shadow: 0 0.25em 0 0 rgb(0,35,75), 0 4px 9px rgba(0,0,0,0.75) !important;
    border-radius: 100em !important;
}

.mec-events-button:hover {
    color: #fff !important;
    border-color: #141516 !important;
    background-color: rgb(225,58,62) !important;
    margin-bottom: 0.25em !important;
    text-shadow: 0 0.075em 0.075em rgba(0,0,0,0.5) !important;
    box-shadow: 0 0.25em 0 0 rgb(120,26,31), 0 4px 9px rgba(0,0,0,0.75) !important;
}

Cheers!

duh !important…Thanks that works now.

Glad it worked.

Cheers!

This topic was automatically closed 10 days after the last reply. New replies are no longer allowed.