Improve markup code preview rendering

Author: silverwind

templates/base/markup_codepreview.tmpl

@@ -1,7 +1,7 @@
 <div class="code-preview-container file-content">
 	<div class="code-preview-header">
-		<a href="{{.FullURL}}" class="muted" rel="nofollow">{{.FilePath}}</a>
-		{{$link := HTMLFormat `<a href="%s/src/commit/%s" rel="nofollow">%s</a>` .RepoLink .CommitID (.CommitID | ShortSha) -}}
+		<a href="{{.FullURL}}" rel="nofollow" class="tw-font-semibold">{{.FilePath}}</a>
+		{{$link := HTMLFormat `<a href="%s/src/commit/%s" class="muted tw-font-mono tw-text-text">%s</a>` .RepoLink .CommitID (.CommitID | ShortSha) -}}
 		{{- if eq .LineStart .LineStop -}}
 			{{ctx.Locale.Tr "repo.code_preview_line_in" .LineStart $link}}
 		{{- else -}}

web_src/css/markup/codepreview.css

@@ -5,6 +5,7 @@
 }
 
 .markup .code-preview-container .code-preview-header {
+  color: var(--color-text-light-1);
   border-bottom: 1px solid var(--color-secondary);
   padding: 0.5em;
   font-size: 12px;