From e04aed55bed1c4aa0a46e36a58d2aa2e5b06910b Mon Sep 17 00:00:00 2001
From: Hrishikesh Agarwal <hrishikeshagarwalv@gmail.com>
Date: Sat, 26 Feb 2022 00:54:04 +0530
Subject: [PATCH] fixed alignment of arrows

Signed-off-by: Hrishikesh Agarwal <hrishikeshagarwalv@gmail.com>
---
 src/assets/scss/components/dropdown.scss |  5 ++++
 src/assets/scss/components/search.scss   |  2 +-
 src/components/Dropdown.js               | 29 ++++++++++++++----------
 3 files changed, 23 insertions(+), 13 deletions(-)

diff --git a/src/assets/scss/components/dropdown.scss b/src/assets/scss/components/dropdown.scss
index 2672cccb..e7d39126 100644
--- a/src/assets/scss/components/dropdown.scss
+++ b/src/assets/scss/components/dropdown.scss
@@ -23,6 +23,7 @@
 
   .curr {
     margin-top: 0.6em;
+    margin-left: -1.2em;
   }
 }
 
@@ -97,6 +98,10 @@
   opacity: 0.08;
 }
 
+.dropdown-button{
+  display: flex;
+}
+
 @media only screen and (max-width: 500px) {
   .dropdown-container {
     padding: 0px;
diff --git a/src/assets/scss/components/search.scss b/src/assets/scss/components/search.scss
index bee6a72e..f2aeb49d 100644
--- a/src/assets/scss/components/search.scss
+++ b/src/assets/scss/components/search.scss
@@ -18,7 +18,7 @@
     }
 
     .eos-icons {
-      padding: 0px;
+      padding: 7px 0px 0px 0px;
     }
   }
 
diff --git a/src/components/Dropdown.js b/src/components/Dropdown.js
index af265764..978560ed 100644
--- a/src/components/Dropdown.js
+++ b/src/components/Dropdown.js
@@ -48,18 +48,23 @@ const Dropdown = (props) => {
       <div className='dropdown-main'>
         <div className='filter-title'>{title}</div>
         <div className='dropdown-container' ref={reference} {...rest}>
-          <Button
-            type='button'
-            className='btn btn-transparent flex flex-row'
-            onClick={handleDropdownState}
-          >
-            {dropdownState ? (
-              <EOS_KEYBOARD_ARROW_UP className='eos-icons' />
-            ) : (
-              <EOS_KEYBOARD_ARROW_DOWN className='eos-icons' />
-            )}
-            &nbsp; <div className='curr'> {curr} </div>
-          </Button>
+          <div className='dropdown-button'>
+            <div>
+              <Button
+                type='button'
+                className='btn btn-transparent flex flex-row'
+                onClick={handleDropdownState}
+              >
+                {dropdownState ? (
+                  <EOS_KEYBOARD_ARROW_UP className='eos-icons' />
+                ) : (
+                  <EOS_KEYBOARD_ARROW_DOWN className='eos-icons' />
+                )}
+                &nbsp;
+              </Button>
+            </div>
+            <div className='curr'> {curr} </div>
+          </div>
           <div
             className={`dropdown ${
               dropdownState