From 56521881a24a9c1167ae45d4a6ccdffb30ea3a7a Mon Sep 17 00:00:00 2001
From: Grace Park <gracepark@github.com>
Date: Tue, 16 Nov 2021 13:32:45 -0800
Subject: [PATCH] Adding scroll to header search results (#22874)

* adding scroll to header search results

* move search-result

* search-result data test id addition

* forgot s
---
 components/Search.module.scss | 5 +++++
 components/Search.tsx         | 5 ++++-
 2 files changed, 9 insertions(+), 1 deletion(-)

diff --git a/components/Search.module.scss b/components/Search.module.scss
index 45f9e19640db..f4e80759ffaa 100644
--- a/components/Search.module.scss
+++ b/components/Search.module.scss
@@ -64,3 +64,8 @@
   left: 0;
   display: block;
 }
+
+.headerSearchResults {
+  overflow-y: auto;
+  max-height: 80vh;
+}
diff --git a/components/Search.tsx b/components/Search.tsx
index 76f7019ffc59..c316ceb3bab9 100644
--- a/components/Search.tsx
+++ b/components/Search.tsx
@@ -319,7 +319,10 @@ function ShowSearchResults({
     }
 
     const ActionListResults = (
-      <div data-testid="search-results">
+      <div
+        data-testid="search-results"
+        className={cx('mt-3', isHeaderSearch && styles.headerSearchResults)}
+      >
         <div className="my-4">
           <p className="mx-4">
             You're searching the <span className="color-fg-attention">{searchVersion}</span>{' '}