Fit UI for the new stuff

templates/user/settings/appearance.tmpl

@@ -7,9 +7,26 @@
 		</h4>
 		<div class="ui attached segment">
 			<div class="ui email list">
+				{{$theme := index .AllThemes $.SignedUser.Theme}}
+				{{if $theme.Author}}
 					<div class="item">
+						<p>
+							<strong>{{$theme.Name}}</strong>
+							by <em><a href="{{$theme.Url}}">{{$theme.Author}}</a></em> {{if $theme.Verified}}<span data-tooltip-content="{{ctx.Locale.Tr "settings.theme_verified"}}">{{svg "octicon-verified" 16 "dropdown icon"}}</span>{{end}}
+						</p>
+						{{if $theme.Description}}
+							<p><em>"{{$theme.Description}}"</em></p>
+						{{end}}
+					</div>
+
+					<div class="item tw-mb-auto">
 						{{ctx.Locale.Tr "settings.theme_desc"}}
 					</div>
+				{{else}}
+					<div class="item tw-mb-4">
+						{{ctx.Locale.Tr "settings.theme_desc"}}
+					</div>
+				{{end}}
 
 				<form class="ui form" action="{{.Link}}/theme" method="post">
 					{{.CsrfTokenHtml}}
@@ -20,14 +37,24 @@
 								{{svg "octicon-triangle-down" 14 "dropdown icon"}}
 								<div class="text">
 									{{- range $i,$a := .AllThemes -}}
-									{{if eq $.SignedUser.Theme $a}}{{call $.ThemeName $a}}{{end}}
+										{{if eq $.SignedUser.Theme $i}}{{$a.Name}}{{end}}
 									{{- end -}}
 								</div>
 
 								<div class="menu">
 								{{range $i,$a := .AllThemes}}
-								<div class="item{{if eq $.SignedUser.Theme $a}} active selected{{end}}" data-value="{{$a}}">
+									<div class="item{{if eq $.SignedUser.Theme $i}} active selected{{end}} tw-flex" data-value="{{$i}}">
-									{{call $.ThemeName $a}}
+										{{$a.Name}}
+										{{if $a.Verified}}
+											<span data-tooltip-content="{{ctx.Locale.Tr "settings.theme_verified"}}">{{svg "octicon-verified" 16 "dropdown icon"}}</span>
+										{{end}}
+										{{if eq $a.Scheme "auto"}}
+											<span data-tooltip-content="{{ctx.Locale.Tr "settings.theme_auto"}}">{{svg "octicon-sync" 16 "dropdown icon"}}</span>
+										{{else if eq $a.Scheme "dark"}}
+											<span data-tooltip-content="{{ctx.Locale.Tr "settings.theme_dark"}}">{{svg "octicon-moon" 16 "dropdown icon"}}</span>
+										{{else if eq $a.Scheme "light"}}
+											<span data-tooltip-content="{{ctx.Locale.Tr "settings.theme_light"}}">{{svg "octicon-sun" 16 "dropdown icon"}}</span>
+										{{end}}
 									</div>
 								{{end}}
 								</div>