use min-width instead of width

livingtongues · Mar 7, 2024 · f398460 · f398460
1 parent 644be58
commit f398460
Show file tree

Hide file tree

Showing 2 changed files with 35 additions and 1 deletion.
diff --git a/packages/site/src/routes/[dictionaryId]/entries/list/List.variants.ts b/packages/site/src/routes/[dictionaryId]/entries/list/List.variants.ts
@@ -9,6 +9,7 @@ export const viewports: Viewport[] = [
 
 export const variants: Variant<Component>[] = [
   {
+    name: 'entry with audio vs entry without audio',
     props: {
       entries: [
         {
@@ -29,4 +30,37 @@ export const variants: Variant<Component>[] = [
       dictionary: basic_mock_dictionary
     },
   },
+  {
+    name: 'entry with small amount of data vs entry with a big amount',
+    props: {
+      entries: [
+        {
+          id: '1',
+          lx: 'hi - I have audio',
+          gl: {
+            es: 'Hola, tengo audio´',
+            no: 'hei, jeg har lyd'
+          },
+          ps: ['adj', 'v'],
+          sfs: [
+            {
+              path: ''
+            }
+          ],
+          sdn: ['1', '1.3', '2']
+        },
+        {
+          id: '2',
+          lx: 'hi, I am here too',
+          sfs: [
+            {
+              path: ''
+            }
+          ],
+        },
+      ],
+      canEdit: true,
+      dictionary: basic_mock_dictionary
+    },
+  },
 ]
diff --git a/packages/site/src/routes/[dictionaryId]/entries/list/ListEntry.svelte b/packages/site/src/routes/[dictionaryId]/entries/list/ListEntry.svelte
@@ -29,7 +29,7 @@
   class="flex rounded shadow my-1 overflow-hidden items-stretch border-green-300"
   style="margin-right: 2px;">
   {#if entry.sound_files?.[0] || canEdit}
-    <Audio class="bg-gray-100 py-1.5 px-1 w-60px" {entry} {canEdit} context="list" />
+    <Audio class="bg-gray-100 py-1.5 px-1 min-w-60px" {entry} {canEdit} context="list" />
   {/if}
   <a
     href={'/' + dictionary.id + '/entry/' + entry.id}