Home

Customization Guide

Different UI views

"attributes" section

Required attributes to display widget in All appointment list view.

JSON Configuration File

{
  "interfaces": {},
  "endpoints": {
    "userProfile": "users/me",
    "providers": "v2/Providers",
    "userLocation": "v1/location",
    "providerSearch": "v2/providers",
    "users": "v2/users/me",
    "usersV1": "v1/users/me",
    "appointments": "v1/appointments"
  },
  "theme": {
    "fonts": {
      "fontFamily": "CustomFont",
      "fontUrl": "/assets/fonts/TradeGothicNextLTPro-Rg.ttf",
      "fontType": "truetype"
    },
    "colors": {
      "locationPinColor": "#ed711c",
      "locationPinOutline": "#c85200",
      "locationPinLabel": "#fff",
      "badgeValidColor": "#c85200",
      "badgeInvalidColor": "#4d525a",
      "actionContent": "#0079d0",
      "videoBadgeBackground": "#e6f5ff",
      "actionHoverstate": "#005591",
      "videoBadgeContent": "#0061a7",
      "contentBackground": "#fff",
      "bodyContent": "#4d525a",
      "footerBackground": "#f4f4f4",
      "activeProviderOffice": "#e3e1dc",
      "inactiveProviderOffice": "#0079d0",
      "calendarDateDisabled": "#b0a9a1",
      "toolTipBackground": "#fff",
      "toolTipColor": "#666",
      "toolTipBoxShadow": "#ccc",
      "loadingCircleColor": "#ed711c",
      "scheduleAppointmentBoxShadow": "#e7e7e7",
      "callIcon": "#575C65",
      "appointmentInfoTooltip": "#0079d0",
      "dateColorInactive": "#4d525a80",
      "dateColorActive": "#4d525a",
      "whiteColor": "#ffffff",
      "providerSearchIcon": "#ed711c",
      "locationSearchIcon": "#ed711c",
      "dividerColor": "#e3e1dc"
    }
  },
  "morelessPagination": {
    "pageLimitSection": 5
  },
  "ProviderCardParam": {
    "radius": 10,
    "searchTerm": "",
    "heading": "Find Providers near you",
    "subHeading": "This list has been handpicked just for you. You may also search our networks by checking for button below.",
    "numberOfItems": 20
  },
  "bookingBaseUrl": "https://slot2.dev.dignityhealth.org",
  "fadSaasAppFile": "fad-saas.js",
  "fadSaasAppConfig": "example-application/fad-configuration.json",
  "fadSaasRuntimeConfig": "runtime.config.json"
}

Interfaces

Endpoints

Controls endpoints for different services.

Theme

This section of the JSON controls color schemes and fonts for the application.

"fonts" section

Here you can define your own custom font to be used throughout the page.

Key Description Required
fontFamily Name of the custom font you are providing yes
fontUrl URL of the font binary file yes
fontType Format of the font you are providing yes

"colors" section

Here you can define colors for the various components within the application.

MoreLessPagination

Controls pagination on my care team listing.

bookingBaseUrl

Controls routing for appointment booking.

isCaptchaEnabled

Configuration to enable Captcha in schedule an appointment.

ProviderCardParam

Controls for fad-saas provider-card components settings.

**Under Development**