From c4c4151f7d7a6aa18b354ae45c6ed93570d5de77 Mon Sep 17 00:00:00 2001
From: silverwind <me@silverwind.io>
Date: Sat, 17 Dec 2022 02:58:57 +0100
Subject: [PATCH] Fix margin and alignment in dashboard repolist (#22120)

Seems this has recently regressed, previously, there was a significant
whitespace between icon and text, but it seems to be gone, so I added
the margin and also vertically aligned the icon because it was slightly
misaligned.

Before:
<img width="419" alt="Screenshot 2022-12-13 at 20 03 51"
src="https://user-images.githubusercontent.com/115237/207422938-7c45110c-f73e-4344-afc8-c072266d1f95.png">

After:
<img width="419" alt="image"
src="https://user-images.githubusercontent.com/115237/207447579-95525405-574d-4ca8-84ba-d8a9af50015a.png">

Co-authored-by: KN4CK3R <admin@oldschoolhack.me>
---
 templates/user/dashboard/repolist.tmpl | 6 +++---
 web_src/less/_dashboard.less           | 6 +++++-
 2 files changed, 8 insertions(+), 4 deletions(-)

diff --git a/templates/user/dashboard/repolist.tmpl b/templates/user/dashboard/repolist.tmpl
index 620cc322f..9d0ea01ec 100644
--- a/templates/user/dashboard/repolist.tmpl
+++ b/templates/user/dashboard/repolist.tmpl
@@ -128,9 +128,9 @@
 				<ul class="repo-owner-name-list">
 					<li v-for="repo in repos" :class="{'private': repo.private || repo.internal}">
 						<a class="repo-list-link df ac sb" :href="repo.html_url">
-							<div class="text truncate item-name f1">
-								<component v-bind:is="repoIcon(repo)" size="16"></component>
-								<strong>${repo.full_name}</strong>
+							<div class="item-name df ac f1 mr-2">
+								<component v-bind:is="repoIcon(repo)" size="16" class="mr-2"></component>
+								<div class="text bold truncate ml-1">${repo.full_name}</div>
 								<span v-if="repo.archived">
 									{{svg "octicon-archive" 16 "ml-2"}}
 								</span>
diff --git a/web_src/less/_dashboard.less b/web_src/less/_dashboard.less
index 4ba0788af..4af55f2d2 100644
--- a/web_src/less/_dashboard.less
+++ b/web_src/less/_dashboard.less
@@ -188,7 +188,11 @@
     }
 
     .repo-owner-name-list .item-name {
-      max-width: 70%;
+      min-width: 0;
+    }
+
+    .repo-owner-name-list .item-name svg {
+      min-width: 16px;
     }
   }
 }