Fix: ToC blog page fix (json-schema-org#721)

* toc blog page fix * removing unwanted shadow * Fix font style from bold to medium --------- Co-authored-by: Benjamin Granados <[email protected]>
Akshaybagai52 · May 30, 2024 · cb26cf6 · cb26cf6
1 parent d3321b7
commit cb26cf6
Show file tree

Hide file tree

Showing 4 changed files with 37 additions and 17 deletions.
diff --git a/components/Sidebar.tsx b/components/Sidebar.tsx
@@ -428,7 +428,7 @@ export const DocsNav = ({
       </div>
       {/* Reference */}
 
-      <div className='mb-2 bg-slate-200 dark:bg-slate-900 p-2 rounded border border-white shadow-lg  lg:border-hidden '>
+      <div className='mb-2 bg-slate-200 dark:bg-slate-900 p-2 rounded border border-white lg:border-hidden '>
         <div
           className='flex justify-between w-full items-center'
           onClick={handleClickReference}

diff --git a/components/StyledMarkdown.tsx b/components/StyledMarkdown.tsx
@@ -540,21 +540,41 @@ export function TableOfContentMarkdown({
               );
             },
           },
-          h2: {
-            component: ({ children }) => {
-              const slug = slugifyMarkdownHeadline(children);
-              return (
-                <a
-                  href={`#${slug}`}
-                  className='block cursor-pointer mb-3 max-sm:text-sm text-slate-600 dark:text-slate-300 leading-4 -ml-[9px] max-sm:-ml-[7px] font-medium'
-                >
-                  <span className='mr-1 text-blue-400 text-[1em]'>&#9679;</span>
-                  {children}
-                </a>
-              );
-            },
-          },
+
           /* eslint-disable */
+          h2:
+            depth === 0
+              ? {
+                  component: ({ children }) => {
+                    const slug = slugifyMarkdownHeadline(children);
+                    return (
+                      <a
+                        href={`#${slug}`}
+                        className='block cursor-pointer mb-3 text-slate-600  dark:text-slate-300 leading-4 font-medium'
+                      >
+                        {children}
+                      </a>
+                    );
+                  },
+                }
+              : depth >= 2
+                ? {
+                    component: ({ children }) => {
+                      const slug = slugifyMarkdownHeadline(children);
+                      return (
+                        <a
+                          href={`#${slug}`}
+                          className='block cursor-pointer mb-3 max-sm:text-sm text-slate-600 dark:text-slate-300 leading-4 -ml-[9px] max-sm:-ml-[7px] font-medium'
+                        >
+                          <span className='mr-1 text-blue-400 text-[1em]'>
+                            &#9679;
+                          </span>
+                          {children}
+                        </a>
+                      );
+                    },
+                  }
+                : { component: () => null },
           h3:
             depth >= 3
               ? {

diff --git a/pages/blog/posts/[slug].page.tsx b/pages/blog/posts/[slug].page.tsx
@@ -92,7 +92,7 @@ export default function StaticMarkdownPage({
                     },
                   )}
                 </div>
-                <div className='pt-4 pr-4 border-r border-slate-100 hidden lg:block w-full'>
+                <div className='pt-4 pr-4 hidden lg:block w-full'>
                   <div className='uppercase text-xs text-slate-400 mb-4'>
                     on this page
                   </div>

diff --git a/pages/blog/posts/understanding-lexical-dynamic-scopes.md b/pages/blog/posts/understanding-lexical-dynamic-scopes.md
@@ -407,6 +407,6 @@ Schema](https://www.oreilly.com/library/view/unifying-business-data/978109814499
 You can also connect with me on
 [LinkedIn](https://www.linkedin.com/in/jviotti/).
 
-***
+
 
 *Image by [Christina Morillo](https://www.pexels.com/@divinetechygirl/) from [Pexels](https://www.pexels.com/photo/man-standing-infront-of-white-board-1181345/).*