#186 init electron

2025-04-23 14:07:14 +03:00 · 2023-02-02 09:34:26 +08:00 · 2023-02-02 09:34:26 +08:00 · 0d6336a036
commit 0d6336a036
parent ccd00b5c03
26 changed files with 4914 additions and 42 deletions
--- a/.github/workflows/ci.yml
+++ b/.github/workflows/ci.yml
@ -5,32 +5,23 @@ jobs:
  changes:
    runs-on: ubuntu-latest
    outputs:
-      svelte: ${{steps.svelte.outputs.src}}
-      tauri: ${{steps.tauri.outputs.src}}
+      desktop: ${{steps.desktop.outputs.src}}
      preview_folder: ${{steps.preview.outputs.folder}}
    steps:
    - uses: actions/checkout@v3
    - uses: dorny/paths-filter@v2
-      id: svelte
+      id: desktop
      with:
        filters: |
          src:
-            - 'modules/gui/src/**'
+            - 'modules/desktop/**'
            - 'modules/ui/**'
-    - uses: dorny/paths-filter@v2
-      id: tauri
-      with:
-        filters: |
-          src:
-            - 'modules/gui/src-tauri/**'
-            - 'modules/gui/src/**'
-            - 'modules/ui/src/**'
    - name: get s3 preview folder
      id: preview
      run: echo "folder=${{ github.event.number }}-merge" >> $GITHUB_OUTPUT
  no_preview:
    needs: changes
-    if: needs.changes.outputs.svelte == 'false'
+    if: needs.changes.outputs.desktop == 'false'
    runs-on: ubuntu-latest
    steps:
      - name: comment preview site
@ -104,10 +95,28 @@ jobs:
            https://${{steps.preview_setup.outputs.domain}}
            ```
            copy-paste into a browser to view
-
+  build_desktop:
+    needs: changes
+    if: needs.changes.outputs.desktop == 'true'
+    runs-on: ${{ matrix.platform.os }}
+    strategy:
+      matrix:
+        platform:
+          - os: macos-11
+            name: darwin+x86-64
+          - os: ubuntu-latest
+            name: linux+x86-64
+          - os: [self-hosted, macOS, ARM64]
+            name: darwin+aarch64
+          # err: Package atk was not found in the pkg-config search path.
+          # requires atk >= 2.18
+          # - os: [self-hosted, linux, ARM64]
+          #   name: linux+aarch64
+    steps:
+    - uses: actions/checkout@v3
  build_tauri:
    needs: changes
-    if: needs.changes.outputs.tauri == 'true'
+    if: needs.changes.outputs.desktop == 'true'
    runs-on: ${{ matrix.platform.os }}
    strategy:
      matrix:
--- a/modules/desktop/.gitignore
+++ b/modules/desktop/.gitignore
@ -0,0 +1,9 @@
+.DS_Store
+node_modules
+/build
+/.svelte-kit
+/package
+.env
+.env.*
+!.env.example
+coverage/*
--- a/modules/desktop/.npmrc
+++ b/modules/desktop/.npmrc
@ -0,0 +1 @@
+node-linker=hoisted
--- a/modules/desktop/README.md
+++ b/modules/desktop/README.md
@ -0,0 +1,61 @@
+# @tea/desktop
+
+Desktop app of [tea](https://tea.xyz) for installing packages/softwares
+
+More interesting and possibly updated documentations are at this [NOTION](https://www.notion.so/teaxyz/tea-gui-fdd9f50aa980432fa370b2cf6a03cb50) page. It is ideal to review it also, its more updated.
+
+## Developing
+
+Once you've created a project and installed dependencies with `npm install` (or `pnpm install` or `yarn`), start a development server:
+
+```bash
+# use if you need interaction with the rust handlers
+pnpm tauri dev
+
+# or if ui dev only
+pnpm run dev -- --open
+```
+
+## Building
+
+To create a production version of your app:
+
+```bash
+pnpm run build
+```
+
+You can preview the production build with `npm run preview`.
+
+> To deploy your app, you may need to install an [adapter](https://kit.svelte.dev/docs/adapters) for your target environment.
+
+## Testing
+
+```bash
+pnpm playwright install
+pnpm test
+
+```
+
+## Intuition Building Links
+
+- [Rust module system is weird?](https://www.sheshbabu.com/posts/rust-module-system/)
+
+<p align="center">
+  <img src="https://github.com/Dax89/electron-sveltekit/blob/master/icon.png" width="256">
+</p>
+<p align="center">
+  A minimal project template for Electron and SvelteKit configured with <a href="https://www.npmjs.com/package/@sveltejs/adapter-static">adapter-static</a>.
+</p>
+
+## Screenshot 
+![Screenshot](https://github.com/Dax89/electron-sveltekit/blob/master/screenshot.png)
+
+
+
+## Commands
+- `pnpm dev`: Runs SvelteKit in dev mode
+- `pnpm preview`: Runs SvelteKit in production mode
+- `pnpm electron`: Runs SvelteKit with electron in dev mode
+- `pnpm build`: Runs SvelteKit compiler
+- `pnpm dev:package`: Creates an Electron package (you can inspect the contents)
+- `pnpm package`: Creates a distributable Electron package
--- a/modules/desktop/electron-builder.config.json
+++ b/modules/desktop/electron-builder.config.json
@ -0,0 +1,8 @@
+{
+  "asar": false,
+  "directories": { "output": "dist" },
+  "files": [
+    "src/electron.cjs", 
+    { "from": "build", "to": "" }
+  ]
+}
--- a/modules/desktop/electron_svelte.svg
+++ b/modules/desktop/electron_svelte.svg
@ -0,0 +1,96 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<svg
+   xmlns:dc="http://purl.org/dc/elements/1.1/"
+   xmlns:cc="http://creativecommons.org/ns#"
+   xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
+   xmlns:svg="http://www.w3.org/2000/svg"
+   xmlns="http://www.w3.org/2000/svg"
+   xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
+   xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
+   width="256"
+   height="256"
+   style="cursor: default;"
+   version="1.1"
+   id="svg16"
+   sodipodi:docname="electron_svelte.svg"
+   inkscape:export-filename="/home/davide/electron_svelte.png"
+   inkscape:export-xdpi="192"
+   inkscape:export-ydpi="192"
+   inkscape:version="1.0.2 (e86c870879, 2021-01-15)">
+  <metadata
+     id="metadata22">
+    <rdf:RDF>
+      <cc:Work
+         rdf:about="">
+        <dc:format>image/svg+xml</dc:format>
+        <dc:type
+           rdf:resource="http://purl.org/dc/dcmitype/StillImage" />
+      </cc:Work>
+    </rdf:RDF>
+  </metadata>
+  <defs
+     id="defs20" />
+  <sodipodi:namedview
+     pagecolor="#ffffff"
+     bordercolor="#666666"
+     borderopacity="1"
+     objecttolerance="10"
+     gridtolerance="10"
+     guidetolerance="10"
+     inkscape:pageopacity="0"
+     inkscape:pageshadow="2"
+     inkscape:window-width="2559"
+     inkscape:window-height="979"
+     id="namedview18"
+     showgrid="false"
+     inkscape:zoom="2.8632812"
+     inkscape:cx="128"
+     inkscape:cy="128"
+     inkscape:window-x="1"
+     inkscape:window-y="34"
+     inkscape:window-maximized="1"
+     inkscape:current-layer="svg16"
+     inkscape:document-rotation="0" />
+  <g
+     fill="none"
+     fill-rule="evenodd"
+     id="g14">
+    <circle
+       fill="#2B2E3A"
+       cx="128"
+       cy="128"
+       r="128"
+       id="circle2" />
+    <g
+       fill="#9FEAF9"
+       fill-rule="nonzero"
+       id="g12">
+      <path
+         d="M100.502 71.69c-26.005-4.736-46.567.221-54.762 14.415-6.115 10.592-4.367 24.635 4.24 39.646a2.667 2.667 0 1 0 4.626-2.653c-7.752-13.522-9.261-25.641-4.247-34.326 6.808-11.791 25.148-16.213 49.187-11.835a2.667 2.667 0 0 0 .956-5.247zm-36.999 72.307c10.515 11.555 24.176 22.394 39.756 31.388 37.723 21.78 77.883 27.601 97.675 14.106a2.667 2.667 0 1 0-3.005-4.406c-17.714 12.078-55.862 6.548-92.003-14.318-15.114-8.726-28.343-19.222-38.478-30.36a2.667 2.667 0 1 0-3.945 3.59z"
+         id="path4" />
+      <path
+         d="M194.62 140.753c17.028-20.116 22.973-40.348 14.795-54.512-6.017-10.423-18.738-15.926-35.645-16.146a2.667 2.667 0 0 0-.069 5.333c15.205.198 26.165 4.939 31.096 13.48 6.792 11.765 1.49 29.807-14.248 48.399a2.667 2.667 0 1 0 4.071 3.446zm-43.761-68.175c-15.396 3.299-31.784 9.749-47.522 18.835-38.942 22.483-64.345 55.636-60.817 79.675a2.667 2.667 0 1 0 5.277-.775c-3.133-21.344 20.947-52.769 58.207-74.281 15.267-8.815 31.135-15.06 45.972-18.239a2.667 2.667 0 1 0-1.117-5.215z"
+         id="path6" />
+      <path
+         d="M87.77 187.753c8.904 24.86 23.469 40.167 39.847 40.167 11.945 0 22.996-8.143 31.614-22.478a2.667 2.667 0 1 0-4.571-2.748c-7.745 12.883-17.258 19.892-27.043 19.892-13.605 0-26.596-13.652-34.825-36.63a2.667 2.667 0 1 0-5.021 1.797zm81.322-4.863c4.61-14.728 7.085-31.718 7.085-49.423 0-44.179-15.463-82.263-37.487-92.042a2.667 2.667 0 0 0-2.164 4.874c19.643 8.723 34.317 44.866 34.317 87.168 0 17.177-2.397 33.63-6.84 47.83a2.667 2.667 0 1 0 5.09 1.593zm50.224-2.612c0-7.049-5.714-12.763-12.763-12.763-7.049 0-12.763 5.714-12.763 12.763 0 7.049 5.714 12.763 12.763 12.763 7.049 0 12.763-5.714 12.763-12.763zm-5.333 0a7.43 7.43 0 1 1-14.86 0 7.43 7.43 0 0 1 14.86 0zM48.497 193.041c7.05 0 12.764-5.714 12.764-12.763 0-7.049-5.715-12.763-12.764-12.763-7.048 0-12.763 5.714-12.763 12.763 0 7.049 5.715 12.763 12.763 12.763zm0-5.333a7.43 7.43 0 1 1 0-14.86 7.43 7.43 0 0 1 0 14.86z"
+         id="path8" />
+      <path
+         d="M127.617 54.444c7.049 0 12.763-5.714 12.763-12.763 0-7.049-5.714-12.763-12.763-12.763-7.049 0-12.763 5.714-12.763 12.763 0 7.049 5.714 12.763 12.763 12.763zm0-5.333a7.43 7.43 0 1 1 0-14.86 7.43 7.43 0 0 1 0 14.86zm1.949 93.382c-4.985 1.077-9.896-2.091-10.975-7.076a9.236 9.236 0 0 1 7.076-10.976c4.985-1.077 9.896 2.091 10.976 7.076 1.077 4.985-2.091 9.897-7.077 10.976z"
+         id="path10" />
+    </g>
+  </g>
+  <g
+     id="g861"
+     transform="matrix(1.1509868,0,0,1.1509868,-17.678179,-20.73326)">
+    <path
+       class="st0"
+       d="m 150.7108,104.72628 c -6.15225,-8.861491 -18.4003,-11.457852 -27.20535,-5.870031 l -15.52172,9.933901 c -4.2332,2.65281 -7.16822,6.99889 -8.01486,11.9094 -0.733755,4.12031 -0.112886,8.35351 1.86261,12.02227 -1.35463,2.03194 -2.257709,4.28964 -2.652807,6.66023 -0.903082,5.0234 0.282213,10.21612 3.217237,14.33643 6.20869,8.86149 18.4003,11.45786 27.20535,5.87004 l 15.52172,-9.87746 c 4.2332,-2.65281 7.16821,-6.99889 8.01485,-11.9094 0.73376,-4.12031 0.11288,-8.35351 -1.86261,-12.02228 1.35463,-2.03193 2.25771,-4.28964 2.65281,-6.66023 0.95953,-5.07983 -0.22578,-10.27256 -3.21723,-14.39287"
+       id="path4-3"
+       style="fill:#ff3e00;stroke-width:0.564426" />
+    <path
+       class="st1"
+       d="m 121.9815,154.56512 c -5.02339,1.29818 -10.27256,-0.67731 -13.20758,-4.91051 -1.80616,-2.48347 -2.48347,-5.58782 -1.97549,-8.63572 0.11289,-0.50798 0.22577,-0.95952 0.33866,-1.46751 l 0.28221,-0.90308 0.7902,0.56443 c 1.8626,1.35462 3.89454,2.37059 6.0958,3.0479 l 0.56443,0.16933 -0.0564,0.56442 c -0.0564,0.7902 0.16933,1.63684 0.62087,2.31415 0.90308,1.29818 2.48347,1.91905 4.00742,1.52395 0.33866,-0.11288 0.67732,-0.22577 0.95953,-0.3951 l 15.46527,-9.87746 c 0.79021,-0.50798 1.29818,-1.24174 1.46751,-2.14482 0.16933,-0.90308 -0.0564,-1.8626 -0.56442,-2.59636 -0.90309,-1.29818 -2.48348,-1.86261 -4.00743,-1.46751 -0.33866,0.11289 -0.67731,0.22577 -0.95953,0.3951 l -5.92647,3.78166 c -0.95953,0.62087 -2.03194,1.07241 -3.16079,1.35462 -5.02339,1.29818 -10.27255,-0.67731 -13.20757,-4.91051 -1.74972,-2.48347 -2.48348,-5.58781 -1.91905,-8.63572 0.50798,-2.93501 2.31415,-5.58782 4.85407,-7.16821 l 15.52172,-9.87746 c 0.95952,-0.62087 2.03193,-1.07241 3.16078,-1.41107 5.0234,-1.29818 10.27256,0.67731 13.20758,4.91051 1.80616,2.48348 2.48348,5.58782 1.97549,8.63572 -0.11289,0.50799 -0.22577,0.95953 -0.3951,1.46751 l -0.28221,0.90308 -0.7902,-0.56442 c -1.86261,-1.35462 -3.89454,-2.37059 -6.0958,-3.0479 l -0.56443,-0.16933 0.0564,-0.56443 c 0.0565,-0.79019 -0.16932,-1.63683 -0.62086,-2.31415 -0.90309,-1.29818 -2.48348,-1.8626 -4.00743,-1.4675 -0.33866,0.11288 -0.67731,0.22577 -0.95953,0.39509 l -15.46528,9.87746 c -0.79019,0.50799 -1.29818,1.24174 -1.4675,2.14482 -0.16933,0.90309 0.0564,1.86261 0.56443,2.59637 0.90307,1.29818 2.48347,1.8626 4.00742,1.4675 0.33866,-0.11288 0.67731,-0.22577 0.95953,-0.39509 l 5.92647,-3.78166 c 0.95952,-0.62087 2.03193,-1.07241 3.16079,-1.41107 5.02339,-1.29818 10.27256,0.67732 13.20757,4.91051 1.80617,2.48347 2.48348,5.58782 1.97549,8.63572 -0.50798,2.93502 -2.31414,5.58782 -4.85406,7.16822 l -15.52172,9.87746 c -0.95953,0.62086 -2.03194,1.07241 -3.16079,1.41106"
+       id="path6-6"
+       style="fill:#ffffff;stroke-width:0.564426" />
+  </g>
+</svg>
--- a/modules/desktop/icon.png
+++ b/modules/desktop/icon.png
--- a/modules/desktop/package.json
+++ b/modules/desktop/package.json
@ -0,0 +1,79 @@
+{
+	"name": "@tea/desktop",
+	"version": "0.0.0",
+	"private": true,
+	"scripts": {
+    "package": "pnpm build && electron-builder --config electron-builder.config.json",
+    "dev:package": "pnpm build && electron-builder --config electron-builder.config.json --dir",
+    "electron": "concurrently --kill-others \"vite dev\" \"electron src/electron.cjs\"",
+		"dev": "vite dev --port 8080",
+		"build": "vite build && cp build/app.html build/index.html",
+		"preview": "vite preview",
+		"unit:test": "vitest",
+		"coverage": "vitest run --coverage",
+		"test": "playwright test",
+		"check": "svelte-kit sync && svelte-check --tsconfig ./tsconfig.json",
+		"check:watch": "svelte-kit sync && svelte-check --tsconfig ./tsconfig.json --watch",
+		"lint": "prettier --plugin-search-dir . --check . && eslint .",
+		"format": "prettier --plugin-search-dir . --write ."
+	},
+	"devDependencies": {
+    "@sveltejs/adapter-node": "^1.0.0-next.101",
+    "@sveltejs/adapter-static": "^1.0.0-next.48",
+    "@sveltejs/kit": "^1.0.0-next.562",
+    "concurrently": "^6.5.1",
+    "electron": "^22.1.0",
+    "electron-builder": "^23.6.0",
+    "electron-reloader": "^1.2.3",
+    "sass": "^1.56.1",
+    "svelte": "^3.55.1",
+    "svelte-preprocess": "^5.0.1",
+    "vite": "^4.0.4",
+		"@playwright/experimental-ct-svelte": "^1.29.2",
+		"@playwright/test": "1.25.0",
+		"@sveltejs/adapter-auto": "^1.0.0",
+		"@tea/ui": "workspace:*",
+		"@testing-library/jest-dom": "^5.16.5",
+		"@testing-library/svelte": "^3.2.2",
+		"@types/testing-library__jest-dom": "^5.14.5",
+		"@typescript-eslint/eslint-plugin": "^5.27.0",
+		"@typescript-eslint/parser": "^5.27.0",
+		"autoprefixer": "^10.4.13",
+		"eslint": "^8.16.0",
+		"eslint-config-prettier": "^8.3.0",
+		"eslint-plugin-svelte3": "^4.0.0",
+		"jsdom": "^21.0.0",
+		"postcss": "^8.4.19",
+		"prettier": "^2.7.1",
+		"prettier-plugin-svelte": "^2.7.0",
+		"prettier-plugin-tailwindcss": "^0.2.0",
+		"svelte-check": "^2.8.0",
+		"svelte2tsx": "^0.5.20",
+		"tailwindcss": "^3.2.4",
+		"tslib": "^2.3.1",
+		"typescript": "^4.7.4",
+		"vitest": "^0.27.1"
+	},
+	"type": "module",
+	"dependencies": {
+    "electron-log": "^4.4.8",
+    "electron-serve": "^1.1.0",
+    "electron-window-state": "^5.0.3",
+		"@types/bcryptjs": "^2.4.2",
+		"@types/url-join": "^4.0.1",
+		"@vitest/coverage-c8": "^0.27.1",
+		"bcryptjs": "^2.4.3",
+		"buffer": "^6.0.3",
+		"fuse.js": "^6.6.2",
+		"lodash": "^4.17.21",
+		"lorem-ipsum": "^2.0.8",
+		"svelte-markdown": "^0.2.3",
+		"svelte-watch-resize": "^1.0.3",
+		"url-join": "^5.0.0"
+	},
+	"pnpm": {
+		"onlyBuiltDependencies": [
+			"@tea/ui"
+		]
+	}
+}
--- a/modules/desktop/pnpm-lock.yaml
+++ b/modules/desktop/pnpm-lock.yaml
--- a/modules/desktop/screenshot.png
+++ b/modules/desktop/screenshot.png
--- a/modules/desktop/src/app.html
+++ b/modules/desktop/src/app.html
@ -0,0 +1,17 @@
+<!DOCTYPE html>
+<html lang="en">
+  <head>
+    <meta charset="utf-8" />
+    <link rel="icon" href="/favicon.ico" />
+    <meta name="viewport" content="width=device-width, initial-scale=1" />
+    <script>
+        const ipc = require("electron").ipcRenderer;
+    </script>
+    %sveltekit.head%
+  </head>
+  <body>
+    <div id="svelte">
+        %sveltekit.body%
+    </div>
+  </body>
+</html>
--- a/modules/desktop/src/app.scss
+++ b/modules/desktop/src/app.scss
@ -0,0 +1,56 @@
+$primary: #ff3e00;
+
+:root {
+  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen, Ubuntu, Cantarell, "Open Sans", "Helvetica Neue", sans-serif;
+}
+
+.text-primary {
+  color: $primary;
+}
+
+.button {
+  padding: 10px 10px;
+  display: inline-block;
+  background-color: $primary;
+  color: white;
+  text-decoration: none;
+  border: none;
+}
+
+ /* The sidebar menu */
+.sidenav {
+  height: 100%;    /* Full-height: remove this if you want "auto" height */
+  width: 160px;    /* Set the width of the sidebar */
+  position: fixed; /* Fixed Sidebar (stay in place on scroll) */
+  z-index: 1;      /* Stay on top */
+  top: 0;          /* Stay at the top */
+  left: 0;
+  background-color: $primary;
+  overflow-x: hidden; /* Disable horizontal scroll */
+  padding-top: 20px;
+}
+
+.sidenav a {
+  padding: 6px 8px 6px 16px;
+  text-decoration: none;
+  font-size: 20px;
+  font-weight: bold;
+  color: white;
+  display: block;
+}
+
+.sidenav a:hover {
+  background-color: #f1f1f1;
+  color: $primary;
+}
+
+.main {
+  margin-left: 160px; /* Same as the width of the sidebar */
+  padding: 0px 10px;
+}
+
+/* On smaller screens, where height is less than 450px, change the style of the sidebar (less padding and a smaller font size) */
+@media screen and (max-height: 450px) {
+  .sidenav {padding-top: 15px;}
+  .sidenav a {font-size: 18px;}
+}
--- a/modules/desktop/src/electron.cjs
+++ b/modules/desktop/src/electron.cjs
@ -0,0 +1,65 @@
+// Modules to control application life and create native browser window
+const { app, BrowserWindow, ipcMain, shell, dialog } = require('electron')
+const path = require('path')
+
+let mainWindow;
+let deeplink;
+
+if (process.defaultApp) {
+  if (process.argv.length >= 2) {
+    app.setAsDefaultProtocolClient('electron-fiddle', process.execPath, [path.resolve(process.argv[1])])
+  }
+} else {
+    app.setAsDefaultProtocolClient('electron-fiddle')
+}
+
+const gotTheLock = app.requestSingleInstanceLock()
+
+if (!gotTheLock) {
+  app.quit()
+} else {
+  app.on('second-instance', (event, commandLine, workingDirectory) => {
+    // Someone tried to run a second instance, we should focus our window.
+    if (mainWindow) {
+      if (mainWindow.isMinimized()) mainWindow.restore()
+      mainWindow.focus()
+    }
+  })
+
+  // Create mainWindow, load the rest of the app, etc...
+  app.whenReady().then(() => {
+    createWindow()
+  })
+  
+  app.on('open-url', (event, url) => {
+    dialog.showErrorBox('Welcome Back', `You arrived from: ${url}`)
+    deeplink = url;
+  })
+}
+
+function createWindow () {
+  // Create the browser window.
+  mainWindow = new BrowserWindow({
+    width: 800,
+    height: 600,
+    webPreferences: {
+      preload: path.join(__dirname, 'preload.js'),
+    }
+  })
+//   const path = deeplink.replace('electron-fiddle://', '');
+  mainWindow.loadFile('index.html');
+}
+
+// Quit when all windows are closed, except on macOS. There, it's common
+// for applications and their menu bar to stay active until the user quits
+// explicitly with Cmd + Q.
+app.on('window-all-closed', function () {
+  if (process.platform !== 'darwin') app.quit()
+})
+
+// Handle window controls via IPC
+ipcMain.on('shell:open', () => {
+  const pageDirectory = __dirname.replace('app.asar', 'app.asar.unpacked')
+  const pagePath = path.join('file://', pageDirectory, 'index.html')
+  shell.openExternal(pagePath)
+})
--- a/modules/desktop/src/lib/Counter.svelte
+++ b/modules/desktop/src/lib/Counter.svelte
@ -0,0 +1,11 @@
+<script>
+  let count = 0;
+
+  const increment = () => {
+    count += 1;
+  };
+</script>
+
+<button class="button" on:click={increment}>
+  Clicks: {count}
+</button>
--- a/modules/desktop/src/lib/SideBar.svelte
+++ b/modules/desktop/src/lib/SideBar.svelte
@ -0,0 +1,11 @@
+<!-- Based on: https://www.w3schools.com/howto/howto_css_fixed_sidebar.asp -->
+
+<script>
+    import "../app.scss";
+</script>
+
+<div class="sidenav">
+    <a href="/page1">Page 1</a>
+    <a href="/page2">Page 2</a>
+    <a href="/page3">Page 3</a>
+</div>
--- a/modules/desktop/src/routes/+layout.js
+++ b/modules/desktop/src/routes/+layout.js
@ -0,0 +1 @@
+export const prerender = true;
--- a/modules/desktop/src/routes/+layout.svelte
+++ b/modules/desktop/src/routes/+layout.svelte
@ -0,0 +1,10 @@
+<script>
+  import "../app.scss";
+  import SideBar from "$lib/SideBar.svelte";
+</script>
+
+<SideBar />
+
+<div class="main">
+  <slot />
+</div>
--- a/modules/desktop/src/routes/+page.svelte
+++ b/modules/desktop/src/routes/+page.svelte
@ -0,0 +1,46 @@
+<script>
+  import Counter from "$lib/Counter.svelte";
+</script>
+
+<svelte:head>
+  <title>Svelte Template</title>
+</svelte:head>
+
+<main>
+  <h1 class="text-primary">Hello world!</h1>
+  <Counter />
+  <p>Visit <a href="https://svelte.dev">svelte.dev</a> to learn how to build Svelte apps. <i class="fas fa-heart fa-fw"></i></p>
+</main>
+
+<style lang="scss">
+  main {
+    text-align: center;
+    padding: 1em;
+    margin: 0 auto;
+  }
+
+  h1 {
+    text-transform: uppercase;
+    font-size: 4rem;
+    font-weight: 100;
+    line-height: 1.1;
+    margin: 4rem auto;
+    max-width: 14rem;
+  }
+
+  p {
+    max-width: 14rem;
+    margin: 2rem auto;
+    line-height: 1.35;
+  }
+
+  @media (min-width: 480px) {
+    h1 {
+      max-width: none;
+    }
+
+    p {
+      max-width: none;
+    }
+  }
+</style>
--- a/modules/desktop/src/routes/page1/+page.svelte
+++ b/modules/desktop/src/routes/page1/+page.svelte
@ -0,0 +1,13 @@
+<svelte:head>
+  <title>Page 1</title>
+</svelte:head>
+
+<h1 class="pagetitle">Page 1</h1>
+<p>This is the page 1</p>
+
+<div style="display: flex; justify-content: center;">
+  <a class="button" href="/">Home</a>
+  <a class="button" style="margin-left: 2px;" href="/page2">Page 2</a>
+  <a class="button" style="margin-left: 2px;" href="/page3">Page 3</a>
+</div>
+
--- a/modules/desktop/src/routes/page2/+page.svelte
+++ b/modules/desktop/src/routes/page2/+page.svelte
@ -0,0 +1,13 @@
+<svelte:head>
+  <title>Page 2</title>
+</svelte:head>
+
+<h1 class="pagetitle">Page 2</h1>
+<p>This is the page 2</p>
+
+<div style="display: flex; justify-content: center;">
+  <a class="button" style="margin-left: 2px;" href="/">Home</a>
+  <a class="button" style="margin-left: 2px;" href="/page1">Page 1</a>
+  <a class="button" style="margin-left: 2px;" href="/page3">Page 3</a>
+</div>
+
--- a/modules/desktop/src/routes/page3/+page.svelte
+++ b/modules/desktop/src/routes/page3/+page.svelte
@ -0,0 +1,13 @@
+<svelte:head>
+  <title>Page 3</title>
+</svelte:head>
+
+<h1 class="pagetitle">Page 3</h1>
+<p>This is the page 3</p>
+
+<div style="display: flex; justify-content: center;">
+  <a class="button" href="/">Home</a>
+  <a class="button" style="margin-left: 2px;" href="/page1">Page 1</a>
+  <a class="button" style="margin-left: 2px;" href="/page2">Page 2</a>
+</div>
+
--- a/modules/desktop/static/favicon.ico
+++ b/modules/desktop/static/favicon.ico
--- a/modules/desktop/static/robots.txt
+++ b/modules/desktop/static/robots.txt
@ -0,0 +1,3 @@
+# https://www.robotstxt.org/robotstxt.html
+User-agent: *
+Disallow:
--- a/modules/desktop/svelte.config.js
+++ b/modules/desktop/svelte.config.js
@ -0,0 +1,14 @@
+import preprocess from "svelte-preprocess"
+import adapter from "@sveltejs/adapter-static"
+//import node from "@sveltejs/adapter-node";
+
+//const dev = process.env.NODE_ENV == "development"
+
+export default {
+    kit: {
+        //adapter: node()
+        adapter: adapter(),
+    },
+
+    preprocess: preprocess(),
+}
--- a/modules/desktop/vite.config.js
+++ b/modules/desktop/vite.config.js
@ -0,0 +1,12 @@
+import { sveltekit } from "@sveltejs/kit/vite";
+
+/** @type {import('vite').UserConfig} */
+const config = {
+    plugins: [sveltekit()],
+
+    server: {
+        port: 3000
+    }
+};
+
+export default config;
--- a/pnpm-lock.yaml
+++ b/pnpm-lock.yaml