Example Custom CSS

Users on the Professional and Business Plan are able to add custom CSS to their Pages. The below are few common scenarios for custom CSS, but are certainly not the only things you can do.

Need help? feel free to send us a message with what you're looking for and our staff will be happy to hand-craft you some CSS.

Change text color to white

/*** Make text white ***/
.vdp-datepicker__calendar { color: #FFF !important; }
.vdp-datepicker__calendar .cell.day { color: #FFF !important; }
.vdp-datepicker__calendar header .prev:after { border-right-color: #FFF !important; }
.vdp-datepicker__calendar header .next:after { border-left-color: #FFF !important; }

Remove border radius

/*** Remove border radius ***/
#visitor-page .calendar-wrapper { border-radius: 0px; }
#visitor-page .timelist-wrapper { border-radius: 0px; }

Calendar View: remove toolbar (i.e. timezone)

/*** Hide toolbar in Calendar View ***/
#full-calendar-toolbar { 
  opacity: 0; 
  margin-bottom: -3rem;
  pointer-events: none;
}

Still need help? Contact Us Contact Us