From 76eb9a84be8e4660b786387b21a97c4880feff78 Mon Sep 17 00:00:00 2001
From: muhammad-ammar <mammar@gmail.com>
Date: Wed, 24 Mar 2021 18:35:14 +0500
Subject: [PATCH] feat: fix styling

---
 src/course-search/TypeaheadFacetDropdown.jsx   | 2 +-
 src/course-search/styles/_FacetList.scss       | 1 +
 src/course-search/tests/FacetListBase.test.jsx | 6 +++++-
 3 files changed, 7 insertions(+), 2 deletions(-)

diff --git a/src/course-search/TypeaheadFacetDropdown.jsx b/src/course-search/TypeaheadFacetDropdown.jsx
index 0976852da..3fa59fcf3 100644
--- a/src/course-search/TypeaheadFacetDropdown.jsx
+++ b/src/course-search/TypeaheadFacetDropdown.jsx
@@ -21,7 +21,7 @@ const TypeaheadFacetDropdown = ({
 
   const transformMenuOptions = menuOptions => (
     <>
-      <div className="p-2">
+      <div className="pr-2 pl-2 pb-2">
         <Input
           autoFocus
           type="search"
diff --git a/src/course-search/styles/_FacetList.scss b/src/course-search/styles/_FacetList.scss
index 163d4ac20..6ffda719d 100644
--- a/src/course-search/styles/_FacetList.scss
+++ b/src/course-search/styles/_FacetList.scss
@@ -32,6 +32,7 @@ $facet-dropdown-max-height: 250px;
   .typeahead {
     .dropdown-menu {
       max-height: unset;
+      overflow-y: unset;
 
       .typeahead-dropdown-menu-scrollable-items {
         max-height: $facet-dropdown-max-height;
diff --git a/src/course-search/tests/FacetListBase.test.jsx b/src/course-search/tests/FacetListBase.test.jsx
index 00a3b363f..4150c2a71 100644
--- a/src/course-search/tests/FacetListBase.test.jsx
+++ b/src/course-search/tests/FacetListBase.test.jsx
@@ -45,7 +45,11 @@ const searchableDropdownProps = {
   searchForItems: jest.fn(),
   searchable: true,
   isBold: true,
-  typeaheadOptions: { placeholder: 'Find a skill', ariaLabel: 'Type to find a skill', minLength: 3 },
+  typeaheadOptions: {
+    placeholder: 'Find a skill...',
+    ariaLabel: 'Type to find a skill',
+    minLength: 3,
+  },
 };
 
 describe('<FacetListBase />', () => {