From 7064e059dd1f9efaff5e6415da0c220d1a64777d Mon Sep 17 00:00:00 2001
From: Jan Keromnes <janx@linux.com>
Date: Wed, 13 Oct 2021 08:48:17 +0000
Subject: [PATCH] [projects] Fix Project card bottom layout

Co-authored-by: George Tsiolis <tsiolis.g@gmail.com>
---
 components/dashboard/src/projects/Projects.tsx | 14 ++++++--------
 1 file changed, 6 insertions(+), 8 deletions(-)

diff --git a/components/dashboard/src/projects/Projects.tsx b/components/dashboard/src/projects/Projects.tsx
index 51ba0215cd5d85..addf02882b256e 100644
--- a/components/dashboard/src/projects/Projects.tsx
+++ b/components/dashboard/src/projects/Projects.tsx
@@ -158,16 +158,14 @@ export default function () {
                         </div>
                         <div className="h-10 px-4 border rounded-b-xl dark:border-gray-800 bg-gray-100 border-gray-100 dark:bg-gray-800">
                             {lastPrebuilds.get(p.id)
-                                ? (<div className="flex flex-row h-full text-sm justify-between">
-                                    <Link to={`/${teamOrUserSlug}/${p.name}/${lastPrebuilds.get(p.id)?.info?.id}`} className="flex my-auto items-center group space-x-2">
+                                ? (<div className="flex flex-row h-full text-sm space-x-4">
+                                    <Link to={`/${teamOrUserSlug}/${p.name}/${lastPrebuilds.get(p.id)?.info?.id}`} className="flex-grow flex items-center group space-x-2 truncate">
                                         {prebuildStatusIcon(lastPrebuilds.get(p.id))}
-                                        <div className="font-semibold text-gray-500 dark:text-gray-400 truncate w-24" title={lastPrebuilds.get(p.id)?.info?.branch}>{lastPrebuilds.get(p.id)?.info?.branch}</div>
-                                        <span className="mx-1 text-gray-400 dark:text-gray-600">·</span>
-                                        <div className="text-gray-400 dark:text-gray-500 flex-grow hover:text-gray-800 dark:hover:text-gray-300">{moment(lastPrebuilds.get(p.id)?.info?.startedAt).fromNow()}</div>
-                                    </Link>
-                                    <Link to={`/${teamOrUserSlug}/${p.name}/prebuilds`} className="my-auto group">
-                                        <div className="flex my-auto text-gray-400 flex-grow text-right group-hover:text-gray-600 dark:hover:text-gray-300">View All &rarr;</div>
+                                        <div className="font-semibold text-gray-500 dark:text-gray-400 truncate" title={lastPrebuilds.get(p.id)?.info?.branch}>{lastPrebuilds.get(p.id)?.info?.branch}</div>
+                                        <span className="flex-shrink-0 mx-1 text-gray-400 dark:text-gray-600">·</span>
+                                        <div className="flex-shrink-0 text-gray-400 dark:text-gray-500 group-hover:text-gray-800 dark:group-hover:text-gray-300">{moment(lastPrebuilds.get(p.id)?.info?.startedAt).fromNow()}</div>
                                     </Link>
+                                    <Link to={`/${teamOrUserSlug}/${p.name}/prebuilds`} className="flex-shrink-0 flex items-center text-gray-400 hover:text-gray-600 dark:hover:text-gray-300">View All &rarr;</Link>
                                 </div>)
                                 : (<div className="flex h-full text-md">
                                     <p className="my-auto ">No recent prebuilds</p>