From f0b39f253059c907f75c6c77933cfbd45df3aa68 Mon Sep 17 00:00:00 2001
From: Andrew Kingston <aptkingston@ssl-mail.com>
Date: Fri, 7 May 2021 13:17:49 +0100
Subject: [PATCH] Add small horiztonal padding to app list table view to
 improve text overflow

---
 .../builder/src/components/start/AppTableView.svelte     | 9 +++++----
 1 file changed, 5 insertions(+), 4 deletions(-)

diff --git a/packages/builder/src/components/start/AppTableView.svelte b/packages/builder/src/components/start/AppTableView.svelte
index 57ab1f00e6..1d4097efb8 100644
--- a/packages/builder/src/components/start/AppTableView.svelte
+++ b/packages/builder/src/components/start/AppTableView.svelte
@@ -44,7 +44,7 @@
           Locked by you
         {/if}
       </div>
-      <div class="actions">
+      <div>
         <Button on:click={() => openApp(app)} size="S" secondary>Open</Button>
         <ActionMenu align="right">
           <Icon hoverable slot="control" name="More" />
@@ -71,6 +71,10 @@
     align-items: center;
     gap: var(--spacing-xl);
     grid-template-columns: auto 1fr;
+    white-space: nowrap;
+    overflow: hidden;
+    text-overflow: ellipsis;
+    padding: 0 5px;
   }
   .preview {
     height: 40px;
@@ -99,7 +103,4 @@
   .status--open {
     background-color: var(--spectrum-global-color-green-600);
   }
-  .actions {
-    padding-right: 10px;
-  }
 </style>