From 04d7ced063f5892cd9e4f0f42f5ffaa017b608c6 Mon Sep 17 00:00:00 2001
From: silverwind <me@silverwind.io>
Date: Mon, 31 Jul 2023 00:46:53 +0200
Subject: [PATCH] De-emphasize issue sidebar buttons (#26171)

I find the colored buttons in the issue sidebar distracting, given that
they are not primary actions, I think we can de-colorize them.

Before:
<img width="285" alt="Screenshot 2023-07-26 at 19 42 22"
src="https://github.com/go-gitea/gitea/assets/115237/7e784805-4e01-4199-94bb-0538a0130264">
<img width="288" alt="Screenshot 2023-07-26 at 19 43 06"
src="https://github.com/go-gitea/gitea/assets/115237/3a89c661-e24a-4ebf-a585-d404d0a6a78a">
<img width="285" alt="Screenshot 2023-07-26 at 19 44 36"
src="https://github.com/go-gitea/gitea/assets/115237/c1aa8c13-6f41-4763-8149-d1c07cb4be5c">:

After:
<img width="286" alt="Screenshot 2023-07-26 at 19 42 04"
src="https://github.com/go-gitea/gitea/assets/115237/74d640c2-e0ab-4fef-87aa-9e788e9010e2">
<img width="285" alt="Screenshot 2023-07-26 at 19 42 51"
src="https://github.com/go-gitea/gitea/assets/115237/3b69976a-9aa4-4e1c-8df3-4168f4a9fcf9">
<img width="286" alt="Screenshot 2023-07-26 at 19 45 15"
src="https://github.com/go-gitea/gitea/assets/115237/897222fd-4df2-4d99-98eb-e5f8fb77c4d6">
---
 .../repo/issue/view_content/sidebar.tmpl      | 32 +++++++++++++------
 1 file changed, 22 insertions(+), 10 deletions(-)

diff --git a/templates/repo/issue/view_content/sidebar.tmpl b/templates/repo/issue/view_content/sidebar.tmpl
index c3a405d8557db..c89df8626a2a4 100644
--- a/templates/repo/issue/view_content/sidebar.tmpl
+++ b/templates/repo/issue/view_content/sidebar.tmpl
@@ -299,19 +299,28 @@
 						{{$.CsrfTokenHtml}}
 					</form>
 					{{if $.IsStopwatchRunning}}
-						<button class="ui fluid button issue-stop-time">{{.locale.Tr "repo.issues.stop_tracking"}}</button>
-						<button class="ui fluid negative button issue-cancel-time gt-mt-3">{{.locale.Tr "repo.issues.cancel_tracking"}}</button>
+						<button class="ui fluid button issue-stop-time">
+							{{svg "octicon-stopwatch" 16 "gt-mr-3"}}
+							{{.locale.Tr "repo.issues.stop_tracking"}}
+						</button>
+						<button class="ui fluid button issue-cancel-time gt-mt-3">
+							{{svg "octicon-trash" 16 "gt-mr-3"}}
+							{{.locale.Tr "repo.issues.cancel_tracking"}}
+						</button>
 					{{else}}
 						{{if .HasUserStopwatch}}
 							<div class="ui warning message">
 								{{.locale.Tr "repo.issues.tracking_already_started" (.OtherStopwatchURL|Escape) | Safe}}
 							</div>
 						{{end}}
-						<button class="ui fluid button issue-start-time" data-tooltip-content='{{.locale.Tr "repo.issues.start_tracking"}}'>{{.locale.Tr "repo.issues.start_tracking_short"}}</button>
+						<button class="ui fluid button issue-start-time" data-tooltip-content='{{.locale.Tr "repo.issues.start_tracking"}}'>
+							{{svg "octicon-stopwatch" 16 "gt-mr-3"}}
+							{{.locale.Tr "repo.issues.start_tracking_short"}}
+						</button>
 						<div class="ui mini modal issue-start-time-modal">
 							<div class="header">{{.locale.Tr "repo.issues.add_time"}}</div>
 							<div class="content">
-								<form method="post" id="add_time_manual_form" action="{{.Issue.Link}}/times/add" class="ui action input fluid">
+								<form method="post" id="add_time_manual_form" action="{{.Issue.Link}}/times/add" class="ui input fluid gt-gap-3">
 									{{$.CsrfTokenHtml}}
 									<input placeholder='{{.locale.Tr "repo.issues.add_time_hours"}}' type="number" name="hours">
 									<input placeholder='{{.locale.Tr "repo.issues.add_time_minutes"}}' type="number" name="minutes" class="ui compact">
@@ -322,7 +331,10 @@
 								<button class="ui red cancel button">{{.locale.Tr "repo.issues.add_time_cancel"}}</button>
 							</div>
 						</div>
-						<button class="ui fluid button green issue-add-time gt-mt-3" data-tooltip-content='{{.locale.Tr "repo.issues.add_time"}}'>{{.locale.Tr "repo.issues.add_time_short"}}</button>
+						<button class="ui fluid button issue-add-time gt-mt-3" data-tooltip-content='{{.locale.Tr "repo.issues.add_time"}}'>
+							{{svg "octicon-plus" 16 "gt-mr-3"}}
+							{{.locale.Tr "repo.issues.add_time_short"}}
+						</button>
 					{{end}}
 				</div>
 			</div>
@@ -381,7 +393,7 @@
 				<form class="ui fluid action input issue-due-form" action="{{AppSubUrl}}/{{PathEscape .Repository.Owner.Name}}/{{PathEscape .Repository.Name}}/issues/{{.Issue.Index}}/deadline" method="post" id="update-issue-deadline-form">
 					{{$.CsrfTokenHtml}}
 					<input required placeholder="{{.locale.Tr "repo.issues.due_date_form"}}" {{if gt .Issue.DeadlineUnix 0}}value="{{.Issue.DeadlineUnix.Format "2006-01-02"}}"{{end}} type="date" name="deadlineDate" id="deadlineDate">
-					<button class="ui green icon button">
+					<button class="ui icon button">
 						{{if ne .Issue.DeadlineUnix 0}}
 							{{svg "octicon-pencil"}}
 						{{else}}
@@ -417,7 +429,7 @@
 					{{range .BlockingDependencies}}
 						<div class="item dependency{{if .Issue.IsClosed}} is-closed{{end}} gt-df gt-ac gt-sb">
 							<div class="item-left gt-df gt-jc gt-fc gt-f1">
-								<a class="title" href="{{.Issue.Link}}" data-tooltip-content="#{{.Issue.Index}} {{.Issue.Title | RenderEmoji $.Context}}">
+								<a class="title muted" href="{{.Issue.Link}}" data-tooltip-content="#{{.Issue.Index}} {{.Issue.Title | RenderEmoji $.Context}}">
 									#{{.Issue.Index}} {{.Issue.Title | RenderEmoji $.Context}}
 								</a>
 								<div class="text small">
@@ -449,7 +461,7 @@
 					{{range .BlockedByDependencies}}
 						<div class="item dependency{{if .Issue.IsClosed}} is-closed{{end}} gt-df gt-ac gt-sb">
 							<div class="item-left gt-df gt-jc gt-fc gt-f1">
-								<a class="title" href="{{.Issue.Link}}" data-tooltip-content="#{{.Issue.Index}} {{.Issue.Title | RenderEmoji $.Context}}">
+								<a class="title muted" href="{{.Issue.Link}}" data-tooltip-content="#{{.Issue.Index}} {{.Issue.Title | RenderEmoji $.Context}}">
 									#{{.Issue.Index}} {{.Issue.Title | RenderEmoji $.Context}}
 								</a>
 								<div class="text small">
@@ -507,7 +519,7 @@
 								<input type="text" class="search">
 								<div class="default text">{{.locale.Tr "repo.issues.dependency.add"}}</div>
 							</div>
-							<button class="ui green icon button">
+							<button class="ui icon button">
 								{{svg "octicon-plus"}}
 							</button>
 						</div>
@@ -643,7 +655,7 @@
 				</form>
 			</div>
 		</div>
-		<button class="gt-mt-2 fluid ui show-modal button negative" data-modal="#delete">
+		<button class="gt-mt-2 fluid ui show-modal button" data-modal="#delete">
 			{{svg "octicon-trash"}}
 			{{.locale.Tr "repo.issues.delete"}}
 		</button>