Repository: Showed the name, Watch, Fork and Star only on the Code home

src/build-output.test.ts

@@ -318,6 +318,8 @@ describe("Forgejo 15 native integration", () => {
     "repo/global_header.tmpl",
     "repo/header.tmpl",
     "repo/home.tmpl",
+    "repo/home_header.tmpl",
+    "repo/empty.tmpl",
     "repo/home_sidebar_bottom.tmpl",
     "repo/home_sidebar_top.tmpl",
     "repo/view_content.tmpl",
@@ -476,9 +478,23 @@ describe("Forgejo 15 native integration", () => {
     expect(repoContentStyle).toContain(".repo-code-actions > li > a:hover");
   });
 
+  it("shows the repository title row only on the code home, as GitHub does", () => {
+    const read = (...parts: string[]) => fs.readFileSync(path.join(ROOT_DIR, "templates", ...parts), "utf-8");
+
+    expect(read("repo", "header.tmpl")).not.toContain("<");
+    expect(read("repo", "home.tmpl")).toContain('{{template "repo/home_header" .}}');
+    expect(read("repo", "empty.tmpl")).toContain('{{template "repo/home_header" .}}');
+    for (const page of [
+      ["repo", "release", "list.tmpl"],
+      ["repo", "tag", "list.tmpl"],
+      ["repo", "diff", "compare.tmpl"],
+    ])
+      expect(read(...page)).not.toContain('template "repo/header"');
+  });
+
   it("matches GitHub's repository About, visibility, and code-search details", () => {
     const headerStyle = fs.readFileSync(path.join(ROOT_DIR, "styles", "templates", "repo", "header.ts"), "utf-8");
-    const headerTemplate = fs.readFileSync(path.join(ROOT_DIR, "templates", "repo", "header.tmpl"), "utf-8");
+    const headerTemplate = fs.readFileSync(path.join(ROOT_DIR, "templates", "repo", "home_header.tmpl"), "utf-8");
     const repoContentStyle = fs.readFileSync(
       path.join(ROOT_DIR, "styles", "templates", "repo", "view_content.ts"),
       "utf-8"
@@ -597,9 +613,9 @@ describe("Forgejo 15 native integration", () => {
     expect(diffBoxTemplate).toContain(
       "const diffTreeVisible = localStorage?.getItem('diff_file_tree_visible') !== 'false';"
     );
-    expect(commitPageStyle).toContain("> .repository-content-header");
     const diffViewStyle = fs.readFileSync(path.join(ROOT_DIR, "styles", "components", "repo", "diff_view.ts"), "utf8");
     expect(diffViewStyle).toContain("min-height: 40px;");
+    expect(commitPageStyle).not.toContain("repository-content-header");
     expect(diffBoxTemplate).toContain('template "repo/diff/file_header"');
     expect(commitPageTemplate).toContain('template "repo/diff/change_summary"');
   });

src/repo-mirror.test.ts

@@ -95,7 +95,7 @@ describe("mirror badge disclosure", () => {
 
   it("keeps native mirror address sanitization, visibility precedence and relative sync time", () => {
     const template = readFileSync(new URL("../templates/repo/mirror_badge.tmpl", import.meta.url), "utf8");
-    const header = readFileSync(new URL("../templates/repo/header.tmpl", import.meta.url), "utf8");
+    const header = readFileSync(new URL("../templates/repo/home_header.tmpl", import.meta.url), "utf8");
     expect(header).toContain('{{if $.PullMirror}}\n\t\t\t\t\t\t{{template "repo/mirror_badge" $}}');
     expect(header).not.toContain('ctx.Locale.Tr "repo.mirror_from"');
     expect(template).toContain("MirrorRemoteAddress .Context .PullMirror");

styles/pages/projects.css

@@ -1,10 +1,7 @@
 /* Project board in GitHub's layout, and the side panel that opens a card's issue. Kept as a page stylesheet, outside
    the size-limited theme files. */
 
-/* Page: GitHub shows a project without the repository header, at full width. */
-.page-content.repository.github-project-page .repository-content-header {
-  display: none;
-}
+/* Page: GitHub shows a project at full width. */
 .full.height > .page-content.github-project-page {
   margin-top: 0;
   padding-top: 0;
@@ -437,7 +434,6 @@
 .github-embedded #navbar-drawer,
 .github-embedded .repository-tab-nav,
 .github-embedded .secondary-nav,
-.github-embedded .repository-content-header,
 .github-embedded .page-footer {
   display: none !important;
 }

styles/pages/releases.css

@@ -1,8 +1,5 @@
 /* Releases, tags and the release form. Kept as a page stylesheet, outside the size-limited theme files. */
 
-.page-content.repository.github-releases .repository-content-header {
-  display: none;
-}
 .page-content.repository.github-releases > .ui.container {
   box-sizing: border-box;
   max-width: calc(100% - 32px);
@@ -17,7 +14,7 @@
   gap: 16px;
   justify-content: space-between;
   margin: 0 0 32px;
-  padding: 24px 0;
+  padding: 0 0 24px;
 }
 .github-release-actions {
   align-items: center;
@@ -470,13 +467,13 @@
     > .ui.container {
       max-width: calc(100% - 32px);
       width: calc(100% - 32px) !important;
-      margin: 0 auto !important;
+      margin: 24px auto 0 !important;
       padding: 0;
     }
     .github-release-toolbar {
       gap: 8px;
       margin: 0 14px 16px;
-      padding: 24px 0 16px;
+      padding: 0 0 16px;
     }
     .github-release-content {
       display: block;
@@ -635,9 +632,6 @@
   }
 }
 /* New and edit release: GitHub's form page, on Forgejo's own template. */
-.page-content.repository.new.release .repository-content-header {
-  display: none;
-}
 .page-content.repository.new.release {
   > .ui.container {
     box-sizing: border-box;
@@ -711,9 +705,6 @@
     font-weight: 500;
   }
 }
-.page-content.repository.github-tags .repository-content-header {
-  display: none;
-}
 .page-content.repository.github-tags > .ui.container {
   box-sizing: border-box;
   max-width: calc(100% - 32px);
@@ -726,7 +717,7 @@
   display: flex;
   justify-content: space-between;
   margin-bottom: 16px;
-  padding: 24px 0;
+  padding: 0 0 24px;
 }
 .github-tags-search {
   width: 248px;

styles/templates/repo/commit_page.ts

@@ -21,10 +21,6 @@ import { css, cssCombine, otherThemeVars, themeVars } from "@lutinglt/gitea-gith
 
 const commitPage = css`
   .page-content.repository.diff.commit-page {
-    > .repository-content-header {
-      display: none;
-    }
-
     > .commit-page-container.ui.container.fluid.padded {
       margin: 0;
       max-width: none;

styles/templates/repo/header.ts

@@ -165,6 +165,12 @@ const repositoryHeader = css`
     margin: -1px 0 0;
   }
 
+  /* GitHub starts a repository page 24px below the tabs. Same specificity as Forgejo's 16px rule, so page layouts such
+     as the sidebar still set their own. */
+  .page-content.repository > :first-child:where(:not(.secondary-nav)) {
+    margin-top: 24px;
+  }
+
   .page-content.repository > .repository-content-header {
     border-bottom: 0;
     margin-bottom: 24px;

templates/repo/diff/compare.tmpl

@@ -2,7 +2,6 @@
 {{/* Forgejo 17 compare.tmpl, laid out like GitHub's "Compare changes": centred container, the create box with its text and
      the button on the right, and the equal-branches notice with a disabled button. */}}
 <div role="main" aria-label="{{.Title}}" class="page-content repository diff github-compare {{if .PageIsComparePull}}compare pull{{end}}">
-	{{template "repo/header" .}}
 	{{$showDiffBox := false}}
 	{{$canReadPullRequests := .Permission.CanRead $.UnitTypePullRequests}}
 	<div class="ui container">

templates/repo/empty.tmpl

@@ -0,0 +1,83 @@
+{{/* Forgejo 17 template; the only change is the title row, which GitHub shows on an empty repository too. */}}
+{{template "base/head" .}}
+<div role="main" aria-label="{{.Title}}" class="page-content repository quickstart">
+	{{template "repo/home_header" .}}
+	<div class="ui container">
+		<div class="ui grid">
+			<div class="sixteen wide column content">
+				{{template "base/alert" .}}
+				{{if .Repository.IsArchived}}
+					<div class="ui warning message tw-text-center">
+						{{if .Repository.ArchivedUnix.IsZero}}
+							{{ctx.Locale.Tr "repo.archive.title"}}
+						{{else}}
+							{{ctx.Locale.Tr "repo.archive.title_date" (DateUtils.AbsoluteLong .Repository.ArchivedUnix)}}
+						{{end}}
+					</div>
+				{{end}}
+				{{if .Repository.IsBroken}}
+						<div class="ui segment center">
+							{{ctx.Locale.Tr "repo.broken_message"}}
+						</div>
+				{{else if .CanWriteCode}}
+					<h4 class="ui top attached header">
+						{{ctx.Locale.Tr "repo.quick_guide"}}
+					</h4>
+					<div class="ui attached guide table segment empty-repo-guide">
+						<div class="item">
+							<h3>{{ctx.Locale.Tr "repo.clone_this_repo"}} <small>{{ctx.Locale.Tr "repo.clone_helper" "http://git-scm.com/book/en/v2/Git-Basics-Getting-a-Git-Repository"}}</small></h3>
+
+							<div class="repo-button-row">
+								{{if and .CanWriteCode (not .Repository.IsArchived)}}
+									<a class="ui small button" href="{{.RepoLink}}/_new/{{.BranchName | PathEscapeSegments}}/">
+										{{ctx.Locale.Tr "file_editor.new_file"}}
+									</a>
+									{{if .RepositoryUploadEnabled}}
+									<a class="ui small button" href="{{.RepoLink}}/_upload/{{.BranchName | PathEscapeSegments}}/">
+										{{ctx.Locale.Tr "file_editor.upload_file"}}
+									</a>
+									{{end}}
+								{{end}}
+								<div class="clone-panel ui action small input tw-flex-1">
+									{{template "repo/clone_buttons" .}}
+								</div>
+							</div>
+						</div>
+
+						{{if not .Repository.IsArchived}}
+							<div class="divider tw-my-0"></div>
+
+							<div class="item">
+								<h3>{{ctx.Locale.Tr "repo.create_new_repo_command"}}</h3>
+								<div class="markup">
+									<pre><code>touch README.md
+git init{{if eq .Repository.ObjectFormatName "sha256"}} --object-format=sha256{{end}}
+{{if ne .Repository.DefaultBranch "master"}}git switch -c {{.Repository.DefaultBranch}}{{end}}
+git add README.md
+git commit -m "first commit"
+git remote add origin <span class="js-clone-url">{{$.CloneButtonOriginLink.HTTPS}}</span>
+git push -u origin {{.Repository.DefaultBranch}}</code></pre>
+								</div>
+							</div>
+							<div class="divider"></div>
+
+							<div class="item">
+								<h3>{{ctx.Locale.Tr "repo.push_exist_repo"}}</h3>
+								<div class="markup">
+									<pre><code>git remote add origin <span class="js-clone-url">{{$.CloneButtonOriginLink.HTTPS}}</span>
+git push -u origin {{.Repository.DefaultBranch}}</code></pre>
+								</div>
+							</div>
+						{{end}}
+					{{else}}
+						<div class="ui segment center">
+							{{ctx.Locale.Tr "repo.empty_message"}}
+						</div>
+					{{end}}
+					{{template "repo/clone_script" .}}
+				</div>
+			</div>
+		</div>
+	</div>
+</div>
+{{template "base/footer" .}}

templates/repo/header.tmpl

@@ -1,83 +1,2 @@
-{{/* Repository content header adapted to Forgejo template data. */}}
-<div class="repository-content-header">
-{{with .Repository}}
-	<div class="ui container">
-		<div class="repo-header">
-			<div class="flex-item tw-items-center">
-				<div class="flex-item-leading">
-					<a class="repository-content-owner-avatar" href="{{.Owner.HomeLink}}" aria-label="{{.Owner.Name}}">
-						{{ctx.AvatarUtils.Avatar .Owner 24}}
-					</a>
-				</div>
-				<div class="flex-item-main">
-					<div class="flex-item-title">
-						<a class="repository-content-name" href="{{$.RepoLink}}">{{.Name}}</a>
-					</div>
-				</div>
-				<div class="flex-item-trailing">
-					{{if .IsArchived}}
-						<span class="ui basic label not-mobile">{{ctx.Locale.Tr "repo.desc.archived"}}</span>
-						<div class="repo-icon only-mobile" data-tooltip-content="{{ctx.Locale.Tr "repo.desc.archived"}}">{{svg "octicon-archive" 18}}</div>
-					{{end}}
-					{{if $.PullMirror}}
-						{{template "repo/mirror_badge" $}}
-					{{else if .IsPrivate}}
-						<span class="ui basic label repository-visibility-label not-mobile">{{ctx.Locale.Tr "repo.desc.private"}}</span>
-						<div class="repo-icon only-mobile" data-tooltip-content="{{ctx.Locale.Tr "repo.desc.private"}}">{{svg "octicon-lock" 18}}</div>
-					{{else if .Owner.Visibility.IsPrivate}}
-						<span class="ui basic label repository-visibility-label not-mobile">{{ctx.Locale.Tr "repo.desc.internal"}}</span>
-						<div class="repo-icon only-mobile" data-tooltip-content="{{ctx.Locale.Tr "repo.desc.internal"}}">{{svg "octicon-shield-lock" 18}}</div>
-					{{else}}
-						<span class="ui basic label repository-visibility-label not-mobile">{{ctx.Locale.Tr "user.visibility.public.title"}}</span>
-					{{end}}
-					{{if .IsTemplate}}
-						<span class="ui basic label not-mobile">{{ctx.Locale.Tr "repo.desc.template"}}</span>
-						<div class="repo-icon only-mobile" data-tooltip-content="{{ctx.Locale.Tr "repo.desc.template"}}">{{svg "octicon-repo-template" 18}}</div>
-					{{end}}
-					{{if eq .ObjectFormatName "sha256"}}
-						<span class="ui basic label">{{ctx.Locale.Tr "repo.desc.sha256"}}</span>
-					{{end}}
-				</div>
-			</div>
-			{{if not (or .IsBeingCreated .IsBroken)}}
-				<div class="repo-buttons button-row">
-					{{if $.RepoTransfer}}
-						<form method="post" action="{{$.RepoLink}}/action/accept_transfer?redirect_to={{$.RepoLink}}">
-							<div data-tooltip-content="{{if $.CanUserAcceptTransfer}}{{ctx.Locale.Tr "repo.transfer.accept_desc" $.RepoTransfer.Recipient.DisplayName}}{{else}}{{ctx.Locale.Tr "repo.transfer.no_permission_to_accept"}}{{end}}">
-								<button type="submit" class="ui basic button {{if $.CanUserAcceptTransfer}}primary {{end}} ok small"{{if not $.CanUserAcceptTransfer}} disabled{{end}}>
-									{{ctx.Locale.Tr "repo.transfer.accept"}}
-								</button>
-							</div>
-						</form>
-						<form method="post" action="{{$.RepoLink}}/action/reject_transfer?redirect_to={{$.RepoLink}}">
-							<div data-tooltip-content="{{if $.CanUserAcceptTransfer}}{{ctx.Locale.Tr "repo.transfer.reject_desc" $.RepoTransfer.Recipient.DisplayName}}{{else}}{{ctx.Locale.Tr "repo.transfer.no_permission_to_reject"}}{{end}}">
-								<button type="submit" class="ui basic button {{if $.CanUserAcceptTransfer}}red {{end}}ok small"{{if not $.CanUserAcceptTransfer}} disabled{{end}}>
-									{{ctx.Locale.Tr "repo.transfer.reject"}}
-								</button>
-							</div>
-						</form>
-					{{end}}
-					{{/* GitHub has no feed button here; the feed stays linked from the page head. */}}
-					{{template "repo/watch_unwatch" $}}
-					{{if not $.DisableForks}}
-					{{template "repo/header_fork" $}}
-					{{end}}
-					{{if not $.DisableStars}}
-					{{template "repo/star_unstar" $}}
-					{{end}}
-					{{if and $.IsModerationEnabled $.IsSigned (not $.IsRepositoryAdmin)}}
-					<button class="ui small compact jump dropdown icon button" data-tooltip-content="{{ctx.Locale.Tr "repo.more_operations"}}" aria-label="{{ctx.Locale.Tr "toggle_menu"}}">
-						{{svg "octicon-kebab-horizontal"}}
-						<div class="menu top left">
-							<a class="item context" href="{{AppSubUrl}}/report_abuse?type=repo&id={{$.Repository.ID}}">{{ctx.Locale.Tr "moderation.report_content"}}</a>
-						</div>
-					</button>
-					{{end}}
-				</div>
-			{{end}}
-		</div>
-		{{if .IsFork}}<div class="fork-flag">{{ctx.Locale.Tr "repo.forked_from"}} <a href="{{.BaseRepo.Link}}">{{.BaseRepo.FullName}}</a></div>{{end}}
-		{{if .IsGenerated}}<div class="fork-flag">{{ctx.Locale.Tr "repo.generated_from"}} <a href="{{(.TemplateRepo ctx).Link}}">{{(.TemplateRepo ctx).FullName}}</a></div>{{end}}
-	</div>
-{{end}}
-</div>
+{{/* Forgejo calls this from every repository page. GitHub shows the title row only on the code home, so repo/home and
+repo/empty render repo/home_header themselves and every other page starts below the tabs. */}}

templates/repo/home.tmpl

@@ -3,7 +3,7 @@
 {{$showSidebar := and (not .TreeNames) (not .HideRepoInfo) (not .IsBlame)}}
 {{/* Layout classes instead of CSS :has(): a :has() on .page-content restyles the whole page, every line of a large file included, on any DOM change. */}}
 <div role="main" aria-label="{{.Title}}" class="page-content repository file list {{if .IsBlame}}blame{{end}}{{if $showSidebar}} repo-has-sidebar{{else if .TreeNames}} repo-has-source-browser{{end}}">
-	{{if not .TreeNames}}{{template "repo/header" .}}{{end}}
+	{{if not .TreeNames}}{{template "repo/home_header" .}}{{end}}
 	<div class="ui container {{if or .TreeNames .IsBlame}}fluid padded{{end}}">
 		{{template "base/alert" .}}