Samples

These samples are just a teaser of the type of cards you can create. Go ahead and tweak them to make any scenario possible!

Expense report

{
    "type": "AdaptiveCard",
    "body": [
        {
            "type": "Container",
            "style": "emphasis",
            "items": [
                {
                    "type": "ColumnSet",
                    "columns": [
                        {
                            "type": "Column",
                            "items": [
                                {
                                    "type": "TextBlock",
                                    "size": "Large",
                                    "weight": "Bolder",
                                    "text": "**EXPENSE APPROVAL**"
                                }
                            ],
                            "width": "stretch"
                        },
                        {
                            "type": "Column",
                            "items": [
                                {
                                    "type": "Image",
                                    "url": "https://adaptivecards.io/content/pending.png",
                                    "height": "30px",
                                    "altText": "Pending"
                                }
                            ],
                            "width": "auto"
                        }
                    ]
                }
            ],
            "bleed": true
        },
        {
            "type": "Container",
            "items": [
                {
                    "type": "ColumnSet",
                    "columns": [
                        {
                            "type": "Column",
                            "items": [
                                {
                                    "type": "TextBlock",
                                    "size": "ExtraLarge",
                                    "text": "Trip to UAE",
                                    "wrap": true
                                },
                                {
                                    "type": "TextBlock",
                                    "spacing": "Small",
                                    "size": "Small",
                                    "weight": "Bolder",
                                    "color": "Accent",
                                    "text": "[ER-13052](https://adaptivecards.io)"
                                }
                            ],
                            "width": "stretch"
                        },
                        {
                            "type": "Column",
                            "items": [
                                {
                                    "type": "ActionSet",
                                    "actions": [
                                        {
                                            "type": "Action.OpenUrl",
                                            "title": "EXPORT AS PDF",
                                            "url": "https://adaptivecards.io"
                                        }
                                    ]
                                }
                            ],
                            "width": "auto"
                        }
                    ]
                },
                {
                    "type": "FactSet",
                    "spacing": "Large",
                    "facts": [
                        {
                            "title": "Submitted By",
                            "value": "**Matt Hidinger**  matt@contoso.com"
                        },
                        {
                            "title": "Duration",
                            "value": "2019/06/19 - 2019/06/25"
                        },
                        {
                            "title": "Submitted On",
                            "value": "2019/04/14"
                        },
                        {
                            "title": "Reimbursable Amount",
                            "value": "$ 404.30"
                        },
                        {
                            "title": "Awaiting approval from",
                            "value": "**Thomas**  thomas@contoso.com"
                        },
                        {
                            "title": "Submitted to",
                            "value": "**David**   david@contoso.com"
                        }
                    ]
                }
            ]
        },
        {
            "type": "Container",
            "spacing": "Large",
            "style": "emphasis",
            "items": [
                {
                    "type": "ColumnSet",
                    "columns": [
                        {
                            "type": "Column",
                            "items": [
                                {
                                    "type": "TextBlock",
                                    "weight": "Bolder",
                                    "text": "DATE"
                                }
                            ],
                            "width": "auto"
                        },
                        {
                            "type": "Column",
                            "spacing": "Large",
                            "items": [
                                {
                                    "type": "TextBlock",
                                    "weight": "Bolder",
                                    "text": "CATEGORY"
                                }
                            ],
                            "width": "stretch"
                        },
                        {
                            "type": "Column",
                            "items": [
                                {
                                    "type": "TextBlock",
                                    "weight": "Bolder",
                                    "text": "AMOUNT"
                                }
                            ],
                            "width": "auto"
                        }
                    ]
                }
            ],
            "bleed": true
        },
        {
            "type": "ColumnSet",
            "columns": [
                {
                    "type": "Column",
                    "items": [
                        {
                            "type": "TextBlock",
                            "text": "06/19",
                            "wrap": true
                        }
                    ],
                    "width": "auto"
                },
                {
                    "type": "Column",
                    "spacing": "Medium",
                    "items": [
                        {
                            "type": "TextBlock",
                            "text": "Air Travel Expense",
                            "wrap": true
                        }
                    ],
                    "width": "stretch"
                },
                {
                    "type": "Column",
                    "items": [
                        {
                            "type": "TextBlock",
                            "text": "$ 300",
                            "wrap": true
                        }
                    ],
                    "width": "auto"
                },
                {
                    "type": "Column",
                    "id": "chevronDown1",
                    "spacing": "Small",
                    "verticalContentAlignment": "Center",
                    "items": [
                        {
                            "type": "Image",
                            "selectAction": {
                                "type": "Action.ToggleVisibility",
                                "title": "collapse",
                                "targetElements": [
                                    "cardContent1",
                                    "chevronUp1",
                                    "chevronDown1"
                                ]
                            },
                            "url": "https://adaptivecards.io/content/down.png",
                            "width": "20px",
                            "altText": "collapsed"
                        }
                    ],
                    "width": "auto"
                },
                {
                    "type": "Column",
                    "id": "chevronUp1",
                    "isVisible": false,
                    "spacing": "Small",
                    "verticalContentAlignment": "Center",
                    "items": [
                        {
                            "type": "Image",
                            "selectAction": {
                                "type": "Action.ToggleVisibility",
                                "title": "expand",
                                "targetElements": [
                                    "cardContent1",
                                    "chevronUp1",
                                    "chevronDown1"
                                ]
                            },
                            "url": "https://adaptivecards.io/content/up.png",
                            "width": "20px",
                            "altText": "expanded"
                        }
                    ],
                    "width": "auto"
                }
            ]
        },
        {
            "type": "Container",
            "id": "cardContent1",
            "isVisible": false,
            "items": [
                {
                    "type": "Container",
                    "items": [
                        {
                            "type": "TextBlock",
                            "text": "* Leg 1 on Tue, Jun 19th, 2019 at 6:00 AM.",
                            "isSubtle": true,
                            "wrap": true
                        },
                        {
                            "type": "TextBlock",
                            "text": "* Leg 2 on Tue,Jun 19th, 2019 at 7:15 PM.",
                            "isSubtle": true,
                            "wrap": true
                        },
                        {
                            "type": "Container",
                            "items": [
                                {
                                    "type": "Input.Text",
                                    "id": "comment1",
                                    "placeholder": "Add your comment here."
                                }
                            ]
                        }
                    ]
                },
                {
                    "type": "Container",
                    "items": [
                        {
                            "type": "ColumnSet",
                            "columns": [
                                {
                                    "type": "Column",
                                    "items": [
                                        {
                                            "type": "ActionSet",
                                            "actions": [
                                                {
                                                    "type": "Action.Submit",
                                                    "title": "Send",
                                                    "data": {
                                                        "id": "_qkQW8dJlUeLVi7ZMEzYVw",
                                                        "action": "comment",
                                                        "lineItem": 1
                                                    }
                                                }
                                            ]
                                        }
                                    ],
                                    "width": "auto"
                                }
                            ]
                        }
                    ]
                }
            ]
        },
        {
            "type": "ColumnSet",
            "columns": [
                {
                    "type": "Column",
                    "items": [
                        {
                            "type": "TextBlock",
                            "horizontalAlignment": "Center",
                            "text": "06/19",
                            "wrap": true
                        }
                    ],
                    "width": "auto"
                },
                {
                    "type": "Column",
                    "spacing": "Medium",
                    "items": [
                        {
                            "type": "TextBlock",
                            "text": "Auto Mobile Expense",
                            "wrap": true
                        }
                    ],
                    "width": "stretch"
                },
                {
                    "type": "Column",
                    "items": [
                        {
                            "type": "TextBlock",
                            "text": "$ 100",
                            "wrap": true
                        }
                    ],
                    "width": "auto"
                },
                {
                    "type": "Column",
                    "id": "chevronDown2",
                    "spacing": "Small",
                    "verticalContentAlignment": "Center",
                    "items": [
                        {
                            "type": "Image",
                            "selectAction": {
                                "type": "Action.ToggleVisibility",
                                "title": "collapse",
                                "targetElements": [
                                    "cardContent2",
                                    "chevronUp2",
                                    "chevronDown2"
                                ]
                            },
                            "url": "https://adaptivecards.io/content/down.png",
                            "width": "20px",
                            "altText": "collapsed"
                        }
                    ],
                    "width": "auto"
                },
                {
                    "type": "Column",
                    "id": "chevronUp2",
                    "isVisible": false,
                    "spacing": "Small",
                    "verticalContentAlignment": "Center",
                    "items": [
                        {
                            "type": "Image",
                            "selectAction": {
                                "type": "Action.ToggleVisibility",
                                "title": "expand",
                                "targetElements": [
                                    "cardContent2",
                                    "chevronUp2",
                                    "chevronDown2"
                                ]
                            },
                            "url": "https://adaptivecards.io/content/up.png",
                            "width": "20px",
                            "altText": "expanded"
                        }
                    ],
                    "width": "auto"
                }
            ]
        },
        {
            "type": "Container",
            "id": "cardContent2",
            "isVisible": false,
            "items": [
                {
                    "type": "Container",
                    "items": [
                        {
                            "type": "TextBlock",
                            "text": "* Contoso Car Rentrals, Tues 6/19 at 7:00 AM",
                            "isSubtle": true,
                            "wrap": true
                        },
                        {
                            "type": "Container",
                            "items": [
                                {
                                    "type": "Input.Text",
                                    "id": "comment2",
                                    "placeholder": "Add your comment here."
                                }
                            ]
                        }
                    ]
                },
                {
                    "type": "Container",
                    "items": [
                        {
                            "type": "ColumnSet",
                            "columns": [
                                {
                                    "type": "Column",
                                    "items": [
                                        {
                                            "type": "ActionSet",
                                            "actions": [
                                                {
                                                    "type": "Action.Submit",
                                                    "title": "Send",
                                                    "data": {
                                                        "id": "_qkQW8dJlUeLVi7ZMEzYVw",
                                                        "action": "comment",
                                                        "lineItem": 2
                                                    }
                                                }
                                            ]
                                        }
                                    ],
                                    "width": "auto"
                                }
                            ]
                        }
                    ]
                }
            ]
        },
        {
            "type": "ColumnSet",
            "columns": [
                {
                    "type": "Column",
                    "items": [
                        {
                            "type": "TextBlock",
                            "horizontalAlignment": "Center",
                            "text": "06/25",
                            "wrap": true
                        }
                    ],
                    "width": "auto"
                },
                {
                    "type": "Column",
                    "spacing": "Medium",
                    "items": [
                        {
                            "type": "TextBlock",
                            "text": "Air Travel Expense",
                            "wrap": true
                        }
                    ],
                    "width": "stretch"
                },
                {
                    "type": "Column",
                    "items": [
                        {
                            "type": "TextBlock",
                            "text": "$ 4.30",
                            "wrap": true
                        }
                    ],
                    "width": "auto"
                },
                {
                    "type": "Column",
                    "id": "chevronDown3",
                    "spacing": "Small",
                    "verticalContentAlignment": "Center",
                    "items": [
                        {
                            "type": "Image",
                            "selectAction": {
                                "type": "Action.ToggleVisibility",
                                "title": "collapse",
                                "targetElements": [
                                    "cardContent3",
                                    "chevronUp3",
                                    "chevronDown3"
                                ]
                            },
                            "url": "https://adaptivecards.io/content/down.png",
                            "width": "20px",
                            "altText": "collapsed"
                        }
                    ],
                    "width": "auto"
                },
                {
                    "type": "Column",
                    "id": "chevronUp3",
                    "isVisible": false,
                    "spacing": "Small",
                    "verticalContentAlignment": "Center",
                    "items": [
                        {
                            "type": "Image",
                            "selectAction": {
                                "type": "Action.ToggleVisibility",
                                "title": "expand",
                                "targetElements": [
                                    "cardContent3",
                                    "chevronUp3",
                                    "chevronDown3"
                                ]
                            },
                            "url": "https://adaptivecards.io/content/up.png",
                            "width": "20px",
                            "altText": "expanded"
                        }
                    ],
                    "width": "auto"
                }
            ]
        },
        {
            "type": "Container",
            "id": "cardContent3",
            "isVisible": false,
            "items": [
                {
                    "type": "Container",
                    "items": [
                        {
                            "type": "Input.Text",
                            "id": "comment3",
                            "placeholder": "Add your comment here."
                        }
                    ]
                },
                {
                    "type": "Container",
                    "items": [
                        {
                            "type": "ColumnSet",
                            "columns": [
                                {
                                    "type": "Column",
                                    "items": [
                                        {
                                            "type": "ActionSet",
                                            "actions": [
                                                {
                                                    "type": "Action.Submit",
                                                    "title": "Send",
                                                    "data": {
                                                        "id": "_qkQW8dJlUeLVi7ZMEzYVw",
                                                        "action": "comment",
                                                        "lineItem": 3
                                                    }
                                                }
                                            ]
                                        }
                                    ],
                                    "width": "auto"
                                }
                            ]
                        }
                    ]
                }
            ]
        },
        {
            "type": "ColumnSet",
            "spacing": "Large",
            "separator": true,
            "columns": [
                {
                    "type": "Column",
                    "items": [
                        {
                            "type": "TextBlock",
                            "horizontalAlignment": "Right",
                            "text": "Total Expense Amount \t",
                            "wrap": true
                        },
                        {
                            "type": "TextBlock",
                            "horizontalAlignment": "Right",
                            "text": "Non-reimbursable Amount",
                            "wrap": true
                        },
                        {
                            "type": "TextBlock",
                            "horizontalAlignment": "Right",
                            "text": "Advance Amount",
                            "wrap": true
                        }
                    ],
                    "width": "stretch"
                },
                {
                    "type": "Column",
                    "items": [
                        {
                            "type": "TextBlock",
                            "text": "404.30"
                        },
                        {
                            "type": "TextBlock",
                            "text": "(-) 0.00 \t"
                        },
                        {
                            "type": "TextBlock",
                            "text": "(-) 0.00 \t"
                        }
                    ],
                    "width": "auto"
                },
                {
                    "type": "Column",
                    "width": "auto"
                }
            ]
        },
        {
            "type": "Container",
            "style": "emphasis",
            "items": [
                {
                    "type": "ColumnSet",
                    "columns": [
                        {
                            "type": "Column",
                            "items": [
                                {
                                    "type": "TextBlock",
                                    "horizontalAlignment": "Right",
                                    "text": "Amount to be Reimbursed",
                                    "wrap": true
                                }
                            ],
                            "width": "stretch"
                        },
                        {
                            "type": "Column",
                            "items": [
                                {
                                    "type": "TextBlock",
                                    "weight": "Bolder",
                                    "text": "$ 404.30"
                                }
                            ],
                            "width": "auto"
                        },
                        {
                            "type": "Column",
                            "width": "auto"
                        }
                    ]
                }
            ],
            "bleed": true
        },
        {
            "type": "Container",
            "items": [
                {
                    "type": "ColumnSet",
                    "columns": [
                        {
                            "type": "Column",
                            "id": "chevronDown4",
                            "selectAction": {
                                "type": "Action.ToggleVisibility",
                                "title": "show history",
                                "targetElements": [
                                    "cardContent4",
                                    "chevronUp4",
                                    "chevronDown4"
                                ]
                            },
                            "verticalContentAlignment": "Center",
                            "items": [
                                {
                                    "type": "TextBlock",
                                    "horizontalAlignment": "Right",
                                    "color": "Accent",
                                    "text": "Show history",
                                    "wrap": true
                                }
                            ],
                            "width": 1
                        },
                        {
                            "type": "Column",
                            "id": "chevronUp4",
                            "isVisible": false,
                            "selectAction": {
                                "type": "Action.ToggleVisibility",
                                "title": "hide history",
                                "targetElements": [
                                    "cardContent4",
                                    "chevronUp4",
                                    "chevronDown4"
                                ]
                            },
                            "verticalContentAlignment": "Center",
                            "items": [
                                {
                                    "type": "TextBlock",
                                    "horizontalAlignment": "Right",
                                    "color": "Accent",
                                    "text": "Hide history",
                                    "wrap": true
                                }
                            ],
                            "width": 1
                        }
                    ]
                }
            ]
        },
        {
            "type": "Container",
            "id": "cardContent4",
            "isVisible": false,
            "items": [
                {
                    "type": "Container",
                    "items": [
                        {
                            "type": "TextBlock",
                            "text": "* Expense submitted by **Matt** on Wed, Apr 14th, 2019",
                            "isSubtle": true,
                            "wrap": true
                        },
                        {
                            "type": "TextBlock",
                            "text": "* Expense approved by **Thomas** on Thu, Apr 15th, 2019",
                            "isSubtle": true,
                            "wrap": true
                        }
                    ]
                }
            ]
        },
        {
            "type": "Container",
            "items": [
                {
                    "type": "ActionSet",
                    "actions": [
                        {
                            "type": "Action.Submit",
                            "title": "Approve",
                            "style": "positive",
                            "data": {
                                "id": "_qkQW8dJlUeLVi7ZMEzYVw",
                                "action": "approve"
                            }
                        },
                        {
                            "type": "Action.ShowCard",
                            "title": "Reject",
                            "style": "destructive",
                            "card": {
                                "type": "AdaptiveCard",
                                "body": [
                                    {
                                        "type": "Input.Text",
                                        "id": "RejectCommentID",
                                        "placeholder": "Please specify an appropriate reason for rejection.",
                                        "isMultiline": true
                                    }
                                ],
                                "actions": [
                                    {
                                        "type": "Action.Submit",
                                        "title": "Send",
                                        "data": {
                                            "id": "_qkQW8dJlUeLVi7ZMEzYVw",
                                            "action": "reject"
                                        }
                                    }
                                ]
                            }
                        }
                    ]
                }
            ]
        }
    ],
    "$schema": "http://adaptivecards.io/schemas/adaptive-card.json",
    "version": "1.0"
}
{ "type": "AdaptiveCard", "body": [ { "type": "Container", "style": "emphasis", "items": [ { "type": "ColumnSet", "columns": [ { "type": "Column", "items": [ { "type": "TextBlock", "size": "Large", "weight": "Bolder", "text": "**EXPENSE APPROVAL**" } ], "width": "stretch" }, { "type": "Column", "items": [ { "type": "Image", "url": "https://adaptivecards.io/content/pending.png", "height": "30px", "altText": "Pending" } ], "width": "auto" } ] } ], "bleed": true }, { "type": "Container", "items": [ { "type": "ColumnSet", "columns": [ { "type": "Column", "items": [ { "type": "TextBlock", "size": "ExtraLarge", "text": "Trip to UAE", "wrap": true }, { "type": "TextBlock", "spacing": "Small", "size": "Small", "weight": "Bolder", "color": "Accent", "text": "[ER-13052](https://adaptivecards.io)" } ], "width": "stretch" }, { "type": "Column", "items": [ { "type": "ActionSet", "actions": [ { "type": "Action.OpenUrl", "title": "EXPORT AS PDF", "url": "https://adaptivecards.io" } ] } ], "width": "auto" } ] }, { "type": "FactSet", "spacing": "Large", "facts": [ { "title": "Submitted By", "value": "**Matt Hidinger** matt@contoso.com" }, { "title": "Duration", "value": "2019/06/19 - 2019/06/25" }, { "title": "Submitted On", "value": "2019/04/14" }, { "title": "Reimbursable Amount", "value": "$ 404.30" }, { "title": "Awaiting approval from", "value": "**Thomas** thomas@contoso.com" }, { "title": "Submitted to", "value": "**David** david@contoso.com" } ] } ] }, { "type": "Container", "spacing": "Large", "style": "emphasis", "items": [ { "type": "ColumnSet", "columns": [ { "type": "Column", "items": [ { "type": "TextBlock", "weight": "Bolder", "text": "DATE" } ], "width": "auto" }, { "type": "Column", "spacing": "Large", "items": [ { "type": "TextBlock", "weight": "Bolder", "text": "CATEGORY" } ], "width": "stretch" }, { "type": "Column", "items": [ { "type": "TextBlock", "weight": "Bolder", "text": "AMOUNT" } ], "width": "auto" } ] } ], "bleed": true }, { "type": "ColumnSet", "columns": [ { "type": "Column", "items": [ { "type": "TextBlock", "text": "06/19", "wrap": true } ], "width": "auto" }, { "type": "Column", "spacing": "Medium", "items": [ { "type": "TextBlock", "text": "Air Travel Expense", "wrap": true } ], "width": "stretch" }, { "type": "Column", "items": [ { "type": "TextBlock", "text": "$ 300", "wrap": true } ], "width": "auto" }, { "type": "Column", "id": "chevronDown1", "spacing": "Small", "verticalContentAlignment": "Center", "items": [ { "type": "Image", "selectAction": { "type": "Action.ToggleVisibility", "title": "collapse", "targetElements": [ "cardContent1", "chevronUp1", "chevronDown1" ] }, "url": "https://adaptivecards.io/content/down.png", "width": "20px", "altText": "collapsed" } ], "width": "auto" }, { "type": "Column", "id": "chevronUp1", "isVisible": false, "spacing": "Small", "verticalContentAlignment": "Center", "items": [ { "type": "Image", "selectAction": { "type": "Action.ToggleVisibility", "title": "expand", "targetElements": [ "cardContent1", "chevronUp1", "chevronDown1" ] }, "url": "https://adaptivecards.io/content/up.png", "width": "20px", "altText": "expanded" } ], "width": "auto" } ] }, { "type": "Container", "id": "cardContent1", "isVisible": false, "items": [ { "type": "Container", "items": [ { "type": "TextBlock", "text": "* Leg 1 on Tue, Jun 19th, 2019 at 6:00 AM.", "isSubtle": true, "wrap": true }, { "type": "TextBlock", "text": "* Leg 2 on Tue,Jun 19th, 2019 at 7:15 PM.", "isSubtle": true, "wrap": true }, { "type": "Container", "items": [ { "type": "Input.Text", "id": "comment1", "placeholder": "Add your comment here." } ] } ] }, { "type": "Container", "items": [ { "type": "ColumnSet", "columns": [ { "type": "Column", "items": [ { "type": "ActionSet", "actions": [ { "type": "Action.Submit", "title": "Send", "data": { "id": "_qkQW8dJlUeLVi7ZMEzYVw", "action": "comment", "lineItem": 1 } } ] } ], "width": "auto" } ] } ] } ] }, { "type": "ColumnSet", "columns": [ { "type": "Column", "items": [ { "type": "TextBlock", "horizontalAlignment": "Center", "text": "06/19", "wrap": true } ], "width": "auto" }, { "type": "Column", "spacing": "Medium", "items": [ { "type": "TextBlock", "text": "Auto Mobile Expense", "wrap": true } ], "width": "stretch" }, { "type": "Column", "items": [ { "type": "TextBlock", "text": "$ 100", "wrap": true } ], "width": "auto" }, { "type": "Column", "id": "chevronDown2", "spacing": "Small", "verticalContentAlignment": "Center", "items": [ { "type": "Image", "selectAction": { "type": "Action.ToggleVisibility", "title": "collapse", "targetElements": [ "cardContent2", "chevronUp2", "chevronDown2" ] }, "url": "https://adaptivecards.io/content/down.png", "width": "20px", "altText": "collapsed" } ], "width": "auto" }, { "type": "Column", "id": "chevronUp2", "isVisible": false, "spacing": "Small", "verticalContentAlignment": "Center", "items": [ { "type": "Image", "selectAction": { "type": "Action.ToggleVisibility", "title": "expand", "targetElements": [ "cardContent2", "chevronUp2", "chevronDown2" ] }, "url": "https://adaptivecards.io/content/up.png", "width": "20px", "altText": "expanded" } ], "width": "auto" } ] }, { "type": "Container", "id": "cardContent2", "isVisible": false, "items": [ { "type": "Container", "items": [ { "type": "TextBlock", "text": "* Contoso Car Rentrals, Tues 6/19 at 7:00 AM", "isSubtle": true, "wrap": true }, { "type": "Container", "items": [ { "type": "Input.Text", "id": "comment2", "placeholder": "Add your comment here." } ] } ] }, { "type": "Container", "items": [ { "type": "ColumnSet", "columns": [ { "type": "Column", "items": [ { "type": "ActionSet", "actions": [ { "type": "Action.Submit", "title": "Send", "data": { "id": "_qkQW8dJlUeLVi7ZMEzYVw", "action": "comment", "lineItem": 2 } } ] } ], "width": "auto" } ] } ] } ] }, { "type": "ColumnSet", "columns": [ { "type": "Column", "items": [ { "type": "TextBlock", "horizontalAlignment": "Center", "text": "06/25", "wrap": true } ], "width": "auto" }, { "type": "Column", "spacing": "Medium", "items": [ { "type": "TextBlock", "text": "Air Travel Expense", "wrap": true } ], "width": "stretch" }, { "type": "Column", "items": [ { "type": "TextBlock", "text": "$ 4.30", "wrap": true } ], "width": "auto" }, { "type": "Column", "id": "chevronDown3", "spacing": "Small", "verticalContentAlignment": "Center", "items": [ { "type": "Image", "selectAction": { "type": "Action.ToggleVisibility", "title": "collapse", "targetElements": [ "cardContent3", "chevronUp3", "chevronDown3" ] }, "url": "https://adaptivecards.io/content/down.png", "width": "20px", "altText": "collapsed" } ], "width": "auto" }, { "type": "Column", "id": "chevronUp3", "isVisible": false, "spacing": "Small", "verticalContentAlignment": "Center", "items": [ { "type": "Image", "selectAction": { "type": "Action.ToggleVisibility", "title": "expand", "targetElements": [ "cardContent3", "chevronUp3", "chevronDown3" ] }, "url": "https://adaptivecards.io/content/up.png", "width": "20px", "altText": "expanded" } ], "width": "auto" } ] }, { "type": "Container", "id": "cardContent3", "isVisible": false, "items": [ { "type": "Container", "items": [ { "type": "Input.Text", "id": "comment3", "placeholder": "Add your comment here." } ] }, { "type": "Container", "items": [ { "type": "ColumnSet", "columns": [ { "type": "Column", "items": [ { "type": "ActionSet", "actions": [ { "type": "Action.Submit", "title": "Send", "data": { "id": "_qkQW8dJlUeLVi7ZMEzYVw", "action": "comment", "lineItem": 3 } } ] } ], "width": "auto" } ] } ] } ] }, { "type": "ColumnSet", "spacing": "Large", "separator": true, "columns": [ { "type": "Column", "items": [ { "type": "TextBlock", "horizontalAlignment": "Right", "text": "Total Expense Amount \t", "wrap": true }, { "type": "TextBlock", "horizontalAlignment": "Right", "text": "Non-reimbursable Amount", "wrap": true }, { "type": "TextBlock", "horizontalAlignment": "Right", "text": "Advance Amount", "wrap": true } ], "width": "stretch" }, { "type": "Column", "items": [ { "type": "TextBlock", "text": "404.30" }, { "type": "TextBlock", "text": "(-) 0.00 \t" }, { "type": "TextBlock", "text": "(-) 0.00 \t" } ], "width": "auto" }, { "type": "Column", "width": "auto" } ] }, { "type": "Container", "style": "emphasis", "items": [ { "type": "ColumnSet", "columns": [ { "type": "Column", "items": [ { "type": "TextBlock", "horizontalAlignment": "Right", "text": "Amount to be Reimbursed", "wrap": true } ], "width": "stretch" }, { "type": "Column", "items": [ { "type": "TextBlock", "weight": "Bolder", "text": "$ 404.30" } ], "width": "auto" }, { "type": "Column", "width": "auto" } ] } ], "bleed": true }, { "type": "Container", "items": [ { "type": "ColumnSet", "columns": [ { "type": "Column", "id": "chevronDown4", "selectAction": { "type": "Action.ToggleVisibility", "title": "show history", "targetElements": [ "cardContent4", "chevronUp4", "chevronDown4" ] }, "verticalContentAlignment": "Center", "items": [ { "type": "TextBlock", "horizontalAlignment": "Right", "color": "Accent", "text": "Show history", "wrap": true } ], "width": 1 }, { "type": "Column", "id": "chevronUp4", "isVisible": false, "selectAction": { "type": "Action.ToggleVisibility", "title": "hide history", "targetElements": [ "cardContent4", "chevronUp4", "chevronDown4" ] }, "verticalContentAlignment": "Center", "items": [ { "type": "TextBlock", "horizontalAlignment": "Right", "color": "Accent", "text": "Hide history", "wrap": true } ], "width": 1 } ] } ] }, { "type": "Container", "id": "cardContent4", "isVisible": false, "items": [ { "type": "Container", "items": [ { "type": "TextBlock", "text": "* Expense submitted by **Matt** on Wed, Apr 14th, 2019", "isSubtle": true, "wrap": true }, { "type": "TextBlock", "text": "* Expense approved by **Thomas** on Thu, Apr 15th, 2019", "isSubtle": true, "wrap": true } ] } ] }, { "type": "Container", "items": [ { "type": "ActionSet", "actions": [ { "type": "Action.Submit", "title": "Approve", "style": "positive", "data": { "id": "_qkQW8dJlUeLVi7ZMEzYVw", "action": "approve" } }, { "type": "Action.ShowCard", "title": "Reject", "style": "destructive", "card": { "type": "AdaptiveCard", "body": [ { "type": "Input.Text", "id": "RejectCommentID", "placeholder": "Please specify an appropriate reason for rejection.", "isMultiline": true } ], "actions": [ { "type": "Action.Submit", "title": "Send", "data": { "id": "_qkQW8dJlUeLVi7ZMEzYVw", "action": "reject" } } ] } } ] } ] } ], "$schema": "http://adaptivecards.io/schemas/adaptive-card.json", "version": "1.0" }
Try it Yourself »