Microsoft Teams React App prevent style overwriting from SharePoint Online

0
votes

I have developed a Microsoft Teams App with some Fluent UI React components. The app is deployed on the SharePoint App catalog and added with the app manifest to MS Teams. In MS Teams I want to use the default styles of the client.

The issue is that the App is using the SharePoint Online custom design of the Tenant. How can I prevent this behavior?

Cheers and Thanks

1
reactjssharepointmicrosoft-teamsfluentui-react

1 Answers

1
votes

I assume you used the SharePoint Framework. You need to check the context in your app:

  if (this.context.sdks.microsoftTeams) {
    // We have Teams context

  }
  else
  {
    // We are in SharePoint context

  }

Once you know you are in Teams, you can grab and use the context theme context.sdks.microsoftTeams.context.theme