HomeMicrosoft 365SharePoint List and Microsoft List πŸ’₯ Form πŸ’₯ Formatting

SharePoint List and Microsoft List πŸ’₯ Form πŸ’₯ Formatting

This is a summary of the GitHub repository to format Microsoft List Forms in SharePoint Online or to format Microsoft List in Microsoft Teams.

This is the list as per 13/05/2022. I’ll update it regularly.

Getting started with : wrapped-body

Link

Workflow Progress Header

screenshot of the sample

This sample shows a checkmark for each date field that has a value to help convey when milestones have been hit.

Wave header and footer

This sample demonstrates how to display waves in the header and footer of a form. Waves are displayed using SVG.

screenshot of the sample

Status Header and Footer

This sample shows a customized header and footer for a form with a Status column with possible values ‘Thinking about it’, ‘Working on it’, ‘Done’, and ‘Nevermind’.

This format is intended for the Header Format and Footer Format of the form body in the Configure Layout panel. Depending on the value of the Status column, a corresponding icon and colour scheme are used.

screenshot of the sample

Ribbon Header

This sample demonstrates displaying a ribbon in the header. The values of the Title column are displayed in the ribbon.

screenshot of the sample

Event Itinerary Header

This sample shows a customized header for the item form used in the “Event itinerary” list template.

screenshot of the sample

This format is intended for the Header Format of the form body in the Configure Layout panel. The body layout shown in the screenshot can be obtained by configuring sections within the Body panel (not included in this format).

Dashed Line Header

This sample displays the Title and Description values in the heading and decorates them with dashed lines. If the Description value is empty, it will be hidden.

dashed-line-header-text-left.json 

Blank header

Link

- Advertisement -

LEAVE A REPLY

Please enter your comment!
Please enter your name here

This site uses Akismet to reduce spam. Learn how your comment data is processed.

CONNECT FOR MORE CONTENT

DO NOT MISS THOSE ARTICLES

Recent Comments