Display archived labels specially when listing labels

options/locale/locale_en-US.ini

@@ -123,6 +123,8 @@ unpin = Unpin
 
 artifacts = Artifacts
 
+archived = Archived
+
 concept_system_global = Global
 concept_user_individual = Individual
 concept_code_repository = Repository
@@ -317,7 +319,6 @@ filter_by_team_repositories = Filter by team repositories
 feed_of = Feed of "%s"
 
 show_archived = Archived
-archived = Archived
 show_both_archived_unarchived = Showing both archived and unarchived
 show_only_archived = Showing only archived
 show_only_unarchived = Showing only unarchived

templates/repo/issue/filters.tmpl

@@ -29,7 +29,14 @@
 							<div class="divider"></div>
 						{{end}}
 						{{$previousExclusiveScope = $exclusiveScope}}
-						<a class="item label-filter-item" href="{{$.Link}}?q={{$.Keyword}}&type={{$.ViewType}}&sort={{$.SortType}}&state={{$.State}}&labels={{.QueryString}}&milestone={{$.MilestoneID}}&project={{$.ProjectID}}&assignee={{$.AssigneeID}}&poster={{$.PosterID}}" data-label-id="{{.ID}}">{{if .IsExcluded}}{{svg "octicon-circle-slash"}}{{else if .IsSelected}}{{if $exclusiveScope}}{{svg "octicon-dot-fill"}}{{else}}{{svg "octicon-check"}}{{end}}{{end}} {{RenderLabel $.Context .}}</a>
+						<a class="item label-filter-item gt-df gt-ac" {{if .IsArchived}}data-is-archived{{end}} href="{{$.Link}}?q={{$.Keyword}}&type={{$.ViewType}}&sort={{$.SortType}}&state={{$.State}}&labels={{.QueryString}}&milestone={{$.MilestoneID}}&project={{$.ProjectID}}&assignee={{$.AssigneeID}}&poster={{$.PosterID}}" data-label-id="{{.ID}}">{{if .IsExcluded}}{{svg "octicon-circle-slash"}}{{else if .IsSelected}}{{if $exclusiveScope}}{{svg "octicon-dot-fill"}}{{else}}{{svg "octicon-check"}}{{end}}{{end}}
+							{{RenderLabel $.Context .}}
+							{{if .IsArchived}}
+								<span class="archived-label gt-ml-auto gt-font-12 gt-p-2 gt-border-secondary gt-rounded gt-jc gt-cursor-default">
+									{{$.locale.Tr "archived"}}
+								</span>
+							{{end}}
+						</a>
 					{{end}}
 				</div>
 			</div>

templates/repo/issue/labels/label_list.tmpl

@@ -33,11 +33,6 @@
 		<li class="item">
 			<div class="label-title">
 				{{RenderLabel $.Context .}}
-				{{if not .ArchivedUnix.IsZero}}
-					<span class="gt-ml-3 gt-cursor-default gt-italic" data-tooltip-content="{{$.locale.Tr "repo.issues.label_archive_tooltip"}}">
-						{{$.locale.Tr "home.archived"}}
-					</span>
-				{{end}}
 				{{if .Description}}<br><small class="desc">{{.Description | RenderEmoji $.Context}}</small>{{end}}
 			</div>
 			<div class="label-issues">
@@ -47,14 +42,21 @@
 					<a class="open-issues" href="{{$.RepoLink}}/issues?labels={{.ID}}">{{svg "octicon-issue-opened"}} {{$.locale.Tr "repo.issues.label_open_issues" .NumOpenIssues}}</a>
 				{{end}}
 			</div>
-			<div class="label-operation">
-				{{if and (not $.PageIsOrgSettingsLabels) (not $.Repository.IsArchived) (or $.CanWriteIssues $.CanWritePulls)}}
-					<a class="edit-label-button" href="#" data-id="{{.ID}}" data-title="{{.Name}}" {{if .Exclusive}}data-exclusive{{end}} {{if gt .ArchivedUnix 0}}data-is-archived{{end}} data-num-issues="{{.NumIssues}}" data-description="{{.Description}}" data-color={{.Color}}>{{svg "octicon-pencil"}} {{$.locale.Tr "repo.issues.label_edit"}}</a>
-					<a class="delete-button" href="#" data-url="{{$.Link}}/delete" data-id="{{.ID}}">{{svg "octicon-trash"}} {{$.locale.Tr "repo.issues.label_delete"}}</a>
-				{{else if $.PageIsOrgSettingsLabels}}
-					<a class="edit-label-button" href="#" data-id="{{.ID}}" data-title="{{.Name}}" {{if .Exclusive}}data-exclusive{{end}} {{if gt .ArchivedUnix 0}}data-is-archived{{end}} data-num-issues="{{.NumIssues}}" data-description="{{.Description}}" data-color={{.Color}}>{{svg "octicon-pencil"}} {{$.locale.Tr "repo.issues.label_edit"}}</a>
-					<a class="delete-button" href="#" data-url="{{$.Link}}/delete" data-id="{{.ID}}">{{svg "octicon-trash"}} {{$.locale.Tr "repo.issues.label_delete"}}</a>
-				{{end}}
+			<div class="label-operation gt-df">
+			  {{if .IsArchived}}
+					<span class="archived-label gt-font-12 gt-p-2 gt-border-secondary gt-rounded gt-jc gt-cursor-default" data-tooltip-content="{{$.locale.Tr "repo.issues.label_archive_tooltip"}}">
+				  	{{$.locale.Tr "archived"}}
+					</span>
+			  {{end}}
+				<div class="gt-df gt-ml-auto">
+					{{if and (not $.PageIsOrgSettingsLabels) (not $.Repository.IsArchived) (or $.CanWriteIssues $.CanWritePulls)}}
+						<a class="edit-label-button" href="#" data-id="{{.ID}}" data-title="{{.Name}}" {{if .Exclusive}}data-exclusive{{end}} {{if gt .ArchivedUnix 0}}data-is-archived{{end}} data-num-issues="{{.NumIssues}}" data-description="{{.Description}}" data-color={{.Color}}>{{svg "octicon-pencil"}} {{$.locale.Tr "repo.issues.label_edit"}}</a>
+						<a class="delete-button" href="#" data-url="{{$.Link}}/delete" data-id="{{.ID}}">{{svg "octicon-trash"}} {{$.locale.Tr "repo.issues.label_delete"}}</a>
+					{{else if $.PageIsOrgSettingsLabels}}
+						<a class="edit-label-button" href="#" data-id="{{.ID}}" data-title="{{.Name}}" {{if .Exclusive}}data-exclusive{{end}} {{if gt .ArchivedUnix 0}}data-is-archived{{end}} data-num-issues="{{.NumIssues}}" data-description="{{.Description}}" data-color={{.Color}}>{{svg "octicon-pencil"}} {{$.locale.Tr "repo.issues.label_edit"}}</a>
+						<a class="delete-button" href="#" data-url="{{$.Link}}/delete" data-id="{{.ID}}">{{svg "octicon-trash"}} {{$.locale.Tr "repo.issues.label_delete"}}</a>
+					{{end}}
+				</div>
 			</div>
 		</li>
 		{{end}}
@@ -78,9 +80,15 @@
 					{{if .Description}}<br><small class="desc">{{.Description | RenderEmoji $.Context}}</small>{{end}}
 				</div>
 				<div class="label-issues">
-					<a class="open-issues" href="{{$.RepoLink}}/issues?labels={{.ID}}">{{svg "octicon-issue-opened"}} {{$.locale.Tr "repo.issues.label_open_issues" .NumOpenRepoIssues}}</a>
+					<a class="open-issues" {{if .IsArchived}}data-is-archived{{end}} href="{{$.RepoLink}}/issues?labels={{.ID}}">{{svg "octicon-issue-opened"}} {{$.locale.Tr "repo.issues.label_open_issues" .NumOpenRepoIssues}}</a>
+				</div>
+				<div class="label-operation">
+					{{if .IsArchived}}
+						<span class="archived-label gt-font-12 gt-p-2 gt-border-secondary gt-rounded gt-jc gt-cursor-default" data-tooltip-content="{{$.locale.Tr "repo.issues.label_archive_tooltip"}}">
+							{{$.locale.Tr "archived"}}
+						</span>
+					{{end}}
 				</div>
-				<div class="label-operation"></div>
 			</li>
 			{{end}}
 		{{end}}

web_src/css/repo/issue-label.css

@@ -30,7 +30,6 @@
 
 .issue-label-list .item .label-operation {
   width: 33%;
-  text-align: right;
 }
 
 .issue-label-list .item a {
@@ -42,3 +41,11 @@
 .issue-label-list .item.org-label {
   opacity: 0.7;
 }
+
+.archived-label {
+  display: inline-flex;
+  width: fit-content;
+  height: fit-content;
+  color: var(--color-text-light);
+  background: var(--color-button);
+}