some more routing fixes - css now loaded at runtime

packages/client/src/createApp.js

@@ -50,7 +50,11 @@ export const createApp = (
       onScreenSelected,
       frontendDefinition.appRootPath
     )
-    routeTo(currentUrl || window.location.pathname)
+    const fallbackPath = window.location.pathname.replace(
+      frontendDefinition.appRootPath,
+      ""
+    )
+    routeTo(currentUrl || fallbackPath)
   }
 
   const attachChildrenParams = stateManager => {

packages/client/src/render/screenRouter.js

@@ -2,7 +2,13 @@ import regexparam from "regexparam"
 import { writable } from "svelte/store"
 
 export const screenRouter = (screens, onScreenSelected, appRootPath) => {
-  const makeRootedPath = url => (appRootPath ? `${appRootPath}/${url}` : url)
+  const makeRootedPath = url => {
+    if (appRootPath) {
+      if (url) return `${appRootPath}${url.startsWith("/") ? "" : "/"}${url}`
+      return appRootPath
+    }
+    return url
+  }
 
   const routes = screens.map(s => makeRootedPath(s.route))
   let fallback = routes.findIndex(([p]) => p === "*")

packages/server/middleware/routers.js

@@ -231,8 +231,14 @@ module.exports = (config, app) => {
         await next()
       } else if (path.startsWith("/_shared/")) {
         await send(ctx, path.replace(`/_shared/`, ""), { root: ctx.sharedPath })
-      } else {
+      } else if (
+        path.endsWith(".js") ||
+        path.endsWith(".map") ||
+        path.endsWith(".css")
+      ) {
         await send(ctx, path, { root: ctx.publicPath })
+      } else {
+        await send(ctx, "/index.html", { root: ctx.publicPath })
       }
     })
     .use(async (ctx, next) => {

packages/server/utilities/builder/index.template.html

@@ -11,6 +11,8 @@
         html, body {
             height: 100%;
             width: 100%;
+            margin: 0px;
+            padding: 0px;
         }
     </style>
 
@@ -19,11 +21,11 @@
     {{ /each }}
 
     {{ each(options.screenStyles) }}
-    <link rel='stylesheet' href='{{ @this }}'>
+    <link rel='stylesheet' href='{{ appRootPath }}{{ @this }}'>
     {{ /each }}
 
     {{ if(options.pageStyle) }}
-    <link rel='stylesheet' href='{{ pageStyle }}'>
+    <link rel='stylesheet' href='{{ appRootPath }}{{ pageStyle }}'>
     {{ /if }}