surface share widgets

Author: disnet

frontend/src/lib/components/AddDropdownMenu.svelte

@@ -1,5 +1,6 @@
 <script lang="ts">
   import { onMount, onDestroy } from 'svelte';
+  import { goto } from '$app/navigation';
   import Icon from '$lib/components/Icon.svelte';
   import { sidebarStore } from '$lib/stores/sidebar.svelte';
 
@@ -140,6 +141,14 @@
           <span class="item-icon"><Icon name="bookmark" size={16} /></span>
           Save URL
         </button>
+        <button
+          class="add-menu-item"
+          onclick={(e) => handleItemClick(() => goto('/settings#save-anywhere'), e)}
+          role="menuitem"
+        >
+          <span class="item-icon"><Icon name="share" size={16} /></span>
+          Save from anywhere
+        </button>
       </div>
     </div>
   {/if}

frontend/src/lib/components/AddSourceInput.svelte

@@ -1,5 +1,6 @@
 <script lang="ts">
   import { onMount, onDestroy } from 'svelte';
+  import { goto } from '$app/navigation';
   import Icon from '$lib/components/Icon.svelte';
   import { sidebarStore } from '$lib/stores/sidebar.svelte';
 
@@ -191,6 +192,13 @@
           <span class="item-icon"><Icon name="bookmark" size={16} /></span>
           Save article by URL
         </button>
+        <button
+          class="menu-item"
+          onclick={(e) => handleAction(() => goto('/settings#save-anywhere'), e)}
+        >
+          <span class="item-icon"><Icon name="share" size={16} /></span>
+          Save from anywhere
+        </button>
       </div>
     </div>
   {/if}

frontend/src/lib/components/feed/MobileBottomBar.svelte

@@ -1,4 +1,5 @@
 <script lang="ts">
+  import { goto } from '$app/navigation';
   import Icon from '$lib/components/Icon.svelte';
   import { sidebarStore } from '$lib/stores/sidebar.svelte';
   import { notificationsStore } from '$lib/stores/notifications.svelte';
@@ -94,6 +95,16 @@
             <Icon name="bookmark" size={16} />
             <span>Save URL</span>
           </button>
+          <button
+            class="add-menu-item"
+            onclick={() => {
+              addMenuOpen = false;
+              goto('/settings#save-anywhere');
+            }}
+          >
+            <Icon name="share" size={16} />
+            <span>Save from anywhere</span>
+          </button>
         </div>
       {/if}
     </div>

frontend/src/routes/settings/+page.svelte

@@ -584,7 +584,7 @@
     </div>
   </section>
 
-  <section class="card">
+  <section class="card" id="save-anywhere">
     <h2>Save from anywhere</h2>
     <p>Save an article or subscribe to a feed without leaving the page you're reading.</p>
 
@@ -651,6 +651,12 @@
         </p>
       </details>
     {/if}
+
+    <h3 class="subhead">On Android</h3>
+    <p class="hint-text">
+      Install Skyreader to your home screen and it appears right in the system share sheet. Share
+      any page, pick Skyreader, and it saves the article. No setup needed.
+    </p>
   </section>
 
   <section class="card">