Type AliasFormsListStyles

FormsListStyles: FormsAppEnvironmentStyles & {
    footer?: {
        html: string;
    };
    header?: {
        html: string;
    };
    menuItems: FormsAppMenuItem[];
}

For Forms Apps of type TILES ContainerMenuItem, FormMenuItem and HrefMenuItem can be used in the menuItems array, as well as ScreenMenuItem excluding the FORMS_LIST type.

Form Forms Apps of type FORMS_LIST only ScreenMenuItem and HrefMenuItem can be used in the menuItems array.

Examples

Forms List Apps

{
  "foregroundColour": "#454545",
  "highlightColour": "#676767",
  "contrastColour": "#FFFFFF",
  "customCss": ".ob-form { background-color: red; }",
  "logoUrl": "https://my-website.com/logo.png",
  "menuItems": [
    {
      "label": "Profile",
      "icon": "person",
      "type": "PROFILE",
      "isHidden": false,
      "isDefault": true
    },
    {
      "label": "Google",
      "icon": "search",
      "type": "HREF",
      "href": "https://google.com"
    }
  ]
}

Container Apps

{
  "foregroundColour": "#454545",
  "highlightColour": "#676767",
  "contrastColour": "#FFFFFF",
  "customCss": ".ob-form { background-color: red; }",
  "logoUrl": "https://my-website.com/logo.png",
  "menuItems": [
    {
      "label": "Forms",
      "icon": "dashboard",
      "type": "CONTAINER",
      "formIds": [1, 2, 3]
    },
    {
      "label": "Compliance Check",
      "icon": "search",
      "type": "FORM",
      "formId": 2
    },
    {
      "label": "Google",
      "icon": "search",
      "type": "HREF",
      "href": "https://google.com"
    }
  ]
}

Volunteer Apps

{
  "foregroundColour": "#454545",
  "highlightColour": "#676767",
  "contrastColour": "#FFFFFF",
  "customCss": ".ob-form { background-color: red; }",
  "logoUrl": "https://my-website.com/logo.png"
}

Type declaration

  • Optionalfooter?: {
        html: string;
    }

    Configuration to add a footer displayed at the bottom of the page.

    • html: string

      The HTML to display as the footer.

  • Optionalheader?: {
        html: string;
    }

    Configuration to add a header displayed at the top of the page.

    • html: string

      The HTML to display as the header.

  • menuItems: FormsAppMenuItem[]

    Array of menu item objects. See above for which menu items to use for different forms app types

Settings

On This Page

Examples