Styling Buttons on Calendar Page

Good Day, please know that Opentickets is an open source plugin so you are free to make changes. Please know that any core changes will be affected if there are new versions to update. Let us know if there is any other assistance needed.

I understand that thanks. I need assistance with the code required to make changes in the css that only affect the OpenTickets buttons.

I have tried the code below but it affects every button on the site.

button:not(.pswp__button):not(.customize-partial-edit-shortcut-button):not(.fancybox-button):not(.home), .button {
font-size: 1rem;
padding: 0;
color: #000;
}

button:not(.home):not(.pswp__button):not(.customize-partial-edit-shortcut-button):not(.fancybox-button):disabled, button:not(.pswp__button):not(.customize-partial-edit-shortcut-button):not(.fancybox-button):disabled[disabled], button:not(.pswp__button):not(.customize-partial-edit-shortcut-button):not(.fancybox-button).disabled, .button:disabled, .button:disabled[disabled], .button.disabled {
padding: 0;
color: #000;
}

.fc-state-default:not(.home) {
color: #000;
}

Hey @wrconsultancy,

You have a couple options here, which will work without using a css3 selector. The calendar page itself should have a ‘body class’ called ‘page-template-qsot-calendar-php’. Second, if your theme does not add that class for some reason (unlikely), or if you want to narrow the button styling changes to literally just those on the calendar, you can use the ‘container class’, for the container that the calendar sits in, ‘calendar-content-wrap’. Here is an example of what that might look like:

.calendar-content-wrap .button { padding:0; color:#000; font-size:1rem; }
.calendar-content-wrap .button.disabled,
.calendar-content-wrap .button:disabled { padding:0; color:#000; }
.calendar-content-wrap .button.fc-state-default { color:#000; }

If you find that some or all of these do not seem to apply to your buttons on the calendar page, you most likely need to be more specific with the selector. You can do this by adding more parent elements to your selector, or by adding !important.

Hope this helps,
Loushou