| Service | Microsoft Docs article | Related commit history on GitHub | Change details |
|---|---|---|---|
| platform | Design Teams App Layout Scaling | https://github.com/MicrosoftDocs/msteams-docs/commits/main/msteams-platform/concepts/design/design-teams-app-layout-scaling.md | Scaling and responsive design are essential to all Teams apps so that users can ## Layout design -The 4-pixel base unit of grid allows components to scale consistently across all display size in Teams. In the following example, the corner radius of each button is 4 pixels. +The 4-pixel base unit of grid allows components to scale consistently across all display sizes in Teams. In the following example, the corner radius of each button is 4 pixels. :::image type="content" source="../../assets/images/design-guidelines/layout-pixel.png" alt-text="Example shows an example of pixels in layout." lightbox="../../assets/images/design-guidelines/layout-pixel.png"::: The minimum size for desktop is 550 pixels. :::image type="content" source="../../assets/images/design-guidelines/responsive-desktop.png" alt-text="Example shows a responsive layout on desktop."::: +## Page orientation ++### Mobile ++> [!NOTE] +> Apps in Teams mobile support both landscape and portrait mode. ++#### Portrait mode +++#### Landscape mode ++ ## Best practices :::row::: Avoid truncation with reflow, prioritizing call to actions (CTAs), and action it :::column-end::: :::column span=""::: #### DonΓÇÖt: Let text or CTAs get cut off or become illegible as window width changes -Without word wrapping, the text and CTAs are not usable. +Without word wrapping, the text and CTAs aren't usable. :::column-end::: :::row-end::: Use responsive design to avoid text overlap and truncation. #### DonΓÇÖt: Truncate and cut off content at any zoom level -It is recommended to test up to 200% zoom. +It's recommended to test up to 200% zoom. :::column-end::: :::row-end::: It is recommended to test up to 200% zoom. #### Do: Text and colors for accessibility -The entire text must be visible and used for all users, meaning that it must exceed certain color ratios, depending on its usage. To check your contrast levels check out the WebAIM contrast checker. +The entire text must be visible and used for all users, meaning that it must exceed certain color ratios, depending on its usage. To check your contrast levels, check out the WebAIM contrast checker. :::column-end::: :::column span=""::: The entire text must be visible and used for all users, meaning that it must exc #### DonΓÇÖt: Submit your app with text that doesnΓÇÖt pass contrast standards -Teams apps need to be accessible to all users with any level of visual impairment or disability. Submissions with inaccessible text is not accepted. +Teams apps need to be accessible to all users with any level of visual impairment or disability. Submissions with inaccessible text aren't accepted. :::column-end::: :::row-end::: Avoid text overlap and truncation. :::column-end::: :::column span=""::: ##### DonΓÇÖt: Submit your app for review without testing at Teams default resolution If the headers truncate, use a tooltip so that users can read headers by hoverin ##### DonΓÇÖt: Truncate headers without a hover feature -Your app won't pass Teams submission if it has illegible headers without a hover functionality. +Your app won't pass Teams submission if it has illegible headers without hover functionality. :::column-end::: :::row-end:::++## Page orientation FAQs ++<details> +<summary>Do I need to make any changes in the app to get the landscape mode?</summary> ++No. You can use apps in landscape mode by default. +<br> + +</details> +<details> +<summary>What if my app doesn't support one of the modes, or if the scenario is only intended to work in one of the modes?</summary> ++Teams supports both modes by default. The apps in Teams aren't supported to work in one mode only. If your app demands this requirement, reach out to the [support team](../../feedback.md). +<br> + +</details> +<details> +<summary>How can I fix the scroll missing in the app empty state?</summary> ++Add `<FlexColumn scroll></FlexColumn>` to the empty state for the app. +<br> + +</details> +<details> +<summary>How can I test my app compatibility in both landscape and portrait modes?</summary> ++To test your app's compatibility in both modes, run the app on Teams mobile in different device orientations. Ensure that all elements, including buttons, text, and images are correctly aligned and displayed without any UI distortions or cut-offs. +<br> + +</details> +<details> +<summary>Are there any best practices for designing apps that work well in both landscape and portrait modes?</summary> +Yes, when designing apps for Teams, it's essential to follow responsive design principles to ensure optimal performance and user experience in both landscape and portrait modes. Use flexible layouts and adaptive components to accommodate different screen sizes and orientations. +<br> + +</details> +<details> ++<summary>Does landscape mode support both Android and iOS Teams apps?</summary> ++Yes, the landscape mode is supported on both Android and iOS Teams apps, providing consistent experience for users across both platforms. +<br> + +</details> +<details> +<summary>Can I customize the app's behavior differently for landscape and portrait modes?</summary> ++The behavior of the app remains consistent across both modes. However, if you have specific use cases or requirements that require different behaviors in each mode, reach out to the [support team](../../feedback.md) with your feedback and suggestions. +<br> + +</details> +<details> +<summary>Is there any impact on the performance of apps in landscape mode?</summary> ++No, the landscape mode support in Teams doesn't have any negative effect on app performance. Teams ensures a smooth and seamless experience for users, regardless of the device orientation. +<br> + +</details> |
| platform | Extend M365 Teams Message Extension | https://github.com/MicrosoftDocs/msteams-docs/commits/main/msteams-platform/m365-apps/extend-m365-teams-message-extension.md | -> If you've connected your message extension bot to an **Outlook** channel, you must to migrate to the **Microsoft 365** channel. +> If you've connected your message extension bot to an **Outlook** channel, you must migrate to the **Microsoft 365** channel. Search-based [message extensions](/microsoftteams/platform/messaging-extensions/what-are-messaging-extensions) allow users to search an external system and share results through the compose message area of the Microsoft Teams client. You can now bring production search-based Teams message extensions to preview audiences in Outlook for Windows desktop and outlook.com by [extending your Teams apps across Microsoft 365](overview.md). |
| platform | Teams Faq | https://github.com/MicrosoftDocs/msteams-docs/commits/main/msteams-platform/teams-faq.md | For more information, see [Graph explorer](https://developer.microsoft.com/graph </details> -## Moodle FAQs +## Moodle -<br> <details> <summary>What should I do if one or more of the course teams weren't created after synchronization?</summary> It's recommended that you save conversation references to database and use the s </details> +## Page orientation ++> [!NOTE] +> The FAQs are applicable for Teams mobile only. ++<br> ++<details> +<summary>Do I need to make any changes in the app to get the landscape mode?</summary> ++No. You can use apps in landscape mode by default. +<br> + +</details> +<details> +<summary>What if my app doesn't support one of the modes, or if the scenario is only intended to work in one of the modes?</summary> ++Teams supports both modes by default. The apps in Teams aren't supported to work in one mode only. If your app demands this requirement, reach out to the [support team](feedback.md). +<br> + +</details> +<details> +<summary>How can I fix the scroll missing in the app empty state?</summary> ++Add `<FlexColumn scroll></FlexColumn>` to the empty state for the app. +<br> + +</details> +<details> +<summary>How can I test my app compatibility in both landscape and portrait modes?</summary> ++To test your app's compatibility in both modes, run the app on Teams mobile in different device orientations. Ensure that all elements, including buttons, text, and images are correctly aligned and displayed without any UI distortions or cut-offs. +<br> + +</details> +<details> +<summary>Are there any best practices for designing apps that work well in both landscape and portrait modes?</summary> +Yes, when designing apps for Teams, it's essential to follow responsive design principles to ensure optimal performance and user experience in both landscape and portrait modes. Use flexible layouts and adaptive components to accommodate different screen sizes and orientations. +<br> + +</details> +<details> ++<summary>Does landscape mode support both Android and iOS Teams apps?</summary> ++Yes, the landscape mode is supported on both Android and iOS Teams apps, providing consistent experience for users across both platforms. +<br> + +</details> +<details> +<summary>Can I customize the app's behavior differently for landscape and portrait modes?</summary> ++The behavior of the app remains consistent across both modes. However, if you have specific use cases or requirements that require different behaviors in each mode, reach out to the [support team](feedback.md) with your feedback and suggestions. +<br> + +</details> +<details> +<summary>Is there any impact on the performance of apps in landscape mode?</summary> ++No, the landscape mode support in Teams doesn't have any negative effect on app performance. Teams ensures a smooth and seamless experience for users, regardless of the device orientation. +<br> + +</details> + ## Partner Center <details> After the verification process is complete, the status of your enrollment on the <details> <summary>My account verification status hasn't advanced beyond Email Ownership. How should I proceed?</summary> -During the **Email Ownership** verification process, a verification email is sent to the primary contact. Check your primary contact inbox for an email from **maccount@microsoft.com** with the subject line **Action needed: Verify your email account with Microsoft** and complete the email verification process. The verification email is sent to the address listed on your Partner Center account settings. +During the **Email Ownership** verification process, a verification email is sent to the primary contact. Check your primary contact inbox for an email from **<maccount@microsoft.com>** with the subject line **Action needed: Verify your email account with Microsoft** and complete the email verification process. The verification email is sent to the address listed on your Partner Center account settings. Remember the following points about the email verification process: Try the following steps: * Clear the browser cache, go to your Partner Center account dashboard, and select **Resend verification email**. * Try accessing the **Resend verification email** link from a different browser. * Work with your IT department to ensure that the verification emails are not blocked by your email server.-* Adjust your server's spam filter to allow or safe-list all emails from **maccount@microsoft.com**. +* Adjust your server's spam filter to allow or safe-list all emails from **<maccount@microsoft.com>**. <br> For more information about Node js code sample, see [Bot SSO quick-start](https: <details> <summary>How can I use deeplink to get the subEntityId or subPageId on mobile client while navigating from one tab to another tab?</summary> -<br> Upgrade the Teams JavaScript client SDK to (@microsoft/teams-js": "^2.0.0") to resolve the issue. <br>+ </details>-<br> -<details> +<details> <summary>Which tab gets pinned if both configurable tab and static tab are defined in the app manifest for a specific scope?</summary> -<br> If you have both configurable tab and static tab defined in your app manifest for a specific scope, Teams pins the static tab by default.-</details> <br>+ +</details> <details> <summary>What if I already have pre-existing pinned configurable tabs after switching to static tabs?</summary> -<br> -Pre-existing pinned configurable tab instances of your app continue to work the same. You don't have the option to pin new instances of these configurable tabs. When you select to pin your tab, then Teams pins the static tab of your app. +Pre-existing pinned configurable tab instances of your app continue to work the same. You don't have the option to pin new instances of these configurable tabs. When you select to pin your tab, then Teams pins the static tab of your app. <br> </details>--+</details> ## Teams toolkit |
| platform | Whats New | https://github.com/MicrosoftDocs/msteams-docs/commits/main/msteams-platform/whats-new.md | Discover Microsoft Teams platform features that are generally available (GA). Yo | 25/05/2023 | Use a deep link to open a tab app in meeting side panel in Teams mobile client. | Build apps for Teams meetings and calls > Enable and configure apps for Teams meeting > [Build tabs for meeting](apps-in-teams-meetings/build-tabs-for-meeting.md#deep-link-to-meeting-side-panel) | |23/05/2023 | Live Share SDK is now generally available. Use Live Share to transform Teams apps into collaborative multi-user experiences without writing any dedicated back-end code. | Build apps for Teams meetings and calls > Enhanced collaboration with Live Share > [Live Share SDK](apps-in-teams-meetings/teams-live-share-overview.md)| |23/05/2023 | Use Teams app design guidelines to help you make quick and right decisions to design your app. | Design your app > [Overview](concepts/design/design-teams-app-overview.md)|-Cater your app to a specific audience from the available list of countries or regions. | Distribute your app > Publish to the Teams store > Prepare your Teams store submission > [Distribute your app to specific countries or regions](concepts/deploy-and-publish/appsource/prepare/submission-checklist.md#distribute-your-app-to-specific-countries-or-regions)| +|21/05/2023 |Cater your app to a specific audience from the available list of countries or regions. | Distribute your app > Publish to the Teams store > Prepare your Teams store submission > [Distribute your app to specific countries or regions](concepts/deploy-and-publish/appsource/prepare/submission-checklist.md#distribute-your-app-to-specific-countries-or-regions)| | 17/05/2023 | Use the Teams Toolkit v5 extension with many new app development features to get started with app development for Teams using Visual Studio Code. | Tools and SDKs > Teams Toolkit > [Teams Toolkit Overview](toolkit/teams-toolkit-fundamentals.md)| | 17/05/2023 | Updated Get started module with GitHub Codespaces and step-by-step guides aligned with Teams Toolkit v5. It also includes details for extending Teams app over Microsoft 365 and Outlook. | [Get started](get-started/get-started-overview.md)| |