PWA

2026-02-18 11:45:07 -06:00
parent 6167c760a1
commit f6d0c065a4
11032 changed files with 875000 additions and 134771 deletions
@@ -7,6 +7,9 @@
    <meta name="theme-color" content="#0f172a" />
    <meta name="apple-mobile-web-app-capable" content="yes" />
    <meta name="apple-mobile-web-app-status-bar-style" content="black-translucent" />
+    <meta name="apple-mobile-web-app-title" content="Stackq" />
+    <link rel="apple-touch-icon" href="/icon.svg" />
+    <link rel="manifest" href="/manifest.webmanifest" />
    %sveltekit.head%
  </head>
  <body data-sveltekit-preload-data="hover">
@@ -1,5 +1,12 @@
 <script lang="ts">
-  import "./layout.css";
+  import { onMount } from 'svelte';
+  import './layout.css';
+
+  onMount(() => {
+    import('virtual:pwa-register').then(({ registerSW }) => {
+      registerSW({ immediate: true });
+    });
+  });
 </script>

 <div class="app-shell">
@@ -108,21 +108,32 @@
    text-size-adjust: 100%;
    /* Small font, tuned for ~iPhone 16 Pro (402px viewport) */
    font-size: 12px;
+    width: 100%;
+    margin: 0;
+    padding: 0;
+    overflow-x: hidden;
  }
  body {
    @apply bg-background text-foreground;
+    width: 100%;
+    margin: 0;
+    min-height: 100dvh;
+    overflow-x: hidden;
    /* Safe area for notched devices */
    padding-left: env(safe-area-inset-left);
    padding-right: env(safe-area-inset-right);
    padding-bottom: env(safe-area-inset-bottom);
+    /* Center the app shell on all viewports */
+    display: flex;
+    flex-direction: column;
+    align-items: center;
  }
  /* Constrain width to iPhone 16 Pro viewport (402px) so layout matches on all devices */
  .app-shell {
    width: 100%;
    max-width: 402px;
    min-height: 100dvh;
-    margin-left: auto;
-    margin-right: auto;
+    flex-shrink: 0;
  }
  /* Compact tap targets so UI is denser */
  @media (pointer: coarse) {