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
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.