From 9f79dfdbdcc1e2f2361c8e1823e65d7ccb21c69f Mon Sep 17 00:00:00 2001
From: Cursor Agent <cursoragent@cursor.com>
Date: Thu, 16 Apr 2026 21:12:03 +0000
Subject: [PATCH] fix: restore left nav sidebar on blog post pages

The blog sidebar listing all posts was being hidden via CSS
(display: none !important) and the content forced to full-width.
This was replaced with a fixed 'Back to Blog' link that required
users to go back to the list page to navigate between posts.

Changes:
- Remove CSS that hides the blog sidebar on post pages
- Style sidebar to 260px width alongside constrained content
- Remove fixed BackLink component (sidebar handles navigation)
- Clean up unused BackLink styles from styles.module.css

The blog plugin already generates the sidebar (blogSidebarCount: 'ALL'),
so this just un-hides it.

Co-authored-by: Krrish Dholakia <krrish-berri-2@users.noreply.github.com>
---
 docs/my-website/src/css/custom.css            | 10 ++---
 .../src/theme/BlogPostPage/index.js           | 22 +---------
 .../src/theme/BlogPostPage/styles.module.css  | 41 -------------------
 3 files changed, 5 insertions(+), 68 deletions(-)

diff --git a/docs/my-website/src/css/custom.css b/docs/my-website/src/css/custom.css
index b036604cf1f..03f4d420356 100644
--- a/docs/my-website/src/css/custom.css
+++ b/docs/my-website/src/css/custom.css
@@ -799,17 +799,15 @@ video {
    BLOG — Ramp-style aesthetic
    ========================================= */
 
-/* Hide blog sidebar on post pages */
+/* Blog sidebar on post pages — keep visible for cross-post navigation */
 .blog-post-page aside.col {
-  display: none !important;
+  max-width: 260px;
+  flex: 0 0 260px;
 }
 
-/* Make blog post content full-width + constrained */
+/* Constrain blog post content when sidebar is visible */
 .blog-post-page main.col--7 {
-  --ifm-col-width: 100% !important;
   max-width: 820px !important;
-  margin: 0 auto !important;
-  flex: 0 0 100% !important;
 }
 
 /* Clean post header */
diff --git a/docs/my-website/src/theme/BlogPostPage/index.js b/docs/my-website/src/theme/BlogPostPage/index.js
index 05f34db24b1..49616c4dd43 100644
--- a/docs/my-website/src/theme/BlogPostPage/index.js
+++ b/docs/my-website/src/theme/BlogPostPage/index.js
@@ -1,20 +1,7 @@
-import React, {useEffect} from 'react';
+import React from 'react';
 import OriginalBlogPostPage from '@theme-original/BlogPostPage';
 import styles from './styles.module.css';
 
-function BackLink() {
-  return (
-    <div className={styles.backOuter}>
-      <a href="/blog" className={styles.backLink}>
-        <svg className={styles.backArrow} fill="none" stroke="currentColor" viewBox="0 0 24 24" aria-hidden="true">
-          <path strokeLinecap="round" strokeLinejoin="round" strokeWidth={2} d="M7 16l-4-4m0 0l4-4m-4 4h18" />
-        </svg>
-        Blog
-      </a>
-    </div>
-  );
-}
-
 function HiringCTA() {
   return (
     <div className={styles.ctaOuter}>
@@ -38,15 +25,8 @@ function HiringCTA() {
 }
 
 export default function BlogPostPage(props) {
-  // Add body class so CSS can hide the sidebar
-  useEffect(() => {
-    document.body.classList.add('blog-post-body');
-    return () => document.body.classList.remove('blog-post-body');
-  }, []);
-
   return (
     <>
-      <BackLink />
       <OriginalBlogPostPage {...props} />
       <HiringCTA />
     </>
diff --git a/docs/my-website/src/theme/BlogPostPage/styles.module.css b/docs/my-website/src/theme/BlogPostPage/styles.module.css
index 9666037803e..b9a0a479eba 100644
--- a/docs/my-website/src/theme/BlogPostPage/styles.module.css
+++ b/docs/my-website/src/theme/BlogPostPage/styles.module.css
@@ -1,44 +1,3 @@
-.backOuter {
-  position: fixed;
-  top: calc(var(--ifm-navbar-height, 60px) + 1rem);
-  left: 2rem;
-  z-index: 100;
-}
-
-.backLink {
-  display: inline-flex;
-  align-items: center;
-  gap: 0.375rem;
-  font-size: 0.875rem;
-  font-weight: 500;
-  color: #6b7280;
-  text-decoration: none !important;
-  transition: color 0.15s;
-}
-
-.backLink:hover {
-  color: #111827;
-}
-
-.backArrow {
-  width: 1rem;
-  height: 1rem;
-  transition: transform 0.15s;
-  flex-shrink: 0;
-}
-
-.backLink:hover .backArrow {
-  transform: translateX(-3px);
-}
-
-[data-theme='dark'] .backLink {
-  color: #9ca3af;
-}
-
-[data-theme='dark'] .backLink:hover {
-  color: #f9fafb;
-}
-
 .ctaOuter {
   max-width: 820px;
   margin: 0 auto;