wrapped the div into FilterWrapper

Signed-off-by: Divyanshu Gupta <[email protected]>

Author: Mash707

src/sections/Community/Members-grid/Dropdown.js

@@ -7,6 +7,7 @@ import Select from "react-select";
 import { Container } from "../../../reusecore/Layout";
 import PageHeader from "../../../reusecore/PageHeader";
 import { selectStyles, dropdownTheme } from "./membersGrid.style";
+import { FilterWrapper } from "./membersGrid.style";
 
 const Dropdown = (props) => {
   return (
@@ -17,16 +18,7 @@ const Dropdown = (props) => {
         subtitle="A warm and welcoming collection of open sourcers"
       />
       <Container>
-        <div
-          style={{
-            display: "flex",
-            position: "relative",
-            alignItems: "center",
-            justifyContent: "flex-end",
-            width: "100%",
-            zIndex: 100
-          }}
-        >
+        <FilterWrapper>
           <Select
             name="Filter Members"
             defaultValue={[props.defaultOption]}
@@ -38,8 +30,7 @@ const Dropdown = (props) => {
             theme={dropdownTheme}
             isMulti
           />
-        </div>
-
+        </FilterWrapper>
         <br />
       </Container>
     </>

src/sections/Community/Members-grid/membersGrid.style.js

@@ -240,3 +240,12 @@ export const MembersGridWrapper = styled.div`
     }
   }
 `;
+
+export const FilterWrapper = styled.div`
+  display: flex;
+  position: relative;
+  align-items: center;
+  justify-content: flex-end;
+  width: 100%;
+  z-index: 100
+`;