Helpful CSS Snippets

Please see our article on adding custom CSS stylesheets to Simply Schedule Appointments.

Hide icons on booking form

After customers have selected the date and time for their appointment, they are asked for information, including name and email address. Here’s how to hide the icons on that form.

body .md-input-container .md-icon {
display: none;
}

body .md-input-container .md-icon:not(.md-icon-delete)~label {
left: 0;
}

body .md-input-container .md-icon:not(.md-icon-delete)~.md-input {
margin-left: 0;
}


Hide action buttons on booking form

After customers finish booking their appointment, they are given options to edit/cancel/reschedule. Here’s how to hide those options:

.confirmation-actions .appointment-actions {
display: none;
}


More to come soon!