updated ui/dist

ui/src/components/records/RecordFieldValue.svelte

@@ -136,4 +136,7 @@
         max-height: 100px;
         overflow: auto;
     }
+    .inline-flex {
+        max-width: 100%;
+    }
 </style>

ui/src/components/records/RecordInfo.svelte

@@ -15,7 +15,7 @@
 </script>
 
 <div class="record-info-excerpt">
-    <div class="content">
+    <div class="info-content">
         <RecordInfoContent {record} />
     </div>
 

ui/src/components/records/RecordInfoContent.svelte

@@ -63,7 +63,7 @@
         {/each}
         {#if expanded.length > 2}
             <span class="delimiter">|</span>
-            <small class="txt-hint">({expanded.length - 2} more)</small>
+            <small class="delimiter txt-hint">({expanded.length - 2} more)</small>
         {/if}
         {#if isMultiple}<span class="expand-end">{"]"}</span>{/if}
     {:else if field.type == "geoPoint"}

ui/src/components/records/RecordPreviewPanel.svelte

@@ -2,8 +2,6 @@
     import { addErrorToast } from "@/stores/toasts";
     import ApiClient from "@/utils/ApiClient";
     import OverlayPanel from "@/components/base/OverlayPanel.svelte";
-    import CopyIcon from "@/components/base/CopyIcon.svelte";
-    import FormattedDate from "@/components/base/FormattedDate.svelte";
     import RecordFieldValue from "@/components/records/RecordFieldValue.svelte";
 
     export let collection;

ui/src/scss/_base.scss

@@ -969,25 +969,34 @@ a.thumb:not(.thumb-active) {
     line-height: 18px;;
     padding-left: 1px; // for visual alignment with the new tab icon
     text-align: left;
-    .content {
+    overflow: hidden;
+    text-overflow: ellipsis;
+    white-space: nowrap;
+    .info-content {
         display: flex;
-        flex-wrap: wrap;
+        flex-wrap: nowrap;
         align-items: center;
-        gap: 5px;;
+        row-gap: 2px;
+        column-gap: 5px;
         width: auto;
         min-width: 0;
         text-align: left;
         white-space: normal;
         word-break: break-all;
         .txt {
-            max-width: 140px;
             overflow: hidden;
             white-space: nowrap;
             text-overflow: ellipsis;
+            .col-type-relation & {
+                max-width: 200px;
+            }
         }
     }
     .delimiter {
+        min-width: 0;
+        flex-shrink: 0;
         font-size: 0.8em;
+        white-space: nowrap;
         color: var(--txtDisabledColor);
     }
     .expand-start,