More UI improvements

frontend/src/components/grid.svelte

@@ -105,9 +105,9 @@
 
 <style>
   .grid {
-    background-color: #fff;
     width: 100%;
     height: 100%;
+    background-color: #fff;
   }
   .grid.contained {
     border: 1px solid #ccc;
@@ -152,6 +152,8 @@
   button.toggle {
     color: inherit;
     padding: 0;
+    margin: 0;
+    display: contents;
   }
   button.toggle :global(svg) {
     width: 15px;

frontend/src/components/objectgrid.svelte

@@ -28,7 +28,6 @@
     }
     else {
       items = dissectObject(data);
-      console.log(items);
     }
   }
 
@@ -55,11 +54,13 @@
   }
 
   function dissectObject(object) {
-    return Object.entries(object).map(([ key, value ]) => {
+    const entries = [ ...Array.isArray(object) ? object.entries() : Object.entries(object) ];
+    return entries.map(([ key, value ]) => {
+      key = key + '';
       const type = getType(value);
       const child = { key, value, type };
 
-      if (type.startsWith('object')) {
+      if (type.startsWith('object') || type.startsWith('array')) {
         child.children = dissectObject(value);
       }
 

frontend/src/components/tabbar.svelte

@@ -44,6 +44,7 @@
     border-bottom: none;
     border-radius: 5px 5px 0 0;
     cursor: pointer;
+    background-color: #fff;
   }
   .tabs li.active button {
     color: #fff;