Skip to content
Merged
Show file tree
Hide file tree
Changes from 1 commit
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
Prev Previous commit
Next Next commit
Updates to icon size (#88)
* Updated Context and theme information

Clarified what information can be used in a Tabs URL, returned by the microsoftTeams.getContext() object, and clarified the wording for theme change handling.

* Icon spec change (#85)

* Updated icon sizes (#87)
  • Loading branch information
NormSohl authored Feb 13, 2018
commit 2686a3e0bdb5a8c0d8a02990196f0795743dff5a
6 changes: 3 additions & 3 deletions msteams-platform/concepts/apps/apps-package.md
Original file line number Diff line number Diff line change
Expand Up @@ -31,17 +31,17 @@ Microsoft Teams requires two icons for your app experience, to be used within th

### color

The `color` icon is used throughout Microsoft Teams (in app and tab galleries, bots, flyouts, and so on). This icon should be 96×96 pixels. Your icon can be any color (or colors), but the background should be your branded accent color. It should also have a small amount of padding surrounding the icon to accommodate the hexagonal cropping for the bot version of the icon.
The `color` icon is used throughout Microsoft Teams (in app and tab galleries, bots, flyouts, and so on). This icon should be 192×192 pixels. Your icon can be any color (or colors), but the background should be your branded accent color. It should also have a small amount of padding surrounding the icon to accommodate the hexagonal cropping for the bot version of the icon.

### outline

The `outline` icon is used in these places: the app bar and messaging extensions the user has marked as a "favorite." This icon must be 20×20 pixels. Your outline icon must contain only white and transparency (no other colors). The icon can be white with transparent background or transparent with a white background. The outline icon should not have extra padding surrounding the icon and should be as tightly cropped as possible while still maintaining the 20x20 dimensions. Here are a few good examples:
The `outline` icon is used in these places: the app bar and messaging extensions the user has marked as a "favorite." This icon must be 32×32 pixels. Your outline icon must contain only white and transparency (no other colors). The icon can be white with transparent background or transparent with a white background. The outline icon should not have extra padding surrounding the icon and should be as tightly cropped as possible while still maintaining the 32x32 dimensions. Here are a few good examples:

![Sample outline icons](~/assets/images/icons/sample20x20s.png)

For example, say your company is Contoso. You'd submit two icons:

![Sample Contoso icons](~/assets/images/icons/contosoicons.png)
![Icon showcase](~/assets/images/framework/framework_submit_icon.png)

Here's how the icons would appear in the UI:

Expand Down
6 changes: 2 additions & 4 deletions msteams-platform/get-started/get-started-nodejs.md
Original file line number Diff line number Diff line change
Expand Up @@ -155,11 +155,9 @@ The app will only be available during the current session on your development ma

### Host in Azure

Microsoft Azure lets you host your Node.js web application on a free tier using shared infrastructure. This will be sufficient to run this Hello-world sample. See [creating a new free account](https://azure.microsoft.com/en-us/free/) for more information.
Microsoft Azure lets you host your Node.js web application on a free tier using shared infrastructure. This will be sufficient to run this Hello-world sample. See [creating a new free account](https://azure.microsoft.com/en-us/free/) for more information. For more information on Azure see the [Azure developer guide](https://docs.microsoft.com/en-us/azure/guides/developer/azure-developer-guide).

For more information on Azure see the [Azure developer guide](https://docs.microsoft.com/en-us/azure/guides/developer/azure-developer-guide).

You can host your app using the Azure Cloud Shell found on the [Microsoft Azure Dashboard](https://ms.portal.azure.com).
You can quickly host your app using the Azure Cloud Shell found on the [Microsoft Azure Dashboard](https://ms.portal.azure.com).

<img width="300px" title="Azure Cloud Shell" src="~/assets/images/get-started/azure-cloud-shell.png"/>

Expand Down
4 changes: 2 additions & 2 deletions msteams-platform/publishing/office-store-checklist.md
Original file line number Diff line number Diff line change
Expand Up @@ -12,8 +12,8 @@ The follow metadata is required in your manifest.json file and for Seller Dashbo
|Data|Type|Size|Manifest|Seller Dashboard|Description|
|---|---|---|---|---|---|
|App package|.zip|||✔|The actual app package for uploading or AppSource submission.|
|App logo|.png|96&times;96 pixels|`icon.color`|✔|The icon to display in the product page listing in AppSource or Teams gallery. This is your full-color product icon.|
|App logo outline|.png|20&times;20 pixels|`icon.outline`||The icon to display in Teams, in the Teams chat channel and other locations. This is your logo rendered as a white outline with transparent background.|
|App logo|.png|192&times;192 pixels|`icon.color`|✔|The icon to display in the product page listing in AppSource or Teams gallery. This is your full-color product icon.|
|App logo outline|.png|32&times;32 pixels|`icon.outline`||The icon to display in Teams, in the Teams chat channel and other locations. This is your logo rendered as a white outline with transparent background.|
|Support link|URL|||✔|A link to support material for end users. Can be HTTP or HTTPS.|
|Privacy link|URL||`developer.privacyUrl`|✔|A link to your privacy policy (HTTPS).|
|Video link|URL|||Optional|A link to a video about your app.|
Expand Down
2 changes: 1 addition & 1 deletion msteams-platform/publishing/office-store-guidance.md
Original file line number Diff line number Diff line change
Expand Up @@ -34,7 +34,7 @@ In the Seller Dashboard:
* **Testing notes** – Please ensure you provide enough information for our validation team to successfully load and test your experience. This includes providing sign-in instructions and test accounts, as well as any other notes that might assist in the review of your product.
* **My app calls, support, contains, or uses cryptography or encryption** – This checkbox helps to ensure that your product is not using cryptography in a way that would prohibit distribution through the Office Store. See [Export restrictions on cryptography](https://docs.microsoft.com/en-us/windows/uwp/security/export-restrictions-on-cryptography) for a detailed explanation.
* **My app calls, support, contains, or uses cryptography or encryption** – This checkbox helps to ensure taht your product is not using cryptography in a way that would prohibit distribution through AppSource. See [Export restrictions on cryptography](https://docs.microsoft.com/en-us/windows/uwp/security/export-restrictions-on-cryptography) for a detailed explanation.
* **App logo** – Use your full-color 96&times;96 icon.
* **App logo** – Use your full-color 192&times;192 icon.
* **Support document link** – The URL for support content for your app.
* **Privacy document link** – Use the URL that appears in `privacyUrl` in your manifest.
* **Video link** – Optional; the URL of a video of your app. This video appears on your product listing page in AppSource.
Expand Down