瀏覽代碼

Cont'd docs

binwiederhier 2 年之前
父節點
當前提交
c0ac2c95ca

二進制
docs/static/img/pwa-install-chrome-android-menu.jpg


二進制
docs/static/img/pwa-install-chrome-android-popup.jpg


二進制
docs/static/img/pwa-install-chrome-android.jpg


二進制
docs/static/img/pwa-install-chrome.png


+ 0 - 32
docs/subscribe/installed-web-app.md

@@ -1,32 +0,0 @@
-# Using the web app as an installed web app
-
-While ntfy doesn't have a native desktop app, it is built as a [progressive web app](https://developer.mozilla.org/en-US/docs/Web/Progressive_web_apps) (PWA)
-and thus can be installed on both desktop and mobile devices.
-
-This gives it its own launcher (e.g. shortcut on Windows, app on macOS, launcher shortcut on Linux, home screen icon on iOS, and
-launcher icon on Android), a standalone window, push notifications, and an app badge with the unread notification count.
-
-To install and register the web app in your operating system, click the "install app" icon in your browser (usually next to the
-address bar). On iOS Safari, tap on the Share menu > "Add to Home Screen".
-
-## Background Notifications
-
-Background notifications via web push are enabled by default and cannot be turned off when the app is installed, as notifications would
-not be delivered reliably otherwise. You can mute topics you don't want to receive notifications for.
-
-On desktop, you generally need either your browser or the web app open to receive notifications, though the ntfy tab doesn't need to be
-open. On mobile, you don't need to have the web app open to receive notifications. Look at the [web docs](./web.md#background-notifications)
-for a detailed breakdown.
-
-## Compatibility
-
-<!-- TODO: (Q4 2023) Safari 17 / macOS 14 Sonoma supports installable PWAs too -->
-
-Web app installation is supported on Chrome and Edge on desktop, as well as Chrome on Android and Safari on iOS.
-Look at the [compatibility table](https://caniuse.com/web-app-manifest) for more info.
-
-<div id="pwa-screenshots" class="screenshots">
-    <a href="../../static/img/pwa.png"><img src="../../static/img/pwa.png"/></a> 
-    <a href="../../static/img/pwa-install.png"><img src="../../static/img/pwa-install.png"/></a>
-    <a href="../../static/img/pwa-badge.png"><img src="../../static/img/pwa-badge.png"/></a>
-</div>

+ 55 - 0
docs/subscribe/pwa.md

@@ -0,0 +1,55 @@
+# Using the progressive web app (PWA)
+While ntfy doesn't have a native desktop app, it is built as a [progressive web app](https://developer.mozilla.org/en-US/docs/Web/Progressive_web_apps) (PWA)
+and thus can be installed on both desktop and mobile devices.
+
+This gives it its own launcher (e.g. shortcut on Windows, app on macOS, launcher shortcut on Linux, home screen icon on iOS, and
+launcher icon on Android), a standalone window, push notifications, and an app badge with the unread notification count.
+
+Web app installation is supported on (see [compatibility table](https://caniuse.com/web-app-manifest) for details):
+
+- Chrome on all platforms (Windows/Linux/macOS/Android/iOS)
+- Firefox on Android natively, and on Windows/Linux ([via an extension](https://addons.mozilla.org/en-US/firefox/addon/pwas-for-firefox/))
+- Edge on Windows
+- Safari on macOS/iOS
+
+<!-- TODO: (Q4 2023) Safari 17 / macOS 14 Sonoma supports installable PWAs too -->
+
+## Installation
+
+### Chrome/Safari on Desktop
+To install and register the web app via Chrome, click the "install app" icon. After installation, you can find the app in your
+app drawer:
+
+<div id="pwa-screenshots-chrome-safari-desktop" class="screenshots">
+    <a href="../../static/img/pwa-install.png"><img src="../../static/img/pwa-install.png"/></a>
+    <a href="../../static/img/pwa.png"><img src="../../static/img/pwa.png"/></a> 
+    <a href="../../static/img/pwa-badge.png"><img src="../../static/img/pwa-badge.png"/></a>
+
+</div>
+
+### Chrome on Android
+For Chrome on Android, either click the "Add to Home Screen" banner at the bottom of the screen, or select "install app"
+in the menu. After installation, you can find the app in your app drawer, and on your home screen.
+
+<div id="pwa-screenshots-chrome-android" class="screenshots">
+    <a href="../../static/img/pwa-install-chrome-android.jpg"><img src="../../static/img/pwa-install-chrome-android.jpg"/></a>
+    <a href="../../static/img/pwa-install-chrome-android-menu.jpg"><img src="../../static/img/pwa-install-chrome-android-menu.jpg"/></a>
+    <a href="../../static/img/pwa-install-chrome-android-popup.jpg"><img src="../../static/img/pwa-install-chrome-android-popup.jpg"/></a>
+</div>
+
+### Firefox on Android
+
+XXXXXXXXXXX
+
+### Safari on iOS
+On iOS Safari, tap on the Share menu > "Add to Home Screen".
+
+XXXXXXx
+
+## Background notifications
+Background notifications via web push are enabled by default and cannot be turned off when the app is installed, as notifications would
+not be delivered reliably otherwise. You can mute topics you don't want to receive notifications for.
+
+On desktop, you generally need either your browser or the web app open to receive notifications, though the ntfy tab doesn't need to be
+open. On mobile, you don't need to have the web app open to receive notifications. Look at the [web docs](./web.md#background-notifications)
+for a detailed breakdown.

+ 2 - 3
docs/subscribe/web.md

@@ -23,11 +23,10 @@ If topic reservations are enabled, you can claim ownership over topics and defin
     <a href="../../static/img/web-reserve-topic-dialog.png"><img src="../../static/img/web-reserve-topic-dialog.png"/></a>
     <a href="../../static/img/web-reserve-topic-dialog.png"><img src="../../static/img/web-reserve-topic-dialog.png"/></a>
 </div>
 </div>
 
 
-## Background Notifications
-
+## Background notifications
 While subscribing, you have the option to enable background notifications on supported browsers (see "Settings" tab).
 While subscribing, you have the option to enable background notifications on supported browsers (see "Settings" tab).
 
 
-Note: If you add the web app to your homescreen (as a progressive web app, more info in the [installed web app](./installed-web-app.md)
+Note: If you add the web app to your homescreen (as a progressive web app, more info in the [installed web app](pwa.md)
 docs), you cannot turn these off, as notifications would not be delivered reliably otherwise. You can mute topics you don't want to receive
 docs), you cannot turn these off, as notifications would not be delivered reliably otherwise. You can mute topics you don't want to receive
 notifications for.
 notifications for.
 
 

+ 1 - 1
mkdocs.yml

@@ -82,7 +82,7 @@ nav:
 - "Subscribing":
 - "Subscribing":
   - "From your phone": subscribe/phone.md
   - "From your phone": subscribe/phone.md
   - "From the Web app": subscribe/web.md
   - "From the Web app": subscribe/web.md
-  - "From the Desktop": subscribe/desktop.md
+  - "From the Desktop": subscribe/pwa.md
   - "From the CLI": subscribe/cli.md
   - "From the CLI": subscribe/cli.md
   - "Using the API": subscribe/api.md
   - "Using the API": subscribe/api.md
 - "Self-hosting":
 - "Self-hosting":