Calendar Header

Resolved webdevpinn
(@webdevpinn)

6 years, 6 months ago

I’ve recently started using the plugin and I’ve been fairly satisfied with it. I would like to know if it’s possible to make changes to the arrows used to cycle through months on the calendar. Currently, they are in the service bar but I’d like them to be in the calendar header as they appear in the form editor. Is there a way to achieve this?

The page I need help with: [log in to see the link]

Viewing 2 replies - 1 through 2 (of 2 total)

Plugin Author

(@codepeople)

Hi,

Add these CSS rules into Appointment Hour Booking -> General Settings -> Edit Styles in order to avoid the conflict with your theme:

#fbuilder .ui-datepicker .ui-datepicker-header{height:auto;background:#000}
#fbuilder .ui-datepicker .ui-datepicker-header span{color:#fff;}
#fbuilder .ui-datepicker .ui-datepicker-prev,#fbuilder .ui-datepicker .ui-datepicker-next{position:relative;right:auto;line-height:normal;}
#fbuilder .ui-datepicker .ui-datepicker-prev::after,#fbuilder .ui-datepicker .ui-datepicker-next::after{display:none}
#fbuilder .ui-datepicker-title{text-align:center}
#fbuilder .ui-datepicker::before{display:none}

More info about customizing styles:

https://apphourbooking.dwbooster.com/blog/2018/11/02/customizing-styles/

Thank you for using the plugin!

Thread Starter

Tags