feat(pwa): integration

Muhammed-Rahif · Sep 24, 2024 · f0f6bb5 · f0f6bb5
1 parent f9ef99a
commit f0f6bb5
Show file tree

Hide file tree

Showing 14 changed files with 57 additions and 15 deletions.
diff --git a/resources/Logo.fig b/resources/Logo.fig
diff --git a/resources/Notepad Logo Dark.png b/resources/Notepad Logo Dark.png
diff --git a/resources/Notepad Logo Light.png b/resources/Notepad Logo Light.png
diff --git a/src/app.html b/src/app.html
@@ -2,9 +2,12 @@
 <html lang="en">
  <head>
  <meta charset="utf-8" />
- <link rel="icon" href="%sveltekit.assets%/favicon.png" />
- <link rel="manifest" href="/manifest.json" />
- <meta name="viewport" content="width=device-width, initial-scale=1" />
+ <link rel="icon" href="/Notepad/favicon.png" />
+ <link rel="manifest" href="/Notepad/manifest.json" />
+ <meta
+ name="viewport"
+ content="width=device-width, initial-scale=1, minimum-scale=1, maximum-scale=1, user-scalable=no"
+ />
  %sveltekit.head%
  </head>
  <body data-sveltekit-preload-data="hover">

diff --git a/src/lib/assets/imgs/Notepad Logo Dark.svg b/src/lib/assets/imgs/Notepad Logo Dark.svg
diff --git a/src/lib/assets/imgs/Notepad Logo Light.svg b/src/lib/assets/imgs/Notepad Logo Light.svg
diff --git a/src/lib/assets/imgs/favicon-dark.png b/src/lib/assets/imgs/favicon-dark.png
diff --git a/src/lib/assets/imgs/favicon.png b/src/lib/assets/imgs/favicon.png
diff --git a/src/routes/+layout.svelte b/src/routes/+layout.svelte
@@ -1,7 +1,17 @@
 <script>
- import { ModeWatcher } from 'mode-watcher';
+ import { ModeWatcher, mode } from 'mode-watcher';
  import '../app.css';
+ import favIcon from '$lib/assets/imgs/favicon.png';
+ import favIconDark from '$lib/assets/imgs/favicon-dark.png';
 </script>
 
 <ModeWatcher />
 <slot></slot>
+
+<svelte:head>
+ {#if $mode == 'dark'}
+ <link rel="icon" href={favIconDark} />
+ {:else}
+ <link rel="icon" href={favIcon} />
+ {/if}
+</svelte:head>
diff --git a/static/favicon.png b/static/favicon.png
diff --git a/static/icon512_maskable.png b/static/icon512_maskable.png
diff --git a/static/icon512_rounded.png b/static/icon512_rounded.png
diff --git a/static/manifest.json b/static/manifest.json
@@ -1,14 +1,22 @@
 {
- "name": "Notepad",
- "description": "Windows like notepad for cross platform.",
- "display": "standalone",
- "start_url": "/",
+ "theme_color": "#888888",
+ "background_color": "#d4d4d4",
  "icons": [
  {
- "src": "icons/myIcon512.png",
+ "purpose": "maskable",
  "sizes": "512x512",
- "type": "image/png",
- "purpose": "any maskable"
- }
- ]
+ "src": "icon512_maskable.png",
+ "type": "image/png"
+ },
+ { "purpose": "any", "sizes": "512x512", "src": "icon512_rounded.png", "type": "image/png" }
+ ],
+ "orientation": "any",
+ "display": "standalone",
+ "dir": "auto",
+ "lang": "en-IN",
+ "name": "Notepad",
+ "short_name": "Notepad",
+ "start_url": "/Notepad",
+ "scope": ".",
+ "description": "Windows like notepad for cross platform."
 }
diff --git a/svelte.config.js b/svelte.config.js
@@ -1,7 +1,7 @@
 import adapter from '@sveltejs/adapter-static';
 import { vitePreprocess } from '@sveltejs/vite-plugin-svelte';
 
-const dev = process.env.NODE_ENV === 'development';
+// const dev = process.env.NODE_ENV === 'development';
 
 /** @type {import('@sveltejs/kit').Config} */
 const config = {
@@ -18,7 +18,8 @@ const config = {
  }),
  // https://stackoverflow.com/a/72733222/14781260
  paths: {
- base: dev ? '' : '/Notepad'
+ // base: dev ? '' : '/Notepad'
+ base: '/Notepad'
  },
  alias: {
  '@/*': 'src/lib/*'