diff --git a/components/common/button/button.css b/components/common/button/button.css
index 14383318..9acbc975 100644
--- a/components/common/button/button.css
+++ b/components/common/button/button.css
@@ -22,6 +22,7 @@
 }
 
 .button.theme-control-small {
+  gap: 4px;
   height: 28px;
   min-height: 28px;
   padding: 0 8px;
@@ -29,10 +30,43 @@
   line-height: 18px;
 }
 
+/* A main action and its menu joined into one shape, like GitHub's Fork button. */
+.theme-control-split {
+  display: inline-flex;
+  align-items: stretch;
+}
+.theme-control-split > .theme-control {
+  border-top-right-radius: 0;
+  border-bottom-right-radius: 0;
+}
+.theme-control-split > .theme-dropdown > summary.theme-control {
+  margin-left: -1px;
+  border-top-left-radius: 0;
+  border-bottom-left-radius: 0;
+}
+/* An icon-only small menu trigger is a 28px square, like GitHub's "…" and split carets. */
+.theme-dropdown > summary.theme-control-small:not(:has(> span)) {
+  width: 28px;
+  padding: 0;
+}
+
 .theme-control:hover {
   background: var(--color-hover);
 }
 
+/* GitHub draws a default button's icons muted; a filled star keeps its own colour. */
+.theme-control:not(.primary) > svg:not(.octicon-star-fill) {
+  color: var(--color-text-light-1);
+}
+
+/* Forgejo sizes buttons in dropdown summaries through --button-min-height on more specific rules. */
+details > summary.button.theme-control {
+  min-height: 32px;
+}
+details > summary.button.theme-control-small {
+  min-height: 28px;
+}
+
 .theme-control:focus-visible {
   outline: 2px solid var(--github-fgColor-accent);
   outline-offset: 2px;
@@ -87,7 +121,9 @@
   .comment-code-cloud .field.footer .ui.ui.ui.button,
   .comment-code-cloud :is(.button-row, .button-sequence):has(.comment-form-reply) .ui.ui.ui.button,
   .page-content.repository.new.issue.github-issue-new .issue-content-left .text.right .ui.ui.ui.button,
-  .page-content.repository.new.release .ui.form .ui.ui.ui.button:not(.mini)
+  .page-content.repository.new.release .ui.form .ui.ui.ui.button:not(.mini),
+  .repo-button-row .ui.ui.ui.button.repo-add-file,
+  .js-branch-tag-selector .ui.ui.ui.button.branch-dropdown-button
 ) {
   height: 32px;
   min-height: 32px;
@@ -96,3 +132,22 @@
   font-weight: 500;
   line-height: 20px;
 }
+
+/* The branch selector is a Forgejo Vue component: GitHub sets its branch name in the button's weight and uses a
+   16px caret. */
+/* Its spacing comes from Forgejo's Tailwind utilities, which are !important. */
+.js-branch-tag-selector .ui.ui.ui.ui.button.branch-dropdown-button {
+  padding: 5px 12px !important;
+}
+.js-branch-tag-selector .branch-dropdown-button > .text {
+  gap: 8px;
+  margin-right: 0 !important;
+}
+.js-branch-tag-selector .branch-dropdown-button strong {
+  margin-left: 0 !important;
+  font-weight: inherit;
+}
+.js-branch-tag-selector .branch-dropdown-button > svg:last-child {
+  width: 16px;
+  height: 16px;
+}
diff --git a/components/common/dropdown/dropdown.tmpl b/components/common/dropdown/dropdown.tmpl
index 3663931f..502c92af 100644
--- a/components/common/dropdown/dropdown.tmpl
+++ b/components/common/dropdown/dropdown.tmpl
@@ -1,6 +1,6 @@
-{{/* Kind: single (radio), multiple (checkbox), or actions (links/buttons). Items owns page-specific content. */}}
+{{/* Kind: single (radio), multiple (checkbox), or actions (links/buttons). Items owns page-specific content. Small uses the 28px control. */}}
 <details class="theme-dropdown{{if .Quiet}} theme-dropdown-quiet{{end}}" data-theme-dropdown="{{.Kind}}">
-	<summary class="theme-control"{{if .IconOnly}} aria-label="{{.Label}}" data-tooltip-content="{{.Label}}"{{end}}>
+	<summary class="theme-control{{if .Small}} button theme-control-small{{end}}"{{if .IconOnly}} aria-label="{{.Label}}" data-tooltip-content="{{.Label}}"{{end}}>
 		{{if .Icon}}{{svg .Icon 16}}{{end}}
 		{{if not .IconOnly}}<span{{if .UpdateLabel}} data-theme-dropdown-label{{end}}>{{.Label}}</span>{{svg "octicon-triangle-down" 12}}{{end}}
 	</summary>
diff --git a/components/common/search/search.css b/components/common/search/search.css
index 0f317dd3..4d87e693 100644
--- a/components/common/search/search.css
+++ b/components/common/search/search.css
@@ -98,6 +98,28 @@
   display: none;
 }
 
+/* A shortcut hint, like the "/" in GitHub's header search; it gives way to the clear button once there is text. */
+.theme-search-field > .theme-search-shortcut {
+  flex: none;
+  display: inline-grid;
+  place-items: center;
+  box-sizing: border-box;
+  min-width: 16px;
+  height: 16px;
+  margin-right: 8px;
+  padding: 0 3px;
+  border: 1px solid var(--color-text-light-1);
+  border-radius: 3px;
+  box-shadow: none;
+  background: transparent;
+  color: var(--color-text-light-1);
+  font: 12px/1 var(--fonts-monospace);
+}
+
+.theme-search-field:not(:has(> input:placeholder-shown)) > .theme-search-shortcut {
+  display: none;
+}
+
 /* Syntax fields: a mirror behind the transparent input text colours qualifier values (author:<value>). */
 .theme-search-syntax-control {
   position: relative;
diff --git a/components/common/search/search.js b/components/common/search/search.js
index a8eee458..eb5fb60b 100644
--- a/components/common/search/search.js
+++ b/components/common/search/search.js
@@ -13,6 +13,16 @@
     if (applied && input.form) input.form.requestSubmit();
   });
 
+  // A field with a shortcut takes focus when its key is pressed outside another text field.
+  document.addEventListener("keydown", event => {
+    if (event.ctrlKey || event.metaKey || event.altKey || event.isComposing) return;
+    if (event.target.closest("input, textarea, select, [contenteditable]")) return;
+    const input = document.querySelector(`input[data-search-shortcut="${CSS.escape(event.key)}"]`);
+    if (!input || !input.checkVisibility()) return;
+    event.preventDefault();
+    input.focus();
+  });
+
   // Qualifiers Forgejo's issue search understands; their values are highlighted like GitHub's.
   const qualifiers = new Set(["is", "author", "assignee", "review", "mentions", "sort", "modified"]);
 
diff --git a/components/common/search/search.tmpl b/components/common/search/search.tmpl
index 34f5aa81..f26a9a1c 100644
--- a/components/common/search/search.tmpl
+++ b/components/common/search/search.tmpl
@@ -1,10 +1,11 @@
-{{/* Kind: submit (default, trailing search button), icon (leading search icon), or plain. Local marks a client-side filter that is never submitted. Class adds page layout hooks. Syntax adds GitHub's qualifier popup and value highlighting (issue and pull request searches). */}}
+{{/* Kind: submit (default, trailing search button), icon (leading search icon), or plain. Local marks a client-side filter that is never submitted. Class adds page layout hooks. Syntax adds GitHub's qualifier popup and value highlighting (issue and pull request searches). Shortcut shows a key that focuses the field from anywhere on the page. */}}
 {{$icon := eq .Kind "icon"}}
 {{if .Syntax}}<div class="theme-search-syntax-control">{{end}}
 {{if $icon}}<label class="theme-search-field theme-search-field-icon{{if .Class}} {{.Class}}{{end}}">{{svg "octicon-search" 16}}{{else}}<div class="theme-search-field{{if .Class}} {{.Class}}{{end}}">{{end}}
 	{{if .Syntax}}<span class="theme-search-input-wrap"><span class="theme-search-highlight" aria-hidden="true"></span>{{end}}
-	<input type="search"{{if .ID}} id="{{.ID}}"{{end}}{{if .Local}} autocomplete="off"{{else}} name="{{or .Name "q"}}" value="{{.Value}}" maxlength="255"{{end}}{{if .Syntax}} autocomplete="off" data-search-syntax role="combobox" aria-autocomplete="list" aria-expanded="false"{{end}} placeholder="{{.Placeholder}}" aria-label="{{or .Label .Placeholder}}" spellcheck="false" dir="auto">
+	<input type="search"{{if .ID}} id="{{.ID}}"{{end}}{{if .Local}} autocomplete="off"{{else}} name="{{or .Name "q"}}" value="{{.Value}}" maxlength="255"{{end}}{{if .Syntax}} autocomplete="off" data-search-syntax role="combobox" aria-autocomplete="list" aria-expanded="false"{{end}} placeholder="{{.Placeholder}}" aria-label="{{or .Label .Placeholder}}"{{if .Shortcut}} data-search-shortcut="{{.Shortcut}}" aria-keyshortcuts="{{.Shortcut}}"{{end}} spellcheck="false" dir="auto">
 	{{if .Syntax}}</span>{{end}}
+	{{if .Shortcut}}<kbd class="theme-search-shortcut" aria-hidden="true">{{.Shortcut}}</kbd>{{end}}
 	<button type="button" class="theme-search-clear" aria-label="Clear search" tabindex="-1">{{svg "octicon-x-circle-fill" 16}}</button>
 	{{if not (or $icon (eq .Kind "plain"))}}<button type="submit" class="theme-search-submit" aria-label="{{ctx.Locale.Tr "search.search"}}">{{svg "octicon-search" 16}}</button>{{end}}
 {{if $icon}}</label>{{else}}</div>{{end}}
diff --git a/public/assets/js/navbar-drawer.js b/public/assets/js/navbar-drawer.js
index 8fe194b5..e1d656d8 100644
--- a/public/assets/js/navbar-drawer.js
+++ b/public/assets/js/navbar-drawer.js
@@ -13,9 +13,13 @@
     extraNodes.push(node);
   }
 
+  // The drawer opens on every width, like GitHub's. Custom navbar links only move into it on mobile, where the
+  // navbar hides them; on desktop they stay in the navbar.
+  let movedExtras = false;
   toggle.addEventListener("click", () => {
-    if (!mobile.matches || drawer.open) return;
-    if (extraSlot && extraEnd) {
+    if (drawer.open) return;
+    movedExtras = mobile.matches && Boolean(extraSlot && extraEnd);
+    if (movedExtras) {
       extraSlot.hidden = !extraNodes.some(node => node.nodeType === 1 || node.textContent.trim());
       extraSlot.append(...extraNodes);
     }
@@ -41,11 +45,12 @@
     }
   });
   drawer.addEventListener("close", () => {
-    extraEnd?.before(...extraNodes);
+    if (movedExtras) extraEnd.before(...extraNodes);
+    movedExtras = false;
     toggle.setAttribute("aria-expanded", "false");
     document.documentElement.classList.remove("navbar-drawer-open");
     drawer.querySelectorAll("details[open]").forEach(details => (details.open = false));
-    if (mobile.matches) toggle.focus();
+    toggle.focus();
   });
 
   // A modal dialog reports backdrop clicks on the dialog itself. Check both
@@ -64,9 +69,6 @@
     if (backdropPress && event.target === drawer && outside(event)) drawer.close();
     backdropPress = false;
   });
-  mobile.addEventListener("change", () => {
-    if (!mobile.matches && drawer.open) drawer.close();
-  });
   window.addEventListener("pagehide", () => {
     if (drawer.open) drawer.close();
   });
diff --git a/public/navbar-drawer.css b/public/navbar-drawer.css
index 0f8f8d63..e7565be9 100644
--- a/public/navbar-drawer.css
+++ b/public/navbar-drawer.css
@@ -155,3 +155,10 @@ html.navbar-drawer-open {
     animation: none;
   }
 }
+
+/* On desktop the avatar and create menus stay in the header, as on GitHub, so the drawer only navigates. */
+@media (min-width: 768px) {
+  .navbar-drawer .navbar-drawer-group:has(> .navbar-drawer-create, > .navbar-drawer-account) {
+    display: none;
+  }
+}
diff --git a/src/build-output.test.ts b/src/build-output.test.ts
index 06a632d6..0d369c50 100644
--- a/src/build-output.test.ts
+++ b/src/build-output.test.ts
@@ -387,11 +387,17 @@ describe("Forgejo 15 native integration", () => {
       "utf-8"
     );
     const navbarTemplate = fs.readFileSync(path.join(ROOT_DIR, "templates", "base", "head_navbar.tmpl"), "utf-8");
+    const navbarStyle = fs.readFileSync(path.join(ROOT_DIR, "styles", "components", "navbar.ts"), "utf-8");
 
     expect(header).toContain("height: 52px;");
     expect(header).toContain("padding-top: 16px;");
     expect(header).toContain("border-bottom: 0;");
-    expect(header).toContain(".navbar-left > #navbar-logo.item");
+    // GitHub: the menu button, 12px, a bare 32px logo, 8px, "owner / repo" with a repository icon and no avatar.
+    expect(navbarStyle).toContain("&#navbar-logo {");
+    expect(navbarStyle).toContain("min-width: 32px;");
+    expect(navbarTemplate.indexOf('id="navbar-drawer-toggle"')).toBeLessThan(
+      navbarTemplate.indexOf('id="navbar-logo"')
+    );
     expect(header).toContain("height: 48px;");
     expect(header).toContain("gap: 8px;");
     expect(header).toContain("margin: 0 7px;");
@@ -401,8 +407,8 @@ describe("Forgejo 15 native integration", () => {
     expect(header).toContain("line-height: 21px;");
     expect(header).toContain("bottom: -8px;");
     expect(secondaryMenu).toContain(".overflow-menu-items {\n      gap: 8px;");
-    expect(navbarTemplate).toContain("{{ctx.AvatarUtils.Avatar .Owner 16}}");
-    expect(navbarTemplate).not.toContain('class="repository-navbar-owner-avatar"');
+    expect(navbarTemplate).not.toContain("{{ctx.AvatarUtils.Avatar .Owner 16}}");
+    expect(navbarTemplate).toContain("{{svg $repoIcon 16}}");
   });
 
   it("ships the mobile drawer assets and keeps its toggle independent of Forgejo's inline menu", () => {
@@ -615,7 +621,9 @@ describe("Forgejo 15 native integration", () => {
       expect(style).toContain("@media (max-width: 767.98px)");
     }
 
-    expect(headerStyle).toContain("padding-left: 8px;");
+    // GitHub keeps its 16px gutter on phones and drops the tab icons there.
+    expect(headerStyle).not.toContain("padding-left: 8px;");
+    expect(headerStyle).toContain(".overflow-menu-items > .item > svg {");
     expect(headerStyle).toContain(".repo-buttons");
     expect(viewContentStyle).toContain("> .repo-button-row-left");
     expect(viewContentStyle).toContain("> .repo-button-row-right");
diff --git a/src/navbar-drawer.test.ts b/src/navbar-drawer.test.ts
index cdfbfc94..c9332078 100644
--- a/src/navbar-drawer.test.ts
+++ b/src/navbar-drawer.test.ts
@@ -92,7 +92,7 @@ function fixture() {
   };
 }
 
-describe("mobile navigation drawer", () => {
+describe("navigation drawer", () => {
   it("opens once as a modal and restores focus, scroll, and disclosure state on close", () => {
     const f = fixture();
     f.toggle.emit("click");
@@ -132,16 +132,15 @@ describe("mobile navigation drawer", () => {
     expect(preventDefault).toHaveBeenCalledTimes(2);
   });
 
-  it("closes when crossing to desktop and does not reopen there", () => {
+  it("opens on desktop too, leaving the custom links in the navbar", () => {
     const f = fixture();
-    f.toggle.emit("click");
     f.media.matches = false;
-    f.media.emit("change");
     f.toggle.emit("click");
-    expect(f.drawer.open).toBe(false);
-    expect(f.drawer.showModal).toHaveBeenCalledTimes(1);
-    expect(f.classes.has("navbar-drawer-open")).toBe(false);
-    expect(f.toggle.focus).not.toHaveBeenCalled();
+    expect(f.drawer.showModal).toHaveBeenCalledOnce();
+    expect(f.slot.append).not.toHaveBeenCalled();
+    f.closeButton.emit("click");
+    expect(f.end.before).not.toHaveBeenCalled();
+    expect(f.toggle.focus).toHaveBeenCalledOnce();
   });
 
   it("moves existing custom links into the drawer and restores the same nodes", () => {
diff --git a/styles/components/navbar.ts b/styles/components/navbar.ts
index 11fe1e48..81bf7a36 100644
--- a/styles/components/navbar.ts
+++ b/styles/components/navbar.ts
@@ -35,6 +35,44 @@ const navbarRight = css`
       position: relative;
       text-decoration: none;
     }
+    /* GitHub: the menu button, 12px, the logo, 8px, the page's name. Header controls are transparent with a border. */
+    #navbar-drawer-toggle {
+      background: transparent;
+      &:hover {
+        background: ${themeVars.github.control.transparent.bgColor.hover};
+      }
+    }
+    /* GitHub's header search: a 197px field first on the right from 1012px, a search button below that. */
+    .navbar-search {
+      width: 197px;
+    }
+    .navbar-search-field {
+      padding-left: 12px;
+      background: transparent;
+    }
+    .navbar-search-button {
+      order: -1;
+    }
+    @media (min-width: 1012px) {
+      .navbar-search-button {
+        display: none !important;
+      }
+    }
+    @media (max-width: 1011.98px) {
+      .navbar-search {
+        display: none;
+      }
+    }
+    /* On mobile GitHub keeps only search and the inbox on the right; the drawer has the dashboard links. */
+    .navbar-mobile-right > .navbar-dashboard-link {
+      display: none !important;
+    }
+    /* GitHub drops the logo below 600px. */
+    @media (max-width: 599.98px) {
+      .navbar-left > #navbar-logo.item {
+        display: none;
+      }
+    }
     .navbar-left {
       gap: 8px;
       > .item {
@@ -48,10 +86,18 @@ const navbarRight = css`
           font-weight: 600;
         }
         &#navbar-logo {
-          /* 与下方的用户切换头像对齐 */
-          padding-left: 6px;
+          /* GitHub: a bare 32px mark 12px after the menu button. */
+          flex: none;
+          box-sizing: border-box;
+          width: 32px;
+          min-width: 32px;
+          height: 32px;
+          min-height: 32px;
+          margin-left: 4px;
+          padding: 0;
           &:hover {
             background: unset;
+            box-shadow: none;
           }
           img {
             height: 32px;
diff --git a/styles/pages/user-profile.css b/styles/pages/user-profile.css
index 99c496c2..68d36ba1 100644
--- a/styles/pages/user-profile.css
+++ b/styles/pages/user-profile.css
@@ -374,6 +374,8 @@
 }
 
 #navbar .profile-navbar-name {
+  /* Like the repository breadcrumb: the name starts 6px into its link. */
+  padding-inline: 6px;
   min-width: 0;
   overflow: hidden;
   text-overflow: ellipsis;
diff --git a/styles/templates/repo/header.ts b/styles/templates/repo/header.ts
index 6fb1e19f..9d6730b4 100644
--- a/styles/templates/repo/header.ts
+++ b/styles/templates/repo/header.ts
@@ -46,16 +46,6 @@ const repositoryHeader = css`
     gap: 8px;
   }
 
-  #navbar.repository-navbar .navbar-left > #navbar-logo.item {
-    box-sizing: border-box;
-    flex: none;
-    height: 32px;
-    min-height: 32px;
-    min-width: 32px;
-    padding: 0;
-    width: 32px;
-  }
-
   #navbar .repository-navbar-breadcrumb {
     align-items: center;
     display: flex;
@@ -80,20 +70,20 @@ const repositoryHeader = css`
     background: ${themeVars.color.nav.hoverBg};
   }
 
-  #navbar .repository-navbar-owner {
+  #navbar .repository-navbar-breadcrumb > a.repository-navbar-name {
     gap: 8px;
+    font-weight: 600;
+    padding: 4px;
   }
 
-  #navbar .repository-navbar-owner img {
-    border-radius: 9999px;
-    height: 16px;
-    margin: 0 !important;
-    width: 16px;
+  /* The owner menu only replaces the owner on narrow screens. */
+  #navbar .repository-navbar-breadcrumb > .theme-dropdown {
+    display: none;
   }
-
-  #navbar .repository-navbar-breadcrumb > a.repository-navbar-name {
-    font-weight: 600;
-    padding: 4px;
+  @media (max-width: 767.98px) {
+    #navbar .repository-navbar-breadcrumb > .theme-dropdown {
+      display: block;
+    }
   }
 
   #navbar .repository-navbar-separator {
@@ -158,6 +148,11 @@ const repositoryHeader = css`
   .repository-tab-nav.page-content.repository .ui.secondary.pointing.menu .overflow-menu-items > .item {
     border-bottom: 0 !important;
     box-sizing: border-box;
+    /* GitHub: 8px between the icon, the label and the counter. */
+    gap: 8px;
+    & > svg {
+      margin-right: 0;
+    }
     height: 32px;
     line-height: 21px;
     margin: 0 0 8px !important;
@@ -310,7 +305,7 @@ const repositoryHeader = css`
     z-index: 1;
   }
 
-  .page-content.repository > .secondary-nav .ui.secondary.pointing.menu .active.item > .ui.label::after {
+  .page-content.repository > .secondary-nav .ui.secondary.pointing.menu .active.item > .theme-counter::after {
     content: none;
   }
 
@@ -366,33 +361,28 @@ const repositoryHeader = css`
       flex: 1;
       min-width: 0;
     }
-    #navbar.repository-navbar .repository-navbar-owner,
-    #navbar.repository-navbar .repository-navbar-separator {
+    #navbar.repository-navbar .repository-navbar-owner {
       display: none;
     }
     #navbar.repository-navbar .repository-navbar-name {
-      white-space: nowrap;
-      overflow: hidden;
-      text-overflow: ellipsis;
-      display: block;
+      min-width: 0;
+      & > span {
+        white-space: nowrap;
+        overflow: hidden;
+        text-overflow: ellipsis;
+      }
+      & > svg {
+        flex: none;
+      }
     }
     #navbar.repository-navbar .navbar-mobile-right {
       order: 2;
       flex-shrink: 0;
     }
 
-    #navbar.repository-navbar {
-      padding-left: 8px;
-      padding-right: 8px;
-    }
-
-    .repository-tab-nav.page-content.repository > .secondary-nav > overflow-menu.ui.container {
-      padding-left: 8px;
-      padding-right: 8px;
-    }
-
-    .repository-tab-nav.page-content.repository .ui.secondary.pointing.menu .overflow-menu-items {
-      gap: 4px;
+    /* GitHub drops the tab icons once the tabs run out of room; with Forgejo's longer tab list that is mobile. */
+    .repository-tab-nav.page-content.repository .ui.secondary.pointing.menu .overflow-menu-items > .item > svg {
+      display: none;
     }
 
     .page-content.repository > .repository-content-header {
diff --git a/styles/templates/repo/home.ts b/styles/templates/repo/home.ts
index 82508029..218d925a 100644
--- a/styles/templates/repo/home.ts
+++ b/styles/templates/repo/home.ts
@@ -33,13 +33,20 @@ const repositoryHome = css`
     grid-template-rows: auto auto 1fr;
   }
 
+  /* GitHub's page gutter: 16px, and 32px from 1012px. */
   .page-content.repository.file.list.repo-has-sidebar > .ui.container,
   .page-content.repository.file.list.repo-has-sidebar > .repository-content-header > .ui.container {
-    width: calc(100% - 64px);
+    width: calc(100% - 32px);
     max-width: 1216px;
     margin-left: auto;
     margin-right: auto;
   }
+  @media (min-width: 1012px) {
+    .page-content.repository.file.list.repo-has-sidebar > .ui.container,
+    .page-content.repository.file.list.repo-has-sidebar > .repository-content-header > .ui.container {
+      width: calc(100% - 64px);
+    }
+  }
   .page-content.repository.file.list.repo-has-sidebar > .repository-content-header > .ui.container {
     padding-bottom: 18px;
   }
@@ -224,10 +231,6 @@ const repositoryHome = css`
       order: 2;
     }
 
-    .page-content.repository.file.list.repo-has-sidebar > .ui.container,
-    .page-content.repository.file.list.repo-has-sidebar > .repository-content-header > .ui.container {
-      width: calc(100% - 32px);
-    }
     .page-content.repository.file.list .repo-grid-filelist-sidebar {
       grid-template-columns: 100%;
       grid-template-rows: auto auto auto;
diff --git a/templates/base/head_navbar.tmpl b/templates/base/head_navbar.tmpl
index d5b44583..3b665489 100644
--- a/templates/base/head_navbar.tmpl
+++ b/templates/base/head_navbar.tmpl
@@ -8,6 +8,8 @@
 {{/* Forgejo 15 navigation adapted to the theme's GitHub-style layout. */}}
 <nav id="navbar"{{if .Repository}} class="repository-navbar"{{end}} aria-label="{{ctx.Locale.Tr "aria.navbar"}}">
 	<div class="navbar-left">
+		{{/* GitHub opens its navigation drawer from a button before the logo on every width. */}}
+		<button type="button" class="theme-icon-button theme-icon-button-outlined" id="navbar-drawer-toggle" aria-controls="navbar-drawer" aria-haspopup="dialog" aria-expanded="false" aria-label="{{ctx.Locale.Tr "toggle_menu"}}">{{svg "octicon-three-bars" 16}}</button>
 		<!-- the logo -->
 		<a class="item" id="navbar-logo" href="{{AppSubUrl}}/" aria-label="{{if .IsSigned}}{{ctx.Locale.Tr "dashboard"}}{{else}}{{ctx.Locale.Tr "home"}}{{end}}">
 			<img width="30" height="30" src="{{AssetUrlPrefix}}/img/logo.svg" alt="{{ctx.Locale.Tr "logo"}}" aria-hidden="true">
@@ -16,19 +18,20 @@
 		<!-- mobile right menu, it must be here because in mobile view, each item is a flex column, the first item is a full row column -->
 		<div class="ui secondary menu navbar-mobile-right only-mobile">
 			{{template "base/head_navbar_icons" dict "Data" .}}
-			<button class="item ui icon mini button tw-m-0" id="navbar-drawer-toggle" aria-controls="navbar-drawer" aria-haspopup="dialog" aria-expanded="false" aria-label="{{ctx.Locale.Tr "toggle_menu"}}">{{svg "octicon-three-bars"}}</button>
 		</div>
 
 		<!-- navbar links non-mobile -->
 		{{if .Repository}}
 			{{with .Repository}}
 			<div class="repository-navbar-breadcrumb not-mobile">
+				{{/* On narrow screens GitHub folds the owner into a menu before the slash. */}}
+				{{template "components/common/dropdown/dropdown" dict "Kind" "actions" "Icon" "octicon-kebab-horizontal" "IconOnly" true "Small" true "Quiet" true "Label" .Owner.Name "Items" "base/navbar_breadcrumb_items" "Data" $}}
 				<a class="repository-navbar-owner" href="{{.Owner.HomeLink}}">
-					{{ctx.AvatarUtils.Avatar .Owner 16}}
 					<span>{{.Owner.Name}}</span>
 				</a>
 				<span class="repository-navbar-separator">/</span>
-				<a class="repository-navbar-name" href="{{$.RepoLink}}">{{.Name}}</a>
+				{{$repoIcon := "octicon-repo"}}{{if .IsPrivate}}{{$repoIcon = "octicon-lock"}}{{else if .IsFork}}{{$repoIcon = "octicon-repo-forked"}}{{else if .IsMirror}}{{$repoIcon = "octicon-mirror"}}{{end}}
+				<a class="repository-navbar-name" href="{{$.RepoLink}}">{{svg $repoIcon 16}}<span>{{.Name}}</span></a>
 			</div>
 			{{end}}
 		{{else if $isOrganization}}
@@ -56,6 +59,12 @@
 
 	<!-- the full dropdown menus -->
 	<div class="navbar-right">
+		{{if not (and .IsSigned .HideNavbarLinks)}}
+			{{/* GitHub's search sits first on the right; here it searches repositories and "/" focuses it. */}}
+			<form class="navbar-search not-mobile" action="{{AppSubUrl}}/explore/repos" method="get" role="search">
+				{{template "components/common/search/search" dict "Kind" "icon" "Placeholder" (ctx.Locale.Tr "search.repo_kind") "Shortcut" "/" "Class" "navbar-search-field"}}
+			</form>
+		{{end}}
 		{{if and .IsSigned .HideNavbarLinks}}
 			<div class="ui dropdown jump item" data-tooltip-content="{{ctx.Locale.Tr "user_profile_and_more"}}">
 				<span class="text">
diff --git a/templates/base/head_navbar_icons.tmpl b/templates/base/head_navbar_icons.tmpl
index 4c3b6279..023a9846 100644
--- a/templates/base/head_navbar_icons.tmpl
+++ b/templates/base/head_navbar_icons.tmpl
@@ -1,6 +1,12 @@
 {{/* Forgejo 15 navbar actions using the native route and data contracts. */}}
 {{- $itemExtraClass := .ItemExtraClass -}}
 {{- $data := .Data -}}
+{{if not (and $data.IsSigned $data.HideNavbarLinks)}}
+	{{/* Below 1012px GitHub's header search collapses to this button. */}}
+	<a class="item navbar-search-button {{$itemExtraClass}}" href="{{AppSubUrl}}/explore/repos" data-tooltip-content="{{ctx.Locale.Tr "search.repo_kind"}}" aria-label="{{ctx.Locale.Tr "search.repo_kind"}}">
+		{{svg "octicon-search"}}
+	</a>
+{{end}}
 {{if and $data $data.IsSigned}}
 	{{- $notificationUnreadCount := 0 -}}
 	{{- if $data.NotificationUnreadCount -}}
@@ -15,17 +21,17 @@
 	</a>
 	{{end}}
 	{{if not $data.UnitIssuesGlobalDisabled}}
-	<a class="item {{$itemExtraClass}}" href="{{AppSubUrl}}/issues" data-tooltip-content="{{ctx.Locale.Tr "issues"}}" aria-label="{{ctx.Locale.Tr "issues"}}">
+	<a class="item navbar-dashboard-link {{$itemExtraClass}}" href="{{AppSubUrl}}/issues" data-tooltip-content="{{ctx.Locale.Tr "issues"}}" aria-label="{{ctx.Locale.Tr "issues"}}">
 		{{svg "octicon-issue-opened"}}
 	</a>
 	{{end}}
 	{{if not $data.UnitPullsGlobalDisabled}}
-	<a class="item {{$itemExtraClass}}" href="{{AppSubUrl}}/pulls" data-tooltip-content="{{ctx.Locale.Tr "pull_requests"}}" aria-label="{{ctx.Locale.Tr "pull_requests"}}">
+	<a class="item navbar-dashboard-link {{$itemExtraClass}}" href="{{AppSubUrl}}/pulls" data-tooltip-content="{{ctx.Locale.Tr "pull_requests"}}" aria-label="{{ctx.Locale.Tr "pull_requests"}}">
 		{{svg "octicon-git-pull-request"}}
 	</a>
 	{{end}}
 	{{if and (not (and $data.UnitIssuesGlobalDisabled $data.UnitPullsGlobalDisabled)) $data.ShowMilestonesDashboardPage}}
-	<a class="item {{$itemExtraClass}}" href="{{AppSubUrl}}/milestones" data-tooltip-content="{{ctx.Locale.Tr "milestones"}}" aria-label="{{ctx.Locale.Tr "milestones"}}">
+	<a class="item navbar-dashboard-link {{$itemExtraClass}}" href="{{AppSubUrl}}/milestones" data-tooltip-content="{{ctx.Locale.Tr "milestones"}}" aria-label="{{ctx.Locale.Tr "milestones"}}">
 		{{svg "octicon-milestone"}}
 	</a>
 	{{end}}
diff --git a/templates/base/navbar_breadcrumb_items.tmpl b/templates/base/navbar_breadcrumb_items.tmpl
new file mode 100644
index 00000000..bfb07cb6
--- /dev/null
+++ b/templates/base/navbar_breadcrumb_items.tmpl
@@ -0,0 +1 @@
+<a class="theme-dropdown-action" href="{{.Repository.Owner.HomeLink}}">{{svg "octicon-person" 16}}{{.Repository.Owner.Name}}</a>
diff --git a/templates/org/menu.tmpl b/templates/org/menu.tmpl
index ec0961bd..58de900d 100644
--- a/templates/org/menu.tmpl
+++ b/templates/org/menu.tmpl
@@ -8,7 +8,7 @@
 		<a class="{{if and .PageIsViewRepositories $repositories}}active {{end}}item" href="{{$.Org.HomeLink}}?tab=repositories"{{if and .PageIsViewRepositories $repositories}} aria-current="page"{{end}}>
 			{{svg "octicon-repo"}} {{ctx.Locale.Tr "user.repositories"}}
 			{{if .RepoCount}}
-				<span class="theme-counter profile-nav-count">{{.RepoCount}}</span>
+				<span class="theme-counter theme-counter-tab profile-nav-count">{{.RepoCount}}</span>
 			{{end}}
 			<span hidden test-name="repository-count">{{.RepoCount}}</span>
 		</a>
@@ -16,7 +16,7 @@
 		<a class="{{if .PageIsViewProjects}}active {{end}}item" href="{{$.Org.HomeLink}}/-/projects"{{if .PageIsViewProjects}} aria-current="page"{{end}}>
 			{{svg "octicon-project-symlink"}} {{ctx.Locale.Tr "user.projects"}}
 			{{if .ProjectCount}}
-				<span class="theme-counter profile-nav-count">{{.ProjectCount}}</span>
+				<span class="theme-counter theme-counter-tab profile-nav-count">{{.ProjectCount}}</span>
 			{{end}}
 			<span hidden test-name="project-count">{{.ProjectCount}}</span>
 		</a>
@@ -25,7 +25,7 @@
 		<a class="{{if .IsPackagesPage}}active {{end}}item" href="{{$.Org.HomeLink}}/-/packages"{{if .IsPackagesPage}} aria-current="page"{{end}}>
 			{{svg "octicon-package"}} {{ctx.Locale.Tr "packages.title"}}
 			{{if .PackageCount}}
-				<span class="theme-counter profile-nav-count">{{.PackageCount}}</span>
+				<span class="theme-counter theme-counter-tab profile-nav-count">{{.PackageCount}}</span>
 			{{end}}
 			<span hidden test-name="package-count">{{.PackageCount}}</span>
 		</a>
@@ -39,7 +39,7 @@
 		<a class="{{if $.PageIsOrgTeams}}active {{end}}item" href="{{$.OrgLink}}/teams"{{if .PageIsOrgTeams}} aria-current="page"{{end}}>
 			{{svg "octicon-people"}} {{ctx.Locale.Tr "org.teams"}}
 			{{if .NumTeams}}
-				<span class="theme-counter profile-nav-count">{{.NumTeams}}</span>
+				<span class="theme-counter theme-counter-tab profile-nav-count">{{.NumTeams}}</span>
 			{{end}}
 		</a>
 		{{end}}
@@ -47,7 +47,7 @@
 		{{if .NumMembers}}
 		<a class="{{if $.PageIsOrgMembers}}active {{end}}item" href="{{$.OrgLink}}/members"{{if .PageIsOrgMembers}} aria-current="page"{{end}}>
 			{{svg "octicon-person"}} {{ctx.Locale.Tr "org.members"}}
-			<span class="theme-counter profile-nav-count">{{.NumMembers}}</span>
+			<span class="theme-counter theme-counter-tab profile-nav-count">{{.NumMembers}}</span>
 		</a>
 		{{end}}
 		<span hidden test-name="member-count">{{.NumMembers}}</span>
diff --git a/templates/repo/global_header.tmpl b/templates/repo/global_header.tmpl
index 88107755..f2e573c7 100644
--- a/templates/repo/global_header.tmpl
+++ b/templates/repo/global_header.tmpl
@@ -13,7 +13,7 @@
 					<a class="{{if .PageIsIssueList}}active {{end}}item" href="{{.RepoLink}}/issues">
 						{{svg "octicon-issue-opened"}} {{ctx.Locale.Tr "repo.issues"}}
 						{{if (.Repository.NumOpenIssues ctx)}}
-							<span class="ui small label">{{CountFmt (.Repository.NumOpenIssues ctx)}}</span>
+							<span class="theme-counter theme-counter-tab">{{CountFmt (.Repository.NumOpenIssues ctx)}}</span>
 						{{end}}
 					</a>
 				{{end}}
@@ -28,7 +28,7 @@
 					<a class="{{if .PageIsPullList}}active {{end}}item" href="{{.RepoLink}}/pulls?state=open">
 						{{svg "octicon-git-pull-request"}} {{ctx.Locale.Tr "repo.pulls"}}
 						{{if (.Repository.NumOpenPulls ctx)}}
-							<span class="ui small label">{{CountFmt (.Repository.NumOpenPulls ctx)}}</span>
+							<span class="theme-counter theme-counter-tab">{{CountFmt (.Repository.NumOpenPulls ctx)}}</span>
 						{{end}}
 					</a>
 				{{end}}
@@ -37,7 +37,7 @@
 					<a href="{{.RepoLink}}/projects" class="{{if .IsProjectsPage}}active {{end}}item">
 						{{svg "octicon-project"}} {{ctx.Locale.Tr "repo.project"}}
 						{{if .Repository.NumOpenProjects}}
-							<span class="ui small label">{{CountFmt .Repository.NumOpenProjects}}</span>
+							<span class="theme-counter theme-counter-tab">{{CountFmt .Repository.NumOpenProjects}}</span>
 						{{end}}
 					</a>
 				{{end}}
@@ -46,7 +46,7 @@
 					<a class="{{if or .PageIsReleaseList .PageIsTagList}}active {{end}}item" href="{{.RepoLink}}/releases">
 						{{svg "octicon-tag"}} {{ctx.Locale.Tr "repo.releases"}}
 						{{if .NumReleases}}
-							<span class="ui small label">{{CountFmt .NumReleases}}</span>
+							<span class="theme-counter theme-counter-tab">{{CountFmt .NumReleases}}</span>
 						{{end}}
 					</a>
 				{{end}}
@@ -55,7 +55,7 @@
 					<a href="{{.RepoLink}}/packages" class="{{if .IsPackagesPage}}active {{end}}item">
 						{{svg "octicon-package"}} {{ctx.Locale.Tr "packages.title"}}
 						{{if .NumPackages}}
-							<span class="ui small label">{{CountFmt .NumPackages}}</span>
+							<span class="theme-counter theme-counter-tab">{{CountFmt .NumPackages}}</span>
 						{{end}}
 					</a>
 				{{end}}
@@ -82,7 +82,7 @@
 					<a class="{{if .PageIsActions}}active {{end}}item" href="{{.RepoLink}}/actions">
 						{{svg "octicon-play"}} {{ctx.Locale.Tr "actions.actions"}}
 						{{if .NumOpenActionRuns}}
-							<span class="ui small label">{{CountFmt .NumOpenActionRuns}}</span>
+							<span class="theme-counter theme-counter-tab">{{CountFmt .NumOpenActionRuns}}</span>
 						{{end}}
 					</a>
 				{{end}}
diff --git a/templates/repo/header.tmpl b/templates/repo/header.tmpl
index 2c357a6d..e93f2da8 100644
--- a/templates/repo/header.tmpl
+++ b/templates/repo/header.tmpl
@@ -57,11 +57,7 @@
 							</div>
 						</form>
 					{{end}}
-					{{if $.EnableFeed}}
-					<a class="ui compact small basic button" href="{{$.RepoLink}}.rss" data-tooltip-content="{{ctx.Locale.Tr "rss_feed"}}">
-						{{svg "octicon-rss" 16}}
-					</a>
-					{{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" $}}
diff --git a/templates/repo/header_fork.tmpl b/templates/repo/header_fork.tmpl
new file mode 100644
index 00000000..b86c94d7
--- /dev/null
+++ b/templates/repo/header_fork.tmpl
@@ -0,0 +1,49 @@
+{{with .Repository}}
+{{if and (not .IsEmpty) ($.Permission.CanRead $.UnitTypeCode)}}
+	{{/* GitHub's Fork button: the count inside, and a menu for existing forks and a new fork beside it. */}}
+	{{$disabled := or (not $.IsSigned) (and (not $.CanSignedUserFork) (not $.UserAndOrgForks))}}
+	<div class="theme-control-split repo-header-fork">
+		<a class="button theme-control theme-control-small repo-header-control{{if $.ShowForkModal}} show-modal{{end}}{{if $disabled}} disabled{{end}}"
+			{{if not $.IsSigned}}
+				data-tooltip-content="{{ctx.Locale.Tr "repo.fork_guest_user"}}"
+			{{else if and (not $.CanSignedUserFork) (not $.UserAndOrgForks)}}
+				data-tooltip-content="{{ctx.Locale.Tr "repo.fork_from_self"}}"
+			{{end}}
+			{{if not $.CanSignedUserFork}}
+				{{if gt (len $.UserAndOrgForks) 1}}
+					href="#" data-modal="#fork-repo-modal"
+				{{else if eq (len $.UserAndOrgForks) 1}}
+					href="{{AppSubUrl}}/{{(index $.UserAndOrgForks 0).FullName}}"
+				{{/*else is not required here, because the button shouldn't link to any site if you can't create a fork*/}}
+				{{end}}
+			{{else if not $.UserAndOrgForks}}
+				href="{{$.RepoLink}}/fork"
+			{{else}}
+				href="#" data-modal="#fork-repo-modal"
+			{{end}}
+		>
+			{{svg "octicon-repo-forked"}}<span class="text not-mobile">{{ctx.Locale.Tr "repo.fork"}}</span>
+			<span class="theme-counter theme-counter-tab" aria-label="{{ctx.Locale.TrPluralString .NumForks "fork.n_forks" (printf "%d" .NumForks)}}">{{CountFmt .NumForks}}</span>
+		</a>
+		{{template "components/common/dropdown/dropdown" dict "Kind" "actions" "Icon" "octicon-triangle-down" "IconOnly" true "Small" true "Label" (ctx.Locale.Tr "repo.forks") "Items" "repo/header_fork_menu" "Data" $}}
+		<dialog id="fork-repo-modal">
+			<article>
+				<header>{{ctx.Locale.Tr "repo.already_forked" .Name}}</header>
+				<div class="content tw-text-left">
+					<div class="ui list">
+						{{range $.UserAndOrgForks}}
+							<div class="ui item tw-py-2">
+								<a href="{{.Link}}">{{svg "octicon-repo-forked" 16 "tw-mr-2"}}{{.FullName}}</a>
+							</div>
+						{{end}}
+					</div>
+					{{if $.CanSignedUserFork}}
+					<div class="divider"></div>
+					<a href="{{$.RepoLink}}/fork">{{ctx.Locale.Tr "repo.fork_to_different_account"}}</a>
+					{{end}}
+				</div>
+			</article>
+		</dialog>
+	</div>
+{{end}}
+{{end}}
diff --git a/templates/repo/header_fork_menu.tmpl b/templates/repo/header_fork_menu.tmpl
new file mode 100644
index 00000000..7dbb3e8f
--- /dev/null
+++ b/templates/repo/header_fork_menu.tmpl
@@ -0,0 +1,4 @@
+<a class="theme-dropdown-action" href="{{.Repository.Link}}/forks">{{svg "octicon-repo-forked" 16}}{{ctx.Locale.Tr "repo.forks"}}</a>
+{{if .CanSignedUserFork}}
+	<a class="theme-dropdown-action" href="{{.RepoLink}}/fork">{{svg "octicon-plus" 16}}{{ctx.Locale.Tr "repo.fork_repo"}}</a>
+{{end}}
diff --git a/templates/repo/star_unstar.tmpl b/templates/repo/star_unstar.tmpl
new file mode 100644
index 00000000..9d32e522
--- /dev/null
+++ b/templates/repo/star_unstar.tmpl
@@ -0,0 +1,11 @@
+<form hx-target="this" hx-post="{{$.RepoLink}}/action/{{if $.IsStaringRepo}}un{{end}}star" hx-on::after-settle="this.querySelector('button').focus()" method="post" action="{{$.RepoLink}}/action/{{if $.IsStaringRepo}}un{{end}}star">
+	{{/* GitHub's Star button: one control with the count inside. Forgejo has no star lists, so there is no menu. */}}
+	<button type="submit" class="button theme-control theme-control-small repo-header-control{{if $.IsStaringRepo}} repo-header-starred{{end}}"{{if not $.IsSigned}} disabled data-tooltip-content="{{ctx.Locale.Tr "repo.star_guest_user"}}"{{end}} aria-label="{{if $.IsStaringRepo}}{{ctx.Locale.Tr "repo.unstar"}}{{else}}{{ctx.Locale.Tr "repo.star"}}{{end}}">
+		{{if $.IsStaringRepo}}
+			{{svg "octicon-star-fill"}}<span class="text not-mobile">{{ctx.Locale.Tr "repo.unstar"}}</span>
+		{{else}}
+			{{svg "octicon-star"}}<span class="text not-mobile">{{ctx.Locale.Tr "repo.star"}}</span>
+		{{end}}
+		<span class="theme-counter theme-counter-tab" aria-label="{{ctx.Locale.TrPluralString .Repository.NumStars "stars.n_stars" (printf "%d" .Repository.NumStars)}}">{{CountFmt .Repository.NumStars}}</span>
+	</button>
+</form>
diff --git a/templates/repo/view_content.tmpl b/templates/repo/view_content.tmpl
index 3ce3e28e..58543349 100644
--- a/templates/repo/view_content.tmpl
+++ b/templates/repo/view_content.tmpl
@@ -48,7 +48,7 @@
 		{{if and .CanWriteCode .IsViewBranch (not .Repository.IsMirror) (not .Repository.IsArchived) (not .IsViewFile)}}
 			<button class="ui dropdown basic compact jump button repo-add-file"{{if not .Repository.CanEnableEditor}} disabled{{end}}>
 				{{ctx.Locale.Tr "file_editor.add_file"}}
-				{{svg "octicon-triangle-down" 14 "dropdown icon"}}
+				{{svg "octicon-triangle-down" 16 "dropdown icon"}}
 				<div class="menu">
 					<a class="item" href="{{.RepoLink}}/_new/{{.BranchName | PathEscapeSegments}}/{{.TreePath | PathEscapeSegments}}">
 						{{svg "octicon-plus" 16}}{{ctx.Locale.Tr "file_editor.new_file"}}
diff --git a/templates/repo/watch_unwatch.tmpl b/templates/repo/watch_unwatch.tmpl
new file mode 100644
index 00000000..a2e847c2
--- /dev/null
+++ b/templates/repo/watch_unwatch.tmpl
@@ -0,0 +1,47 @@
+{{if $.IsSigned}}
+	<details class="dropdown" id="watch-button">
+		{{/* GitHub's Watch button: one control with the count inside, opening the notification choices. */}}
+		<summary class="button theme-control theme-control-small repo-header-control">
+			{{svg "octicon-eye" 16}}
+			<span class="text not-mobile">{{if $.RepoWatchSelection.IsWatching}}{{ctx.Locale.Tr "repo.watching"}}{{else}}{{ctx.Locale.Tr "repo.watch"}}{{end}}</span>
+			<span class="theme-counter theme-counter-tab" aria-label="{{ctx.Locale.TrPluralString .Repository.NumWatches "watch.n_watchers" (printf "%d" .Repository.NumWatches)}}">{{CountFmt .Repository.NumWatches}}</span>
+			{{svg "octicon-triangle-down" 16}}
+		</summary>
+		<div class="content">
+			<form class="ui form tw-p-3" hx-target="#watch-button" method="post" hx-post="{{$.RepoLink}}/action/watch/select" action="{{$.RepoLink}}/action/watch/select" hx-swap="outerHTML">
+				<fieldset>
+					<label>
+						<input type="checkbox" name="watch_issues" value="true" {{if $.RepoWatchSelection.Issues}}checked{{end}}>
+						{{svg "octicon-issue-opened"}}
+						{{ctx.Locale.Tr "repo.watch.issues"}}
+					</label>
+					<label>
+						<input type="checkbox" name="watch_pull_requests" value="true" {{if $.RepoWatchSelection.PullRequests}}checked{{end}}>
+						{{svg "octicon-git-pull-request"}}
+						{{ctx.Locale.Tr "repo.watch.pull_requests"}}
+					</label>
+					<label>
+						<input type="checkbox" name="watch_releases" value="true" {{if $.RepoWatchSelection.Releases}}checked{{end}}>
+						{{svg "octicon-tag"}}
+						{{ctx.Locale.Tr "repo.watch.releases"}}
+						<span class="help">{{ctx.Locale.Tr "repo.watch.releases.hint"}}</span>
+					</label>
+					<div class="small button-sequence tw-mt-3">
+						<button type="submit" class="primary button">{{ctx.Locale.Tr "save"}}</button>
+						{{if $.RepoWatchSelection.IsWatching}}
+							<button type="button" class="secondary button" hx-post="{{$.RepoLink}}/action/unwatch" hx-target="#watch-button" hx-swap="outerHTML">
+								{{ctx.Locale.Tr "repo.unwatch"}}
+							</button>
+						{{end}}
+					</div>
+				</fieldset>
+			</form>
+		</div>
+	</details>
+{{else}}
+	{{/* not logged-in user */}}
+	<a class="button theme-control theme-control-small repo-header-control" href="{{.RepoLink}}/watchers" data-tooltip-content="{{ctx.Locale.Tr "repo.watch_guest_user"}}">
+		{{svg "octicon-eye" 16}}<span class="text not-mobile">{{ctx.Locale.Tr "repo.watch"}}</span>
+		<span class="theme-counter theme-counter-tab" aria-label="{{ctx.Locale.TrPluralString .Repository.NumWatches "watch.n_watchers" (printf "%d" .Repository.NumWatches)}}">{{CountFmt .Repository.NumWatches}}</span>
+	</a>
+{{end}}
diff --git a/templates/user/overview/header.tmpl b/templates/user/overview/header.tmpl
index 14353694..c6b755b0 100644
--- a/templates/user/overview/header.tmpl
+++ b/templates/user/overview/header.tmpl
@@ -10,7 +10,7 @@
 		<a class="{{if eq .TabName "repositories"}}active {{end}} item" href="{{.ContextUser.HomeLink}}?tab=repositories"{{if eq .TabName "repositories"}} aria-current="page"{{end}}>
 			{{svg "octicon-repo"}} {{ctx.Locale.Tr "user.repositories"}}
 			{{if .RepoCount}}
-				<span class="theme-counter profile-nav-count">{{.RepoCount}}</span>
+				<span class="theme-counter theme-counter-tab profile-nav-count">{{.RepoCount}}</span>
 			{{end}}
 			<span hidden test-name="repository-count">{{.RepoCount}}</span>
 		</a>
@@ -18,7 +18,7 @@
 		<a href="{{.ContextUser.HomeLink}}/-/projects"{{if .PageIsViewProjects}} aria-current="page"{{end}} class="{{if .PageIsViewProjects}}active {{end}}item">
 			{{svg "octicon-project-symlink"}} {{ctx.Locale.Tr "user.projects"}}
 			{{if .ProjectCount}}
-				<span class="theme-counter profile-nav-count">{{.ProjectCount}}</span>
+				<span class="theme-counter theme-counter-tab profile-nav-count">{{.ProjectCount}}</span>
 			{{end}}
 			<span hidden test-name="project-count">{{.ProjectCount}}</span>
 		</a>
@@ -27,7 +27,7 @@
 			<a href="{{.ContextUser.HomeLink}}/-/packages"{{if .IsPackagesPage}} aria-current="page"{{end}} class="{{if .IsPackagesPage}}active {{end}}item">
 				{{svg "octicon-package"}} {{ctx.Locale.Tr "packages.title"}}
 				{{if .PackageCount}}
-					<span class="theme-counter profile-nav-count">{{.PackageCount}}</span>
+					<span class="theme-counter theme-counter-tab profile-nav-count">{{.PackageCount}}</span>
 				{{end}}
 				<span hidden test-name="package-count">{{.PackageCount}}</span>
 			</a>
@@ -52,7 +52,7 @@
 			<a class="{{if eq .TabName "stars"}}active {{end}}item" href="{{.ContextUser.HomeLink}}?tab=stars"{{if eq .TabName "stars"}} aria-current="page"{{end}}>
 				{{svg "octicon-star"}} {{ctx.Locale.Tr "user.starred"}}
 				{{if .ContextUser.NumStars}}
-					<span class="theme-counter profile-nav-count">{{.ContextUser.NumStars}}</span>
+					<span class="theme-counter theme-counter-tab profile-nav-count">{{.ContextUser.NumStars}}</span>
 				{{end}}
 			</a>
 			{{else}}