Customization

You can customize accent colors inside the calendar.

Theming

Theming is set inside ZaptimeConfig as theme key.

const config = {
    theme: {
        ....
    }
}

interface ZaptimeTheme {
  mode?: "light" | "dark";
  borderRadius?: string; // 4px or full
  colors?: {
    accentLight?: string;
    accentBase?: string;
    accentDark?: string;
  };
}

Profile image

You can set a profile image to be displayed inside the calendar.

const config = {
  profileImage: "http://test.test/my-image.png",
};

Compact mode

Default is false

const config = {
  compact: true | false,
};

External booking

Enables or disables built-in booking form.

Default is false

const config = {
  externalBooking: true | false,
};

Redirect after Booking

Redirects after booking to desired URL.

const config = {
  redirectAfterBookingUrl: "https://example.com/success-page",
};

Hide location

Calendar automatically shows where will the event take place. Options are Google Meet, address, phone call, and more.

Default is false

const config = {
  hideLocation: true,
};