From 0adb4604666e4e40c2361df0b00c652c92e73051 Mon Sep 17 00:00:00 2001 From: Jan Bobisud Date: Sun, 4 Aug 2019 11:23:22 +0200 Subject: [PATCH] Polish documentation --- .../docs/advanced/generating-icons.md | 10 +-- .../app/templates/docs/advanced/using-cors.md | 2 +- .../docs/getting-started/overview.md | 4 +- .../docs/manifest/available-properties.md | 62 +++++++++---------- 4 files changed, 39 insertions(+), 39 deletions(-) diff --git a/tests/dummy/app/templates/docs/advanced/generating-icons.md b/tests/dummy/app/templates/docs/advanced/generating-icons.md index 6efa58dd..4237ff4a 100644 --- a/tests/dummy/app/templates/docs/advanced/generating-icons.md +++ b/tests/dummy/app/templates/docs/advanced/generating-icons.md @@ -1,12 +1,13 @@ # Generating Icons -`ember-web-app` doesn't generate icons. If you want to automate the generation of icons starting from a master image, you can install [ember-cli-image-transformer](https://github.com/jrjohnson/ember-cli-image-transformer). +Web App doesn't generate icons. If you want to automate the generation of icons starting from a master image, you can install [ember-cli-image-transformer](https://github.com/jrjohnson/ember-cli-image-transformer). -If your `config/manifest.js` looks like this and needs a `192px` and a `512px` icon: +If your `config/manifest.js` looks like this and needs a `192px` and a `512px` icons: ```javascript 'use strict'; -export default function() { + +module.exports = function() { return { icons: [ { @@ -20,13 +21,14 @@ export default function() { })), ], }; -} +}; ``` You can start with a base `brand-icon.svg` image and automatically build the `192x192` and `512x512` versions by installing `ember-cli-image-transformer` and adding the necessary configuration to your `ember-cli-build.js` file: ```javascript 'use strict'; + module.exports = function(defaults) { let options = { 'ember-cli-image-transformer': { diff --git a/tests/dummy/app/templates/docs/advanced/using-cors.md b/tests/dummy/app/templates/docs/advanced/using-cors.md index 587d2030..8b63e5c0 100644 --- a/tests/dummy/app/templates/docs/advanced/using-cors.md +++ b/tests/dummy/app/templates/docs/advanced/using-cors.md @@ -5,7 +5,7 @@ You can specify `crossorigin` behaviour for `manifest.webmanifest` by updating t ```html ``` diff --git a/tests/dummy/app/templates/docs/getting-started/overview.md b/tests/dummy/app/templates/docs/getting-started/overview.md index e9f58bfc..019ac339 100644 --- a/tests/dummy/app/templates/docs/getting-started/overview.md +++ b/tests/dummy/app/templates/docs/getting-started/overview.md @@ -39,11 +39,13 @@ It also generates some compatibility `meta` tags for supporting non-standard ven ## Targets -Internally, Web App takes into account four different types of targets for generating the _Web App Manifest_ taking care of including some backward compatibility `meta` tags in order to support as many devices and browsers as possible. These targets are: +Internally, Web App takes into account several different types of targets for generating the _Web App Manifest_ taking care of including some backward compatibility `meta` tags in order to support as many devices and browsers as possible. These targets are: - `manifest` (default target) - `android` (to target Android devices) - `apple` (to target Apple devices) - `ms` (to target Win8/Win10 devices) +- `favicon` (to target browser favicons) +- `safari-pinned-tab` (to target Safari Pinned Tab) _Not all targets are used for all properties (actually, most properties are not affected by the targets)._ diff --git a/tests/dummy/app/templates/docs/manifest/available-properties.md b/tests/dummy/app/templates/docs/manifest/available-properties.md index c68977cd..79e91821 100644 --- a/tests/dummy/app/templates/docs/manifest/available-properties.md +++ b/tests/dummy/app/templates/docs/manifest/available-properties.md @@ -70,9 +70,9 @@ manifest.description = 'Lorem ipsum dolor'; Possible values: -- ltr (left-to-right) -- rtl (right-to-left) -- auto +- `ltr` (left-to-right) +- `rtl` (right-to-left) +- `auto` ```javascript manifest.dir = 'ltr'; @@ -91,10 +91,10 @@ manifest.dir = 'ltr'; Possible values: -- fullscreen -- standalone -- minimal-ui -- browser +- `fullscreen` +- `standalone` +- `minimal-ui` +- `browser` The default value for `display` is `browser` when is not defined. @@ -133,7 +133,7 @@ icons: [ { src: '/bar/baz.png', sizes: '280x280', - targets: ['apple'], // non-standard property + targets: ['apple'], // * }, { src: '/bar/fav.png', @@ -142,13 +142,13 @@ icons: [ }, { src: '/bar/ms.png', - element: 'square70x70logo', // non-standard property - targets: ['ms'], // non-standard-property + element: 'square70x70logo', // * + targets: ['ms'], // * }, { src: '/foo/monochrome.svg', - safariPinnedTabColor: '#cc6600', // non-standard property - targets: ['safari-pinned-tab'], // non-standard-property + safariPinnedTabColor: '#cc6600', // * + targets: ['safari-pinned-tab'], // * }, ]; ``` @@ -183,14 +183,14 @@ manifest.lang = 'es-UY'; Possible values: -- any -- natural -- landscape -- landscape-primary -- landscape-secondary -- portrait -- portrait-primary -- portrait-secondary +- `any` +- `natural` +- `landscape` +- `landscape-primary` +- `landscape-secondary` +- `portrait` +- `portrait-primary` +- `portrait-secondary` ```javascript manifest.orientation = 'portrait'; @@ -209,8 +209,8 @@ manifest.orientation = 'portrait'; Possible values: -- true -- false +- `true` +- `false` ```javascript manifest.prefer_related_applications = true; @@ -345,7 +345,7 @@ manifest = { > Sets the style of the status bar for a web application in iOS -See [Changing the Status Bar Appearance](https://developer.apple.com/library/content/documentation/AppleApplications/Reference/SafariWebContent/ConfiguringWebApplications/ConfiguringWebApplications.html#//apple_ref/doc/uid/TP40002051-CH3-SW1) +See [Changing the Status Bar Appearance](https://developer.apple.com/library/content/documentation/AppleApplications/Reference/SafariWebContent/ConfiguringWebApplications/ConfiguringWebApplications.html#//apple_ref/doc/uid/TP40002051-CH3-SW1). Possible values: @@ -353,7 +353,7 @@ Possible values: - `black` The status bar has a black background. - `black-translucent` The status bar is black and translucent. -Note that if set to default or black, the web content is displayed below the status bar. If set to black-translucent, the web content is displayed on the entire screen, partially obscured by the status bar. +Note that if set to `default` or `black`, the web content is displayed below the status bar. If set to `black-translucent`, the web content is displayed on the entire screen, partially obscured by the status bar. ```javascript manifest.apple = { @@ -372,7 +372,7 @@ manifest.apple = { > Adds `precomposed` suffix to Apple touch icons -See [Precomposed Keyword for Apple touch icons](https://mathiasbynens.be/notes/touch-icons#effects) +See [Precomposed Keyword for Apple touch icons](https://mathiasbynens.be/notes/touch-icons#effects). Possible values: @@ -396,7 +396,7 @@ manifest.apple = { > Adds `format-detection` meta tag if needed -See [Safari HTML Reference](https://developer.apple.com/library/content/documentation/AppleApplications/Reference/SafariHTMLRef/Articles/MetaTags.html#//apple_ref/doc/uid/TP40008193-SW5) +See [Safari HTML Reference](https://developer.apple.com/library/content/documentation/AppleApplications/Reference/SafariHTMLRef/Articles/MetaTags.html#//apple_ref/doc/uid/TP40008193-SW5). Possible values: @@ -420,25 +420,21 @@ manifest.apple = { ## `ms` \* -> Turns on/off the generation of Microsoft-specific meta and link tags. +> Allows to configure the generation of Microsoft-specific `browserconfig.xml` manifest. Possible values: - An object with custom settings (see the settings below) -```javascript -manifest.ms = false; -``` - ### `ms.tileColor` \* > Sets the `` property in `browserconfig.xml`. -See [Browser configuration schema reference]() +See [Browser configuration schema reference](). Possible values: -- A color in hex format. +- A color in `#hexadecimal` format. ```javascript manifest.ms = {