Chrome Local Files system tiles were sorted incorrectly

fixes #348

src/fileSystemConfig.ts

@@ -24,10 +24,11 @@ export function addLocalFilesystem(handle: FileSystemAPIHandle, key: string | nu
 
   // commit to app state
   globalStore.commit('addLocalFileSystem', { key: system.slug, handle: handle })
-  // console.log(globalStore.state.localFileHandles)
 
   // write it out to indexed-db so we have it on next startup
-  set('fs', globalStore.state.localFileHandles)
+  const sorted = [...globalStore.state.localFileHandles]
+  sorted.sort((a, b) => (a.handle.name < b.handle.name ? -1 : 1))
+  set('fs', sorted)
   return system.slug
 }
 

src/layout-manager/SplashPage.vue

@@ -245,11 +245,10 @@ export default defineComponent({
 
     localFileHandles(): any[] {
       // sort a copy of the array so we don't get an infinite loop
-      return this.$store.state.localFileHandles
-        .concat()
-        .sort((a: any, b: any) =>
-          parseInt(a.key.substring(2)) < parseInt(b.key.substring(2)) ? -1 : 1
-        )
+      return this.$store.state.localFileHandles.concat().sort((a: any, b: any) =>
+        // parseInt(a.key.substring(2)) < parseInt(b.key.substring(2)) ? -1 : 1
+        a.handle.name < b.handle.name ? -1 : 1
+      )
     },
   },
   methods: {
@@ -516,7 +515,7 @@ h2.splash-readme {
 .project-root {
   display: flex;
   flex-direction: column;
-  margin-top: 0.75rem;
+  margin-top: 0.5rem;
   padding: 0.5rem 0.5rem;
   background-color: #181818;
   border-left: 3px solid #29d09a;
@@ -543,10 +542,6 @@ h2.splash-readme {
 // .local {
 // }
 
-.mb1 {
-  margin-bottom: 1rem;
-}
-
 .pt1 {
   padding-top: 2.5rem;
 }
@@ -592,6 +587,7 @@ h2.splash-readme {
   grid-template-columns: repeat(auto-fit, 18rem);
   list-style: none;
   font-size: 0.9rem;
+  margin: 0.5rem 0 1rem 0;
 }
 
 .section-head {