fix: webui layout & sizing fixes

webui/src/components/display/BlobPreview.svelte

@@ -118,6 +118,7 @@
       {:else}
         <div class="image" class:loaded={loaded == address || !handled}>
           <img
+            class:loaded={loaded == address}
             alt="Thumbnail for {address}..."
             use:concurrentImage={`${api.apiUrl}/${
               types.mimeType?.includes("svg+xml") ? "raw" : "thumb"

webui/src/components/widgets/Gallery.svelte

@@ -127,7 +127,7 @@
   {#if sortedEntities.length}
     <div class="items">
       {#each sortedEntities as entity (entity)}
-        <div data-address={entity} use:observe>
+        <div data-address={entity} use:observe class="item">
           {#if visible.has(entity)}
             {#if thumbnails}
               <UpObjectCard
@@ -188,6 +188,10 @@
     align-items: stretch;
   }
 
+  .item {
+    min-width: 0;
+  }
+
   .message {
     text-align: center;
     margin: 0.5em;

webui/src/views/Browse.svelte

@@ -61,7 +61,11 @@
   $: updateTitle("Browse", identities.join(" / "));
 </script>
 
-<div class="browser" bind:this={root} class:single={addresses.length === 1 && detailMode}>
+<div
+  class="browser"
+  bind:this={root}
+  class:single={addresses.length === 1 && detailMode}
+>
   {#each addresses as address, index}
     <div class="column" data-index={index}>
       <BrowseColumn
@@ -106,7 +110,11 @@
     scroll-snap-align: center;
   }
 
-  .browser.single .column {
-    flex-grow: 1;
+  .browser.single {
+    justify-content: center;
+
+    .column {
+      flex-grow: 1;
+    }
   }
 </style>