From 597ac064c3cb5931bc98b3dea6d742e08cb9fc11 Mon Sep 17 00:00:00 2001
From: Xaver Maierhofer <xaver.maierhofer@xwissen.info>
Date: Mon, 13 May 2019 22:52:59 +0200
Subject: [PATCH] Style orgs list in user profile (#6911)

---
 public/css/index.css        |  2 ++
 public/less/_user.less      | 15 +++++++++++++++
 templates/user/profile.tmpl |  6 +++++-
 3 files changed, 22 insertions(+), 1 deletion(-)

diff --git a/public/css/index.css b/public/css/index.css
index a50fe43c8f3c..8e3e4293e53e 100644
--- a/public/css/index.css
+++ b/public/css/index.css
@@ -890,6 +890,8 @@ tbody.commit-list{vertical-align:baseline}
 .user.notification .octicon.blue{color:#2185d0}
 .user.link-account:not(.icon){padding-top:15px;padding-bottom:5px}
 .user.settings .iconFloat{float:left}
+.user-orgs{display:flex;flex-flow:row wrap;padding:0;margin:-3px!important}
+.user-orgs li{display:flex;border-bottom:0!important;padding:3px!important;width:20%;max-width:60px}
 .dashboard{padding-top:15px}
 .dashboard.feeds .context.user.menu,.dashboard.issues .context.user.menu{z-index:101;min-width:200px}
 .dashboard.feeds .context.user.menu .ui.header,.dashboard.issues .context.user.menu .ui.header{font-size:1rem;text-transform:none}
diff --git a/public/less/_user.less b/public/less/_user.less
index 4b9be472698f..635db83b4993 100644
--- a/public/less/_user.less
+++ b/public/less/_user.less
@@ -133,3 +133,18 @@
         }
     }
 }
+
+.user-orgs {
+    display: flex;
+    flex-flow: row wrap;
+    padding: 0;
+    margin: -3px !important;
+
+    li {
+        display: flex;
+        border-bottom: 0 !important;
+        padding: 3px !important;
+        width: 20%;
+        max-width: 60px;
+    }
+}
diff --git a/templates/user/profile.tmpl b/templates/user/profile.tmpl
index 6170c6d130e9..833de90b8c85 100644
--- a/templates/user/profile.tmpl
+++ b/templates/user/profile.tmpl
@@ -69,11 +69,15 @@
 							*/}}
 							{{if and .Orgs .HasOrgsVisible}}
 							<li>
+								<ul class="user-orgs">
 								{{range .Orgs}}
 									{{if (or .Visibility.IsPublic (and ($.SignedUser) (or .Visibility.IsLimited (and (.IsUserPartOfOrg $.SignedUserID) .Visibility.IsPrivate) ($.IsAdmin))))}}
-										<a href="{{.HomeLink}}"><img class="ui mini image poping up" src="{{.RelAvatarLink}}" data-content="{{.Name}}" data-position="top center" data-variation="tiny inverted"></a>
+									<li>
+										<a href="{{.HomeLink}}"><img class="ui image poping up" src="{{.RelAvatarLink}}" data-content="{{.Name}}" data-position="top center" data-variation="tiny inverted"></a>
+									</li>
 									{{end}}
 								{{end}}
+								</ul>
 							</li>
 							{{end}}
 							{{if and .IsSigned (ne .SignedUserName .Owner.Name)}}