Comment box tweaks and SVG dropdown triangles (#13376)

* Comment box tweaks and SVG dropdown triangles

- Change all dropdown triangles to SVG
- Bring inline review comment box closer to regular comment boxes
- Enhance arc-green checkbox contrast
- Minor reaction tweaks
- Flexbox the diff file header

* remove a border

* fix type marker in arc-green

* add small code padding

* fix position regression and remove useless rules

Co-authored-by: Lauris BH <lauris@nix.lv>
Co-authored-by: techknowlogick <techknowlogick@gitea.io>

templates/user/dashboard/issues.tmpl

@@ -82,7 +82,7 @@
 						<div class="ui dropdown type jump item">
 							<span class="text">
 								{{.i18n.Tr "repo.issues.filter_sort"}}
-								<i class="dropdown icon"></i>
+								{{svg "octicon-triangle-down" 14 "dropdown icon"}}
 							</span>
 							<div class="menu">
 								<a class="{{if or (eq .SortType "latest") (not .SortType)}}active{{end}} item" href="{{$.Link}}?type={{$.ViewType}}&repos=[{{range $.RepoIDs}}{{.}}%2C{{end}}]&sort=latest&state={{$.State}}&q={{$.Keyword}}">{{.i18n.Tr "repo.issues.filter_sort.latest"}}</a>

templates/user/dashboard/milestones.tmpl

@@ -49,7 +49,7 @@
 					<div class="ui dropdown type jump item">
 						<span class="text">
 							{{.i18n.Tr "repo.issues.filter_sort"}}
-							<i class="dropdown icon"></i>
+							{{svg "octicon-triangle-down" 14 "dropdown icon"}}
 						</span>
 						<div class="menu">
 							<a class="{{if or (eq .SortType "closestduedate") (not .SortType)}}active{{end}} item" href="{{$.Link}}?repos=[{{range $.RepoIDs}}{{.}}%2C{{end}}]&sort=closestduedate&state={{$.State}}">{{.i18n.Tr "repo.milestones.filter_sort.closest_due_date"}}</a>

templates/user/dashboard/navbar.tmpl

@@ -11,7 +11,7 @@
 							{{if .ContextUser.Visibility.IsPrivate}}<div class="ui red tiny horizontal label">{{.i18n.Tr "org.settings.visibility.private_shortname"}}</div>{{end}}
 						</span>
 					{{end}}
-					<i class="dropdown icon"></i>
+					{{svg "octicon-triangle-down" 14 "dropdown icon"}}
 				</span>
 				<div class="context user overflow menu" tabindex="-1">
 					<div class="ui header">

templates/user/project.tmpl

@@ -17,7 +17,7 @@
 								<img class="ui mini image" src="{{.ContextUser.RelAvatarLink}}">
 								{{.ContextUser.ShortName 20}}
 							</span>
-							<i class="dropdown icon"></i>
+							{{svg "octicon-triangle-down" 14 "dropdown icon"}}
 							<div class="menu">
 								<div class="item" data-value="{{.SignedUser.ID}}" title="{{.SignedUser.Name}}">
 									<img class="ui mini image" src="{{.SignedUser.RelAvatarLink}}"> {{.SignedUser.ShortName 20}}

templates/user/settings/account.tmpl

@@ -56,7 +56,7 @@
 							<div class="field">
 								<div class="ui selection dropdown" tabindex="0">
 									<input name="preference" type="hidden" value="{{.EmailNotificationsPreference}}">
-									<i class="dropdown icon"></i>
+									{{svg "octicon-triangle-down" 14 "dropdown icon"}}
 									<div class="text">{{$.i18n.Tr "settings.email_notifications"}}</div>
 									<div class="menu">
 										<div data-value="enabled" class="{{if eq .EmailNotificationsPreference "enabled"}}active selected {{end}}item">{{$.i18n.Tr "settings.email_notifications.enable"}}</div>
@@ -144,7 +144,7 @@
 						<label for="ui">{{.i18n.Tr "settings.ui"}}</label>
 						<div class="ui selection dropdown" id="ui">
 							<input name="theme" type="hidden" value="{{.SignedUser.Theme}}">
-							<i class="dropdown icon"></i>
+							{{svg "octicon-triangle-down" 14 "dropdown icon"}}
 							<div class="text">
 								{{range $i,$a := .AllThemes}}
 									{{if eq $.SignedUser.Theme $a}}{{$a}}{{end}}

templates/user/settings/profile.tmpl

@@ -48,7 +48,7 @@
 						<label for="language">{{.i18n.Tr "settings.language"}}</label>
 						<div class="ui language selection dropdown" id="language">
 							<input name="language" type="hidden" value="{{.SignedUser.Language}}">
-							<i class="dropdown icon"></i>
+							{{svg "octicon-triangle-down" 14 "dropdown icon"}}
 							<div class="text">{{range .AllLangs}}{{if eq $.SignedUser.Language .Lang}}{{.Name}}{{end}}{{end}}</div>
 							<div class="menu">
 							{{range .AllLangs}}