Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

Issue with text color of adaptive cards changing by teams theme

See original GitHub issue

Platform

What platform is your issue or question related to? (Delete other platforms).

JavaScript

Author or host

Are you an author (like sending something to Outlook), or a host that is rendering your own cards? Author If you’re an author, who are you sending cards to? Either DMs or group chats on MS teams

Version of SDK

1.0 What version are you using? Ex: NuGet 1.0.2, or latest master, etc… Issue happens both the current version of the botbuilder framework with CardFactory.adaptiveCard() and with the direct importing of the adaptivecards package and declaring the adaptive card as:

var companyCard = new AdaptiveCards.AdaptiveCard();
companyCard.parse(card);

Issue

When I set the text of an adaptive card to light (white) it will appear white on the default teams theme and the high contrast but will invert to black on the teams dark theme and therefore not be readable. The screen shots I posted are of the same card with and without a background image that I’m using as a background color for the cards (#001F3D) Screen Shot 2019-07-18 at 10 54 38 AM

As you can see the default and high contrast themes work as intended, but the dark theme inverts the white to black which is detrimental in this instance.

. The JSON is:

let card = CardFactory.adaptiveCard(
            {
                "type": "AdaptiveCard",
                "body": [
                    {
                        "type": "Container",
                        "items": [
                            {
                                "type": "TextBlock",
                                "size": "Medium",
                                "weight": "Bolder",
                                "text": "Feature not active",
                                "color": "Light"
                            }
                        ]
                    },
                    {
                        "type": "Container",
                        "items": [
                            {
                                "type": "TextBlock",
                                "text": "This version does not support imperatives.",
                                "wrap": true,
                                "color": "Light"
                            }
                        ]
                    },
                    {
                        "type": "Image",
                        "url": "https://raw.githubusercontent.com/link-works-but-has-repo-names-I-cant-share",
                        "size": "Small",
                        "horizontalAlignment": "Right",
                        "spacing": "None"
                    }
                ],
                "$schema": "http://adaptivecards.io/schemas/adaptive-card.json",
                "version": "1.0",
                "backgroundImage": "https://raw.githubusercontent.com/link-works-but-has-repo-names-I-cant-share"
            }
        );