Mergifyio · mergify · May 11, 2026 · May 11, 2026
diff --git a/src/components/Header/Header.astro b/src/components/Header/Header.astro
@@ -243,7 +243,7 @@ const primaryLink = isEnterpriseSection
 		margin: 0;
 	}
 
-	@media (max-width: 87em) {
+	@media (max-width: 68em) {
 		.nav-buttons {
 			display: none !important;
 		}

diff --git a/src/components/PageContent/PageContent.astro b/src/components/PageContent/PageContent.astro
@@ -1,5 +1,5 @@
 ---
-import { CollectionEntry } from 'astro:content';
+import type { CollectionEntry } from 'astro:content';
 export interface Props {
   content: CollectionEntry<'docs'>['data'];
 }
@@ -18,7 +18,13 @@ const suppressTitle = content.suppressTitle;
 		<section class="main-section">
 			<header>
 				<slot name="before-title" />
-				{!suppressTitle && <h1 class="content-title" id="overview" set:html={title} />}
+				{!suppressTitle && (
+					<h1
+						class:list={['content-title', content.hubAccent && 'hero-accent']}
+						id="overview"
+						set:html={title}
+					/>
+				)}
 				{!suppressTitle && (
 					<h2 class="content-subtitle" data-toc-ignore set:html={description} />
 				)}

diff --git a/src/components/RightSidebar/RightSidebar.astro b/src/components/RightSidebar/RightSidebar.astro
@@ -1,30 +1,54 @@
 ---
 import generateToc from '../../util/generateToc';
+import PageFeedback from '../PageFeedback.astro';
 import TableOfContents from './TableOfContents';
 
 const { headings } = Astro.props;
 ---
 
-<nav aria-label={'Secondary'}>
-	{
-		headings && (
+{
+	headings && (
+		<nav aria-label={'Secondary'}>
 			<TableOfContents
 				client:media="(min-width: 50em)"
 				toc={generateToc(headings)}
 				labels={{ onThisPage: 'On this page' }}
 				isMobile={false}
 			/>
-		)
-	}
-</nav>
+		</nav>
+	)
+}
+
+<div class="page-actions">
+	<PageFeedback />
+</div>
 
 <style>
-	nav {
+	nav,
+	.page-actions {
 		width: 100%;
-		padding-block: var(--doc-padding-block);
 		padding-inline-end: var(--min-spacing-inline);
 		padding-inline-start: 0;
-		overflow: auto;
 		font-size: var(--theme-text-md);
 	}
+	nav {
+		padding-block: var(--doc-padding-block);
+		overflow: auto;
+	}
+	.page-actions {
+		margin-top: 2rem;
+		margin-bottom: 2rem;
+		padding-top: 1.25rem;
+		border-top: 1px solid var(--theme-divider);
+		display: flex;
+		flex-direction: column;
+		gap: 1rem;
+	}
+	/* PageFeedback was designed for the article footer with its own
+	   margin-top + padding-top. Inside .page-actions those are redundant
+	   (the wrapper already separates from the ToC), so zero them out. */
+	.page-actions :global(.page-feedback) {
+		margin-top: 0;
+		padding-top: 0;
+	}
 </style>
diff --git a/src/content.config.ts b/src/content.config.ts
@@ -13,6 +13,7 @@ const docs = defineCollection({
     title: z.string(),
     description: z.string(),
     suppressTitle: z.boolean().optional(),
+    hubAccent: z.boolean().optional(),
   }),
 });
 

diff --git a/src/content/docs/ci-insights.mdx b/src/content/docs/ci-insights.mdx
@@ -1,6 +1,7 @@
 ---
 title: CI Insights
 description: Optimize your CI run time, catch flaky tests, and give developers actionable insights so your team ships code faster.
+hubAccent: true
 ---
 
 import Docset from '../../components/DocsetGrid/Docset.astro';

diff --git a/src/content/docs/index.mdx b/src/content/docs/index.mdx
@@ -62,7 +62,7 @@ import mergeQueueHero from './images/merge-queue-hero.jpg';
   {/* -------------- PROBLEM CARDS -------------- */}
 
   <section class="home-problems">
-    <h2 class="no-counter">What problem are you solving?</h2>
+    <h2>What problem are you solving?</h2>
     <div class="home-problems-grid">
       <a href="/merge-queue" class="home-problem-card" data-product="merge-queue">
         <div class="home-problem-title">Broken main, slow merges</div>
@@ -91,7 +91,7 @@ import mergeQueueHero from './images/merge-queue-hero.jpg';
   {/* -------------- PRODUCTS -------------- */}
 
   <section id="products" class="home-products">
-    <h2 class="no-counter">Products</h2>
+    <h2>Products</h2>
     <div class="home-products-grid">
     <DocsetGrid>
       <Docset title="Merge Queue" path="/merge-queue" icon="mergify:merge-queue">
@@ -141,7 +141,7 @@ import mergeQueueHero from './images/merge-queue-hero.jpg';
   {/* -------------- COMMUNITY -------------- */}
 
   <section class="community">
-    <h2 class="no-counter">Community</h2>
+    <h2>Community</h2>
     <p>Share feedback, ask questions, and see what other teams build with Mergify.</p>
     <div class="community-buttons">
       <CommunityButton href="https://github.com/Mergifyio/mergify/discussions" icon="simple-icons:github" />

diff --git a/src/content/docs/merge-queue.mdx b/src/content/docs/merge-queue.mdx
@@ -1,6 +1,7 @@
 ---
 title: Merge Queue
 description: Ship faster with zero broken builds. Parallel testing, smart batching, and CI cost optimization.
+hubAccent: true
 ---
 
 import Button from '~/components/Button.astro';

diff --git a/src/content/docs/test-insights.mdx b/src/content/docs/test-insights.mdx
@@ -1,6 +1,7 @@
 ---
 title: Test Insights
 description: Monitor, detect, and manage unreliable tests across your repositories.
+hubAccent: true
 ---
 
 Test Insights helps you manage test reliability across the full lifecycle.

diff --git a/src/layouts/BaseLayout.astro b/src/layouts/BaseLayout.astro
@@ -115,6 +115,7 @@ const canonicalURL = new URL(Astro.url.pathname.replace(/([^/])$/, '$1/'), Astro
 				}
 				#right-sidebar {
 					display: flex;
+					flex-direction: column;
 				}
 			}
 		</style>

diff --git a/src/layouts/MainLayout.astro b/src/layouts/MainLayout.astro
@@ -23,7 +23,7 @@ const { content, headings, breadcrumbTitle, showMarkdownActions = true } = Astro
 ---
 
 <BaseLayout {...Astro.props}>
-	<RightSidebar slot="secondary-sidebar" {...{ content, headings }} />
+	<RightSidebar slot="secondary-sidebar" headings={headings} />
 	<PageContent {...{ content }}>
 		{
 			Astro.url.pathname !== '/' && (
@@ -63,10 +63,24 @@ const { content, headings, breadcrumbTitle, showMarkdownActions = true } = Astro
 		{
 			Astro.url.pathname !== '/' && (
 				<Fragment slot="after-content">
-					<PageFeedback />
+					{/* PageFeedback also lives in the right sidebar (visible ≥82em).
+					    Hide this footer copy on wide viewports so it doesn't double up. */}
+					<div class="article-page-feedback">
+						<PageFeedback />
+					</div>
 					{showMarkdownActions && <PageMeta pathname={Astro.url.pathname} />}
 				</Fragment>
 			)
 		}
 	</PageContent>
 </BaseLayout>
+
+<style>
+	/* The right sidebar (≥82em) hosts a PageFeedback widget. To avoid showing
+	   the same widget twice on wide viewports, hide the article-footer copy. */
+	@media (min-width: 82em) {
+		.article-page-feedback {
+			display: none;
+		}
+	}
+</style>
diff --git a/src/pages/changelog/[slug].astro b/src/pages/changelog/[slug].astro
@@ -147,14 +147,6 @@ const accent = getProductAccent(primaryTag);
         font-size: 1.75rem;
       }
     }
-    /* Disable global heading auto-numbering */
-    .changelog-detail .detail-title {
-      counter-increment: none !important;
-    }
-    .changelog-detail .detail-title::before {
-      content: none !important;
-    }
-
     .detail-date {
       font-size: 0.8125rem;
       color: var(--theme-text-muted);
@@ -300,13 +292,6 @@ const accent = getProductAccent(primaryTag);
       font-weight: 700;
       margin: 0 0 14px;
     }
-    /* Disable global heading auto-numbering on related-heading */
-    .changelog-detail .related-heading {
-      counter-increment: none !important;
-    }
-    .changelog-detail .related-heading::before {
-      content: none !important;
-    }
     .related-grid {
       display: grid;
       grid-template-columns: 1fr 1fr;

diff --git a/src/pages/changelog/index.astro b/src/pages/changelog/index.astro
@@ -283,13 +283,6 @@ const description = 'Latest product updates from Mergify.';
       background: var(--theme-text);
     }
 
-    /* Year / month headings — disable global numbering */
-    .changelog-page .cl-year > .cl-year-heading {
-      counter-increment: none !important;
-    }
-    .changelog-page .cl-year > .cl-year-heading::before {
-      content: none !important;
-    }
     .cl-year {
       margin-bottom: 0;
     }

diff --git a/src/styles/api-reference.css b/src/styles/api-reference.css
@@ -113,11 +113,6 @@
   margin: 0 0 0.5rem !important;
   color: var(--theme-text);
   scroll-margin-top: calc(var(--theme-navbar-height) + 1rem);
-  counter-increment: none;
-}
-
-.endpoint-heading::before {
-  content: none !important;
 }
 
 .endpoint-head {

diff --git a/src/styles/index.css b/src/styles/index.css
@@ -826,6 +826,10 @@ pre {
   margin-bottom: 0.25em;
 }
 
+.content-title.hero-accent {
+  color: var(--section-accent);
+}
+
 #main-content h2.content-subtitle,
 .content-subtitle {
   font-size: 1.125rem;
@@ -866,20 +870,3 @@ pre {
 header .nav-wrapper {
   height: 100%;
 }
-
-article.content {
-  counter-reset: h2-section;
-}
-
-.content h2:not(.content-subtitle):not(.no-counter) {
-  counter-increment: h2-section;
-  position: relative;
-}
-
-.content h2:not(.content-subtitle):not(.no-counter)::before {
-  content: counter(h2-section);
-  font-weight: 500;
-  margin-right: 0.55rem;
-  color: var(--theme-text-muted);
-  opacity: 0.6;
-}