From 2ff408c8c803353ba731e49379f9d700f2d103f8 Mon Sep 17 00:00:00 2001
From: 0ko <0ko@noreply.codeberg.org>
Date: Mon, 13 Jan 2025 08:28:06 +0000
Subject: [PATCH] Apply switch redesign to more areas (#6542)

[skip ci] no relevant tests

Followup to https://codeberg.org/forgejo/forgejo/pulls/6459.

This PR applies the new switch design to areas where it is simple to apply and no other interventions are needed other than switching classes.

Also, added back the utility class `list-header-toggle` to a few places where it was removed in https://codeberg.org/forgejo/forgejo/pulls/6459. It is used for item reordering on smaller screens and it isn't actually needed in those areas (does nothing because of too wide elements), but it wasn't supposed to be removed.

The affected areas also include the menus in notifications. This is a followup to https://codeberg.org/forgejo/forgejo/pulls/3175 which should make the unchosen item look more obviously as an interactive element.

## Preview

|Area|Before|After|
|-|-|-|
|`projects/list.tmpl`|![](https://codeberg.org/attachments/e6977cbd-6fcc-400b-9f8a-1107b9ac5b54)|![](https://codeberg.org/attachments/8bd8ddb3-caf5-4f1b-aa3a-1942b9ea7f4a)|
|`repo/issue/navbar.tmp`||No visible change|
|`repo/issue/openclose.tmpl`||No visible change|
|`.../dashboard/issues.tmpl`|![](https://codeberg.org/attachments/5bc431aa-c522-4813-8d0f-b52e8c035dd0)|![](https://codeberg.org/attachments/a397be12-d8dc-434a-b109-2ba3521b36e6)|
|`.../dashboard/milestones.tmpl`|![](https://codeberg.org/attachments/211d76fc-c5e5-40f5-ade9-96e7bf56526e)|![](https://codeberg.org/attachments/760b0a3b-bd14-43ef-bb2b-21da426e91a3)|
|`.../notification_div.tmpl`|![](https://codeberg.org/attachments/822cfda7-e66d-47cf-9436-e20f392df2ce)|![](https://codeberg.org/attachments/07587fe5-454d-474c-8c39-e1331ff4deb5)|
|`.../notification_subscriptions.tmpl`|![](https://codeberg.org/attachments/960ac65a-f3a3-4385-b8fc-7bbf44c21bee)|![](https://codeberg.org/attachments/880bbcad-605b-4fbf-92e3-a0b270a40725)|

Reviewed-on: https://codeberg.org/forgejo/forgejo/pulls/6542
Reviewed-by: Otto <otto@codeberg.org>
Co-authored-by: 0ko <0ko@noreply.codeberg.org>
Co-committed-by: 0ko <0ko@noreply.codeberg.org>
---
 templates/projects/list.tmpl                                | 2 +-
 templates/repo/issue/navbar.tmpl                            | 2 +-
 templates/repo/issue/openclose.tmpl                         | 2 +-
 templates/user/dashboard/issues.tmpl                        | 2 +-
 templates/user/dashboard/milestones.tmpl                    | 2 +-
 templates/user/notification/notification_div.tmpl           | 2 +-
 templates/user/notification/notification_subscriptions.tmpl | 2 +-
 7 files changed, 7 insertions(+), 7 deletions(-)

diff --git a/templates/projects/list.tmpl b/templates/projects/list.tmpl
index b892cff996..5da2757748 100644
--- a/templates/projects/list.tmpl
+++ b/templates/projects/list.tmpl
@@ -1,6 +1,6 @@
 {{if and $.CanWriteProjects (not $.Repository.IsArchived)}}
 	<div class="tw-flex tw-justify-between tw-mb-4">
-		<div class="small-menu-items ui compact tiny menu list-header-toggle">
+		<div class="switch list-header-toggle">
 			<a class="item{{if not .IsShowClosed}} active{{end}}" href="?state=open&q={{$.Keyword}}">
 				{{svg "octicon-project-symlink" 16 "tw-mr-2"}}
 				{{ctx.Locale.PrettyNumber .OpenCount}}&nbsp;{{ctx.Locale.Tr "repo.issues.open_title"}}
diff --git a/templates/repo/issue/navbar.tmpl b/templates/repo/issue/navbar.tmpl
index 8310d3a33f..4874bf2ad4 100644
--- a/templates/repo/issue/navbar.tmpl
+++ b/templates/repo/issue/navbar.tmpl
@@ -1,4 +1,4 @@
-<div class="switch">
+<div class="switch list-header-toggle">
 	<a class="{{if .PageIsLabels}}active {{end}}item" href="{{.RepoLink}}/labels">{{ctx.Locale.Tr "repo.labels"}}</a>
 	<a class="{{if .PageIsMilestones}}active {{end}}item" href="{{.RepoLink}}/milestones">{{ctx.Locale.Tr "repo.milestones"}}</a>
 </div>
diff --git a/templates/repo/issue/openclose.tmpl b/templates/repo/issue/openclose.tmpl
index efe4fa6756..d93c7e01f5 100644
--- a/templates/repo/issue/openclose.tmpl
+++ b/templates/repo/issue/openclose.tmpl
@@ -1,4 +1,4 @@
-<div class="switch">
+<div class="switch list-header-toggle">
 	<a class="{{if eq .State "open"}}active {{end}}item" href="{{.OpenLink}}" data-test-name="open-issue-count">
 		{{if .PageIsMilestones}}
 			{{svg "octicon-milestone" 16 "tw-mr-2"}}
diff --git a/templates/user/dashboard/issues.tmpl b/templates/user/dashboard/issues.tmpl
index 09d282b029..2039bf44e3 100644
--- a/templates/user/dashboard/issues.tmpl
+++ b/templates/user/dashboard/issues.tmpl
@@ -4,7 +4,7 @@
 	<div class="ui container">
 		{{template "base/alert" .}}
 		<div class="list-header">
-			<div class="small-menu-items ui compact tiny menu list-header-toggle">
+			<div class="switch list-header-toggle">
 				<a class="item{{if not .IsShowClosed}} active{{end}}" href="?type={{$.ViewType}}&sort={{$.SortType}}&state=open&labels={{.SelectLabels}}&q={{$.Keyword}}&fuzzy={{.IsFuzzy}}">
 					{{svg "octicon-issue-opened" 16 "tw-mr-2"}}
 					{{ctx.Locale.PrettyNumber .IssueStats.OpenCount}}&nbsp;{{ctx.Locale.Tr "repo.issues.open_title"}}
diff --git a/templates/user/dashboard/milestones.tmpl b/templates/user/dashboard/milestones.tmpl
index 6b315eccd3..3d046110ae 100644
--- a/templates/user/dashboard/milestones.tmpl
+++ b/templates/user/dashboard/milestones.tmpl
@@ -35,7 +35,7 @@
 			</div>
 			<div class="flex-container-main content">
 				<div class="list-header">
-					<div class="small-menu-items ui compact tiny menu list-header-toggle">
+					<div class="switch list-header-toggle">
 						<a class="item{{if not .IsShowClosed}} active{{end}}" href="?repos=[{{range $.RepoIDs}}{{.}}%2C{{end}}]&sort={{$.SortType}}&state=open&q={{$.Keyword}}">
 							{{svg "octicon-milestone" 16 "tw-mr-2"}}
 							{{ctx.Locale.PrettyNumber .MilestoneStats.OpenCount}}&nbsp;{{ctx.Locale.Tr "repo.issues.open_title"}}
diff --git a/templates/user/notification/notification_div.tmpl b/templates/user/notification/notification_div.tmpl
index bf6a94410d..3340c83e63 100644
--- a/templates/user/notification/notification_div.tmpl
+++ b/templates/user/notification/notification_div.tmpl
@@ -2,7 +2,7 @@
 	<div class="ui container">
 		{{$notificationUnreadCount := call .NotificationUnreadCount}}
 		<div class="tw-flex tw-items-center tw-justify-between tw-mb-4">
-			<div class="ui secondary partial menu">
+			<div class="switch">
 				<a class="{{if eq .Status 1}}active {{end}}item" href="{{AppSubUrl}}/notifications?q=unread">
 					{{ctx.Locale.Tr "notification.unread"}}
 					<div class="notifications-unread-count ui label {{if not $notificationUnreadCount}}tw-hidden{{end}}">{{$notificationUnreadCount}}</div>
diff --git a/templates/user/notification/notification_subscriptions.tmpl b/templates/user/notification/notification_subscriptions.tmpl
index 0a3ae99b40..0b8193f797 100644
--- a/templates/user/notification/notification_subscriptions.tmpl
+++ b/templates/user/notification/notification_subscriptions.tmpl
@@ -2,7 +2,7 @@
 <div role="main" aria-label="{{.Title}}" class="page-content user notification">
 	<div class="ui container">
 		<div class="tw-flex tw-items-center tw-justify-between tw-mb-4">
-			<div class="ui secondary partial menu">
+			<div class="switch">
 				<a href="{{AppSubUrl}}/notifications/subscriptions" class="{{if eq .Status 1}}active {{end}}item">
 					{{ctx.Locale.Tr "notification.subscriptions"}}
 				</a>