From 208c0dc3fc8ad1024fa0f43b31c5ba2e5f775639 Mon Sep 17 00:00:00 2001
From: Andrei Alecu <andreialecu@users.noreply.github.com>
Date: Mon, 29 Mar 2021 11:59:55 +0300
Subject: [PATCH] docs: fix h1 css leaking into search results (#2643)

---
 packages/gatsby/src/components/markdown.js  | 24 +++++++++++----------
 packages/gatsby/src/components/toc/index.js |  2 +-
 2 files changed, 14 insertions(+), 12 deletions(-)

diff --git a/packages/gatsby/src/components/markdown.js b/packages/gatsby/src/components/markdown.js
index 9dc3569db715..8020c0e5621d 100644
--- a/packages/gatsby/src/components/markdown.js
+++ b/packages/gatsby/src/components/markdown.js
@@ -10,13 +10,19 @@ const Container = styled.article`
   line-height: 1.7;
 `;
 
+const TitleContainer = styled.div`
+  border-bottom: 1px solid;
+  display: flex;
+  align-items: baseline;
+  justify-content: space-between;
+
+  flex-wrap: wrap-reverse;
+`;
 const Title = styled.h1`
   box-sizing: border-box;
 
   margin: 0;
 
-  border-bottom: 1px solid;
-
   font-weight: 600;
   font-size: 2rem;
   line-height: 4rem;
@@ -24,12 +30,6 @@ const Title = styled.h1`
   + div > blockquote {
     font-style: normal;
   }
-
-  display: flex;
-  align-items: baseline;
-  justify-content: space-between;
-
-  flex-wrap: wrap-reverse;
 `;
 
 const EditLink = styled.a`
@@ -175,10 +175,12 @@ const Content = styled.div`
 
 export const PrerenderedMarkdown = ({title, children, editUrl}) => <>
   <Container>
-    <Title title={title}>
-      {title.match(/^`.*`$/) ? <code>{title.slice(1, -1)}</code> : title}
+    <TitleContainer>
+      <Title>
+        {title.match(/^`.*`$/) ? <code>{title.slice(1, -1)}</code> : title}
+      </Title>
       {editUrl && <EditLink target="_blank" href={editUrl}>Edit this page on GitHub</EditLink>}
-    </Title>
+    </TitleContainer>
     <Content dangerouslySetInnerHTML={{__html: children}} />
   </Container>
 </>;
diff --git a/packages/gatsby/src/components/toc/index.js b/packages/gatsby/src/components/toc/index.js
index a633a3531764..a3977ee4b7cd 100644
--- a/packages/gatsby/src/components/toc/index.js
+++ b/packages/gatsby/src/components/toc/index.js
@@ -189,7 +189,7 @@ export const Toc = ({ headingSelector, getTitle, getDepth, ...rest }) => {
       headingSelector || Array.from({ length: 6 }, (_, i) => `article h` + (i + 1))
     const nodes = Array.from(document.querySelectorAll(selector))
     const titles = nodes.map(node => ({
-      title: getTitle ? getTitle(node) : (node.title || node.innerText || node.textContent),
+      title: getTitle ? getTitle(node) : (node.innerText || node.textContent),
       depth: getDepth ? getDepth(node) : Number(node.nodeName[1]),
     }))
     // Compute the minimum heading depth. Will be subtracted from each heading's