CSS Code for adapting booking button

Ask the Community Customization
1

I want to adapt the booking button:

image
image277×144 2.78 KB

that it looks like our secondary button type:
image

Could you please share CSS code for it?

Thx & BR

2 Likes
3

Hi there, @user14693 :waving_hand:

Sure, here is a code to change the button color, width, height and border radius:

.es-service-card-action-book-button {
  border-radius:0!important;
  background-color: gray!important;
  border: gray;
  height: 42px;
  width: 100px;
}

[class*="ButtonBase__Overlay-sc"] {
  background-color: gray!important;
}

And this code will help you change the font a color of the button text:

[class*="ButtonBase__Ellipsis-sc"] {
  color: white;
  font-family: Calibri;
}

Please adjust the values and colors in the codes to your liking and add them to the Custom CSS field on the Settings tab of your widget’s settings :slightly_smiling_face:

3 Likes