Added more community guides to APIs and comm guides pages

site/docs-md/apis/camera/index.md

@@ -64,9 +64,9 @@ async takePicture() {
 }
 ```
 
-## Angular example
+## Example Guides
 
-[Follow this guide](../../guides/ionic-framework-app) to implement the Camera API in an Ionic Angular app.
+[Building an Ionic Framework Camera App](/docs/guides/ionic-framework-app)
 
 ## API
 

site/docs-md/apis/network/index.md

@@ -48,6 +48,10 @@ The Network API requires the following permission be added to your `AndroidManif
 
 This permission allows the app to access information about the current network, such as whether it is connected to wifi or cellular.
 
+## Example Guides
+
+[Network: Ionic 4 and Network Detection with Capacitor ›](https://developer.school/posts/ionic-4-network-detection-with-capacitor/)
+
 ## API
 
 <plugin-api name="network"></plugin-api>

site/docs-md/apis/push-notifications/index.md

@@ -67,7 +67,9 @@ An empty Array can be provided if none of the previous options are desired. `pus
 <plugin-api index="true" name="push-notifications"></plugin-api>
 
 
-## Example
+## Example Guides
+
+[Using Push Notifications with Firebase in an Ionic Angular App](/docs/guides/push-notifications-firebase)
 
 ## API
 

site/docs-md/apis/splash-screen/index.md

@@ -71,7 +71,7 @@ Then run `npx cap copy` to apply these changes.
 
 ## Configuration
 
-These config parameters are availiable in `capacitor.config.json`:
+These config parameters are available in `capacitor.config.json`:
 
 ```json
 {
@@ -86,10 +86,6 @@ These config parameters are availiable in `capacitor.config.json`:
 }
 ```
 
-## Add your own splash screen images
-
-See [Josh Morony's blog post](https://www.joshmorony.com/adding-icons-splash-screens-launch-images-to-capacitor-projects/) on how to change it. 
-
 ### Android
 
 If your splash screen images aren't named "splash.png" but for example "screen.png" you have to change `"androidSplashResourceName": "screen"` in `capacitor.config.json` and change the following files in you're Android app as well:
@@ -126,6 +122,12 @@ with
     </style>
 ```
 
+## Example Guides
+
+[Adding Your Own Icons and Splash Screen Images &#8250;](https://www.joshmorony.com/adding-icons-splash-screens-launch-images-to-capacitor-projects/)
+
+[Creating a Dynamic/Adaptable Splash Screen for Capacitor (Android) &#8250;](https://www.joshmorony.com/creating-a-dynamic-universal-splash-screen-for-capacitor-android/)
+
 ## API
 
 <plugin-api name="splash-screen"></plugin-api>

site/docs-md/guides/community.md

@@ -10,8 +10,6 @@ contributors:
 
 ## General
 
-General Capacitor guides and tutorials from the community.
-
 [How to Build an Ionic Chat App with React and Stream ›](https://levelup.gitconnected.com/how-to-build-an-ionic-chat-app-with-react-and-stream-739b67611280)
 
 [Capacitor: Five Apps in Five Minutes ›](https://angularfirebase.com/lessons/capacitor-five-apps-in-five-minutes/)
@@ -20,6 +18,16 @@ General Capacitor guides and tutorials from the community.
 
 [Capacitor Workflow for iOS and Android Apps ›](https://www.youtube.com/watch?v=oXbRcpsytGQ)
 
+## APIs
+
+[Camera: Building an Ionic Framework Camera App](/docs/guides/ionic-framework-app)
+
+[Network: Ionic 4 and Network Detection with Capacitor ›](https://developer.school/posts/ionic-4-network-detection-with-capacitor/)
+
+[Push Notifications: Using Push Notifications with Firebase in an Ionic Angular App](/docs/guides/push-notifications-firebase)
+
+[Splash Screen: Creating a Dynamic/Adaptable Splash Screen for Capacitor (Android) ›](https://www.joshmorony.com/creating-a-dynamic-universal-splash-screen-for-capacitor-android/)
+
 ## Integrations
 
 [Using Google Maps and Geolocation in Ionic with Capacitor ›](https://www.joshmorony.com/using-google-maps-and-geolocation-in-ionic-with-capacitor)

site/src/assets/docs-content/apis/camera/index.json

@@ -1 +1 @@
-{"title":"Camera","description":"Camera API","url":"/docs/apis/camera","contributors":["mlynch","jcesarmobile"],"lastUpdated":"2018-06-01T00:00:00.000Z","headings":[{"id":"camera","level":1,"text":"Camera"},{"id":"ios-notes","level":2,"text":"iOS Notes"},{"id":"android-notes","level":2,"text":"Android Notes"},{"id":"example","level":2,"text":"Example"},{"id":"angular-example","level":2,"text":"Angular example"},{"id":"api","level":2,"text":"API"}],"srcPath":"./docs-md/apis/camera/index.md","content":"<p><plugin-platforms platforms=\"pwa,ios,android,electron\"></plugin-platforms></p>\n\n<h1 id=\"camera\">\n  \n  Camera\n  \n</h1>\n<p>The Camera API allows a user to pick a photo from their photo album or take a picture. On iOS, this uses <code>UIImagePickerController</code>, and on Android this\nAPI sends an intent which will be handled by the core Camera app by default.</p>\n<p><plugin-api index=\"true\" name=\"camera\"></plugin-api></p>\n\n<h2 id=\"ios-notes\">\n  <a class=\"heading-link\" href=\"#ios-notes\"><ion-icon name=\"ios-link\"></ion-icon>\n  iOS Notes\n  </a>\n</h2>\n<p>iOS requires the following usage description be added and filled out for your app in <code>Info.plist</code>:</p>\n<p>Name: <code>Privacy - Camera Usage Description</code><br>Key:     <code>NSCameraUsageDescription</code></p>\n<p>Read about <stencil-route-link  url=/docs/ios/configuration>Setting iOS Permissions</stencil-route-link> in the <a href=\"../../ios/\">iOS Guide</a> for more information on setting iOS permissions in Xcode</p>\n\n<h2 id=\"android-notes\">\n  <a class=\"heading-link\" href=\"#android-notes\"><ion-icon name=\"ios-link\"></ion-icon>\n  Android Notes\n  </a>\n</h2>\n<p>This API requires the following permissions be added to your <code>AndroidManifest.xml</code>:</p>\n\n  <highlight-code-line >\n    <pre class=\"language-xml\"><code class=\"language-xml\">&lt;uses-permission android:name=\"android.permission.READ_EXTERNAL_STORAGE\"/&gt;\n&lt;uses-permission android:name=\"android.permission.WRITE_EXTERNAL_STORAGE\" /&gt;</code></pre>\n  </highlight-code-line>\n  <p>The storage permissions are for reading/saving photo files.</p>\n<p>Read about <stencil-route-link  url=/docs/android/configuration>Setting Android Permissions</stencil-route-link> in the <a href=\"../../android/\">Android Guide</a> for more information on setting Android permissions.</p>\n<p>Additionally, because the Camera API launches a separate Activity to handle taking the photo, you should listen for <code>appRestoredResult</code> in the <code>App</code> plugin\nto handle any camera data that was sent in the case your app was terminated by the operating system while the Activity was running.</p>\n\n<h2 id=\"example\">\n  <a class=\"heading-link\" href=\"#example\"><ion-icon name=\"ios-link\"></ion-icon>\n  Example\n  </a>\n</h2>\n\n  <highlight-code-line >\n    <pre class=\"language-typescript\"><code class=\"language-typescript\"><span class=\"token keyword\">import</span> <span class=\"token punctuation\">{</span> Plugins<span class=\"token punctuation\">,</span> CameraResultType <span class=\"token punctuation\">}</span> <span class=\"token keyword\">from</span> <span class=\"token string\">'@capacitor/core'</span><span class=\"token punctuation\">;</span>\n\n<span class=\"token keyword\">const</span> <span class=\"token punctuation\">{</span> Camera <span class=\"token punctuation\">}</span> <span class=\"token operator\">=</span> Plugins<span class=\"token punctuation\">;</span>\n\n<span class=\"token keyword\">async</span> <span class=\"token function\">takePicture</span><span class=\"token punctuation\">(</span><span class=\"token punctuation\">)</span> <span class=\"token punctuation\">{</span>\n  <span class=\"token keyword\">const</span> image <span class=\"token operator\">=</span> <span class=\"token keyword\">await</span> Camera<span class=\"token punctuation\">.</span><span class=\"token function\">getPhoto</span><span class=\"token punctuation\">(</span><span class=\"token punctuation\">{</span>\n    quality<span class=\"token punctuation\">:</span> <span class=\"token number\">90</span><span class=\"token punctuation\">,</span>\n    allowEditing<span class=\"token punctuation\">:</span> <span class=\"token boolean\">true</span><span class=\"token punctuation\">,</span>\n    resultType<span class=\"token punctuation\">:</span> CameraResultType<span class=\"token punctuation\">.</span>Uri\n  <span class=\"token punctuation\">}</span><span class=\"token punctuation\">)</span><span class=\"token punctuation\">;</span>\n  <span class=\"token comment\">// image.webPath will contain a path that can be set as an image src. </span>\n  <span class=\"token comment\">// You can access the original file using image.path, which can be </span>\n  <span class=\"token comment\">// passed to the Filesystem API to read the raw data of the image, </span>\n  <span class=\"token comment\">// if desired (or pass resultType: CameraResultType.Base64 to getPhoto)</span>\n  <span class=\"token keyword\">var</span> imageUrl <span class=\"token operator\">=</span> image<span class=\"token punctuation\">.</span>webPath<span class=\"token punctuation\">;</span>\n  <span class=\"token comment\">// Can be set to the src of an image now</span>\n  imageElement<span class=\"token punctuation\">.</span>src <span class=\"token operator\">=</span> imageUrl<span class=\"token punctuation\">;</span>\n<span class=\"token punctuation\">}</span></code></pre>\n  </highlight-code-line>\n  \n<h2 id=\"angular-example\">\n  <a class=\"heading-link\" href=\"#angular-example\"><ion-icon name=\"ios-link\"></ion-icon>\n  Angular example\n  </a>\n</h2>\n<p><stencil-route-link  url=/docs/guides/ionic-framework-app>Follow this guide</stencil-route-link> to implement the Camera API in an Ionic Angular app.</p>\n\n<h2 id=\"api\">\n  <a class=\"heading-link\" href=\"#api\"><ion-icon name=\"ios-link\"></ion-icon>\n  API\n  </a>\n</h2>\n<p><plugin-api name=\"camera\"></plugin-api></p>\n"}
+{"title":"Camera","description":"Camera API","url":"/docs/apis/camera","contributors":["mlynch","jcesarmobile"],"headings":[{"id":"camera","level":1,"text":"Camera"},{"id":"ios-notes","level":2,"text":"iOS Notes"},{"id":"android-notes","level":2,"text":"Android Notes"},{"id":"example","level":2,"text":"Example"},{"id":"example-guides","level":2,"text":"Example Guides"},{"id":"api","level":2,"text":"API"}],"srcPath":"./docs-md/apis/camera/index.md","content":"<p><plugin-platforms platforms=\"pwa,ios,android,electron\"></plugin-platforms></p>\n\n<h1 id=\"camera\">\n  \n  Camera\n  \n</h1>\n<p>The Camera API allows a user to pick a photo from their photo album or take a picture. On iOS, this uses <code>UIImagePickerController</code>, and on Android this\nAPI sends an intent which will be handled by the core Camera app by default.</p>\n<p><plugin-api index=\"true\" name=\"camera\"></plugin-api></p>\n\n<h2 id=\"ios-notes\">\n  <a class=\"heading-link\" href=\"#ios-notes\"><ion-icon name=\"ios-link\"></ion-icon>\n  iOS Notes\n  </a>\n</h2>\n<p>iOS requires the following usage description be added and filled out for your app in <code>Info.plist</code>:</p>\n<p>Name: <code>Privacy - Camera Usage Description</code><br>Key:     <code>NSCameraUsageDescription</code></p>\n<p>Read about <stencil-route-link  url=/docs/ios/configuration>Setting iOS Permissions</stencil-route-link> in the <a href=\"../../ios/\">iOS Guide</a> for more information on setting iOS permissions in Xcode</p>\n\n<h2 id=\"android-notes\">\n  <a class=\"heading-link\" href=\"#android-notes\"><ion-icon name=\"ios-link\"></ion-icon>\n  Android Notes\n  </a>\n</h2>\n<p>This API requires the following permissions be added to your <code>AndroidManifest.xml</code>:</p>\n\n  <highlight-code-line >\n    <pre class=\"language-xml\"><code class=\"language-xml\">&lt;uses-permission android:name=\"android.permission.READ_EXTERNAL_STORAGE\"/&gt;\n&lt;uses-permission android:name=\"android.permission.WRITE_EXTERNAL_STORAGE\" /&gt;</code></pre>\n  </highlight-code-line>\n  <p>The storage permissions are for reading/saving photo files.</p>\n<p>Read about <stencil-route-link  url=/docs/android/configuration>Setting Android Permissions</stencil-route-link> in the <a href=\"../../android/\">Android Guide</a> for more information on setting Android permissions.</p>\n<p>Additionally, because the Camera API launches a separate Activity to handle taking the photo, you should listen for <code>appRestoredResult</code> in the <code>App</code> plugin\nto handle any camera data that was sent in the case your app was terminated by the operating system while the Activity was running.</p>\n\n<h2 id=\"example\">\n  <a class=\"heading-link\" href=\"#example\"><ion-icon name=\"ios-link\"></ion-icon>\n  Example\n  </a>\n</h2>\n\n  <highlight-code-line >\n    <pre class=\"language-typescript\"><code class=\"language-typescript\"><span class=\"token keyword\">import</span> <span class=\"token punctuation\">{</span> Plugins<span class=\"token punctuation\">,</span> CameraResultType <span class=\"token punctuation\">}</span> <span class=\"token keyword\">from</span> <span class=\"token string\">'@capacitor/core'</span><span class=\"token punctuation\">;</span>\n\n<span class=\"token keyword\">const</span> <span class=\"token punctuation\">{</span> Camera <span class=\"token punctuation\">}</span> <span class=\"token operator\">=</span> Plugins<span class=\"token punctuation\">;</span>\n\n<span class=\"token keyword\">async</span> <span class=\"token function\">takePicture</span><span class=\"token punctuation\">(</span><span class=\"token punctuation\">)</span> <span class=\"token punctuation\">{</span>\n  <span class=\"token keyword\">const</span> image <span class=\"token operator\">=</span> <span class=\"token keyword\">await</span> Camera<span class=\"token punctuation\">.</span><span class=\"token function\">getPhoto</span><span class=\"token punctuation\">(</span><span class=\"token punctuation\">{</span>\n    quality<span class=\"token punctuation\">:</span> <span class=\"token number\">90</span><span class=\"token punctuation\">,</span>\n    allowEditing<span class=\"token punctuation\">:</span> <span class=\"token boolean\">true</span><span class=\"token punctuation\">,</span>\n    resultType<span class=\"token punctuation\">:</span> CameraResultType<span class=\"token punctuation\">.</span>Uri\n  <span class=\"token punctuation\">}</span><span class=\"token punctuation\">)</span><span class=\"token punctuation\">;</span>\n  <span class=\"token comment\">// image.webPath will contain a path that can be set as an image src. </span>\n  <span class=\"token comment\">// You can access the original file using image.path, which can be </span>\n  <span class=\"token comment\">// passed to the Filesystem API to read the raw data of the image, </span>\n  <span class=\"token comment\">// if desired (or pass resultType: CameraResultType.Base64 to getPhoto)</span>\n  <span class=\"token keyword\">var</span> imageUrl <span class=\"token operator\">=</span> image<span class=\"token punctuation\">.</span>webPath<span class=\"token punctuation\">;</span>\n  <span class=\"token comment\">// Can be set to the src of an image now</span>\n  imageElement<span class=\"token punctuation\">.</span>src <span class=\"token operator\">=</span> imageUrl<span class=\"token punctuation\">;</span>\n<span class=\"token punctuation\">}</span></code></pre>\n  </highlight-code-line>\n  \n<h2 id=\"example-guides\">\n  <a class=\"heading-link\" href=\"#example-guides\"><ion-icon name=\"ios-link\"></ion-icon>\n  Example Guides\n  </a>\n</h2>\n<p><a href=\"/docs/guides/ionic-framework-app\">Building an Ionic Framework Camera App</a></p>\n\n<h2 id=\"api\">\n  <a class=\"heading-link\" href=\"#api\"><ion-icon name=\"ios-link\"></ion-icon>\n  API\n  </a>\n</h2>\n<p><plugin-api name=\"camera\"></plugin-api></p>\n"}