From 3d109861ddf95846905143b4cf39129bf253161e Mon Sep 17 00:00:00 2001
From: silverwind <me@silverwind.io>
Date: Thu, 31 Aug 2023 07:01:01 +0200
Subject: [PATCH] Render code blocks in repo description (#26830)

Backtick syntax now works in repo description too. Also, I replaced the
CSS for this was a new single class, making it more flexible and not
dependent on a parent. Also, very slightly reduced font size from 16.8px
to 16px.

---------

Co-authored-by: wxiaoguang <wxiaoguang@gmail.com>
---
 modules/templates/util_render.go | 5 ++---
 templates/repo/home.tmpl         | 4 ++--
 web_src/css/base.css             | 2 +-
 web_src/css/repo.css             | 4 ----
 4 files changed, 5 insertions(+), 10 deletions(-)

diff --git a/modules/templates/util_render.go b/modules/templates/util_render.go
index d23103ce1b..ed6eae326a 100644
--- a/modules/templates/util_render.go
+++ b/modules/templates/util_render.go
@@ -108,10 +108,9 @@ func RenderCommitBody(ctx context.Context, msg, urlPrefix string, metas map[stri
 // Match text that is between back ticks.
 var codeMatcher = regexp.MustCompile("`([^`]+)`")
 
-// RenderCodeBlock renders "`…`" as highlighted "<code>" block.
-// Intended for issue and PR titles, these containers should have styles for "<code>" elements
+// RenderCodeBlock renders "`…`" as highlighted "<code>" block, intended for issue and PR titles
 func RenderCodeBlock(htmlEscapedTextToRender template.HTML) template.HTML {
-	htmlWithCodeTags := codeMatcher.ReplaceAllString(string(htmlEscapedTextToRender), "<code>$1</code>") // replace with HTML <code> tags
+	htmlWithCodeTags := codeMatcher.ReplaceAllString(string(htmlEscapedTextToRender), `<code class="inline-code-block">$1</code>`) // replace with HTML <code> tags
 	return template.HTML(htmlWithCodeTags)
 }
 
diff --git a/templates/repo/home.tmpl b/templates/repo/home.tmpl
index 202c8b8ff3..11dc47f555 100644
--- a/templates/repo/home.tmpl
+++ b/templates/repo/home.tmpl
@@ -6,9 +6,9 @@
 		{{template "repo/code/recently_pushed_new_branches" .}}
 		{{if and (not .HideRepoInfo) (not .IsBlame)}}
 		<div class="ui repo-description">
-			<div id="repo-desc">
+			<div id="repo-desc" class="gt-font-16">
 				{{$description := .Repository.DescriptionHTML $.Context}}
-				{{if $description}}<span class="description">{{$description}}</span>{{else if .IsRepositoryAdmin}}<span class="no-description text-italic">{{.locale.Tr "repo.no_desc"}}</span>{{end}}
+				{{if $description}}<span class="description">{{$description | RenderCodeBlock}}</span>{{else if .IsRepositoryAdmin}}<span class="no-description text-italic">{{.locale.Tr "repo.no_desc"}}</span>{{end}}
 				<a class="link" href="{{.Repository.Website}}">{{.Repository.Website}}</a>
 			</div>
 			{{if .RepoSearchEnabled}}
diff --git a/web_src/css/base.css b/web_src/css/base.css
index c865e5973e..7c65b6aaf1 100644
--- a/web_src/css/base.css
+++ b/web_src/css/base.css
@@ -454,7 +454,7 @@ a.label,
   background: var(--color-hover);
 }
 
-.issue-title code {
+.inline-code-block {
   padding: 2px 4px;
   border-radius: var(--border-radius-medium);
   background-color: var(--color-markup-code-block);
diff --git a/web_src/css/repo.css b/web_src/css/repo.css
index bf6f0a7b5e..94745ff4f5 100644
--- a/web_src/css/repo.css
+++ b/web_src/css/repo.css
@@ -236,10 +236,6 @@
   }
 }
 
-.repository.file.list #repo-desc {
-  font-size: 1.2em;
-}
-
 .repository.file.list .repo-path {
   word-break: break-word;
 }