minor changes for build

Author: Git002

package-lock.json

@@ -7,6 +7,7 @@
     "dev": "vite dev",
     "build": "vite build",
     "preview": "vite preview",
+    "deploy": "gh-pages -d build -t true",
     "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 .",
@@ -25,6 +26,7 @@
     "@types/node": "^20.14.12",
     "@types/yaireo__tagify": "^4.24.0",
     "autoprefixer": "^10.4.19",
+    "gh-pages": "^6.1.1",
     "postcss": "^8.4.38",
     "prettier": "^3.3.2",
     "prettier-plugin-svelte": "^3.2.4",

package.json

@@ -59,13 +59,13 @@
     {#if showRadiusSwitch}
       <MiniInputBar
         id={'border-top-left-radius'}
-        Icon={'/Icons/Border/corner.svg'}
+        Icon={'Icons/Border/corner.svg'}
         value={$clickedElementStyle?.borderTopLeftRadius}
         on:blur={applyChanges}
       />
       <MiniInputBar
         id={'border-top-right-radius'}
-        Icon={'/Icons/Border/corner.svg'}
+        Icon={'Icons/Border/corner.svg'}
         rowReverse
         rotateIcon={90}
         value={$clickedElementStyle?.borderTopRightRadius}
@@ -92,14 +92,14 @@
     {#if showRadiusSwitch}
       <MiniInputBar
         id={'border-bottom-left-radius'}
-        Icon={'/Icons/Border/corner.svg'}
+        Icon={'Icons/Border/corner.svg'}
         rotateIcon={270}
         value={$clickedElementStyle?.borderBottomLeftRadius}
         on:blur={applyChanges}
       />
       <MiniInputBar
         id={'border-bottom-right-radius'}
-        Icon={'/Icons/Border/corner.svg'}
+        Icon={'Icons/Border/corner.svg'}
         rowReverse
         rotateIcon={180}
         value={$clickedElementStyle?.borderBottomRightRadius}

src/lib/PropertyComponents/Border.svelte

@@ -3,8 +3,6 @@
   import { storePopup, initializeStores } from '@skeletonlabs/skeleton';
   import { Toast } from '@skeletonlabs/skeleton';
 
-  export const ssr = false;
-
   storePopup.set({ computePosition, autoUpdate, offset, shift, flip, arrow });
 
   initializeStores();

src/routes/+layout.svelte

@@ -0,0 +1,3 @@
+export const ssr = false;
+export const prerender = true;
+export const trailingSlash = 'always';

src/routes/+layout.ts

@@ -55,7 +55,7 @@
 >
   <div class="flex flex-row items-center">
     <button class="rounded-full py-[8px] px-[8px] bg-[#393a3c]">
-      <object data="../Icons/Header/menu.svg" title="" style="pointer-events: none;" />
+      <object data="Icons/Header/menu.svg" title="" style="pointer-events: none;" />
     </button>
   </div>
 
@@ -70,7 +70,7 @@
       class="font-sans text-[12px] font-semibold tracking-wide text-center text-[#ebebeb] bg-[#cf672b] rounded-md px-[10px] hover:bg-[#d46a2c] inline-flex items-center gap-[8px]"
       on:click={exportCode}
     >
-      <object data="../Icons/Header/export.svg" title="" style="pointer-events: none;" /> Export
+      <object data="Icons/Header/export.svg" title="" style="pointer-events: none;" /> Export
     </button>
   </div>
 </div>

src/routes/Header.svelte

@@ -13,10 +13,13 @@ const config = {
       // these options are set automatically — see below
       pages: 'build',
       assets: 'build',
-      fallback: '200.html',
+      fallback: 'index.html',
       precompress: false,
       strict: true
-    })
+    }),
+    paths: {
+      base: process.env.NODE_ENV === 'production' ? '/Visually' : ''
+    }
   },
 
   onwarn: (warning, handler) => {