fix

Author: wxiaoguang

templates/repo/issue/card.tmpl

@@ -68,6 +68,7 @@
 				<a target="_blank" href="{{$.Issue.Repo.Link}}/issues?labels={{.ID}}">{{ctx.RenderUtils.RenderLabel .}}</a>
 			{{end}}
 		</div>
+		<div class="tw-flex-1"></div>
 		<div class="issue-card-assignees">
 			{{range .Assignees}}
 				<a target="_blank" href="{{.HomeLink}}" data-tooltip-content="{{ctx.Locale.Tr "repo.projects.column.assigned_to"}} {{.Name}}">{{ctx.AvatarUtils.Avatar . 28}}</a>

templates/repo/issue/sidebar/label_list.tmpl

@@ -43,7 +43,7 @@
 		</div>
 	</div>
 
-	<div class="ui list labels-list tw-my-2 tw-flex tw-flex-wrap">
+	<div class="ui list labels-list">
 		<span class="item empty-list {{if $data.SelectedLabelIDs}}tw-hidden{{end}}">{{ctx.Locale.Tr "repo.issues.new.no_label"}}</span>
 		{{range $data.AllLabels}}
 			{{if .IsChecked}}

web_src/css/repo.css

@@ -77,6 +77,13 @@
   visibility: hidden;
 }
 
+.issue-sidebar-combo > .ui.list.labels-list {
+  display: flex;
+  flex-wrap: wrap;
+  overflow: hidden;
+  gap: 0.25em;
+}
+
 @media (max-width: 767.98px) {
   .issue-content-left,
   .issue-content-right {
@@ -1545,21 +1552,7 @@ td .commit-summary {
 }
 
 .labels-list {
-  display: contents; /* enable the list to break across multiple lines */
-  line-height: 16px;
-}
-
-.labels-list > * {
-  margin-right: .25rem;
-  margin-bottom: .25rem;
-}
-
-.labels-list > :last-child {
-  margin-right: 0;
-}
-
-#issue-list .labels-list > * {
-  margin: 0; /* gap from `.flex-item .flex-item-title` is in effect */
+  display: contents; /* let parent to layout, recommended to use flex gap */
 }
 
 .labels-list .label, .scope-parent > .label {

web_src/css/repo/issue-card.css

@@ -29,6 +29,7 @@
   display: flex;
   width: 100%;
   flex-wrap: wrap;
+  gap: 0.25em;
 }
 
 .issue-card-assignees {