From a1eeb061895c561eae04609806d7bdd195a8ad69 Mon Sep 17 00:00:00 2001
From: nlok5923 <nlokhande5923@gmail.com>
Date: Fri, 12 Mar 2021 08:58:34 +0530
Subject: [PATCH] created seperate style file for explore

---
 package-lock.json                    |  6 +++---
 package.json                         |  6 +++---
 src/pages/explore/Explore.module.css | 14 ++++++++++++++
 src/pages/explore/index.jsx          | 17 ++++-------------
 4 files changed, 24 insertions(+), 19 deletions(-)
 create mode 100644 src/pages/explore/Explore.module.css

diff --git a/package-lock.json b/package-lock.json
index ef31ed4..06f21f8 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -12225,9 +12225,9 @@
       }
     },
     "react-native-elements": {
-      "version": "3.3.0",
-      "resolved": "https://registry.npmjs.org/react-native-elements/-/react-native-elements-3.3.0.tgz",
-      "integrity": "sha512-GNvS7/26WNo0ovZ2vQWRFWJxhyDeBrGakFSX0aCey69B6KtZQh8gaFGF6CutlRjMzVfZTHGU2+0NS8A0dNWhAA==",
+      "version": "3.3.1",
+      "resolved": "https://registry.npmjs.org/react-native-elements/-/react-native-elements-3.3.1.tgz",
+      "integrity": "sha512-vK6GVliIQMbwNpNxRRyqFTb5ErrSN7+a2VxBUN5cqSu9B8rWG862M/lv9oWplkFOlPkL/a2xkzruoWSoN8HNhw==",
       "requires": {
         "@types/react-native-vector-icons": "^6.4.6",
         "color": "^3.1.2",
diff --git a/package.json b/package.json
index eb6b507..e6e417d 100644
--- a/package.json
+++ b/package.json
@@ -15,7 +15,7 @@
     "react-dom": "^16.13.0",
     "react-helmet": "^6.1.0",
     "react-lottie": "^1.2.3",
-    "react-native-elements": "latest",
+    "react-native-elements": "^3.3.1",
     "react-native-safe-area-context": "^3.2.0",
     "react-native-vector-icons": "^6.7.0",
     "react-native-web": "^0.12.0",
@@ -52,8 +52,8 @@
     "@babel/plugin-proposal-class-properties": "^7.10.4",
     "customize-cra": "^1.0.0",
     "gh-pages": "^3.1.0",
-    "patch-package": "^6.2.2",
+    "patch-package": "^6.4.6",
     "postinstall-postinstall": "^2.1.0",
-    "react-app-rewired": "^2.1.6"
+    "react-app-rewired": "^2.1.8"
   }
 }
diff --git a/src/pages/explore/Explore.module.css b/src/pages/explore/Explore.module.css
new file mode 100644
index 0000000..91856f1
--- /dev/null
+++ b/src/pages/explore/Explore.module.css
@@ -0,0 +1,14 @@
+.paper__position {
+    height: 60px;
+    padding: 5px 10px;
+    align-items: center;
+    display: flex;
+    position: relative;
+}
+.arrowforward__position {
+    position: absolute;
+    right: 10px;
+}
+.grid__position {
+    margin-top: 10;
+}
\ No newline at end of file
diff --git a/src/pages/explore/index.jsx b/src/pages/explore/index.jsx
index 96f8289..ee3c8ac 100644
--- a/src/pages/explore/index.jsx
+++ b/src/pages/explore/index.jsx
@@ -2,7 +2,7 @@ import React from "react";
 import { Typography, Paper, Grid } from "@material-ui/core";
 import { Link } from "react-router-dom";
 import { ArrowForward } from "@material-ui/icons";
-
+import styles from "./Explore.module.css"
 import { Components_Index } from "../../containers/Navigation";
 
 function Expore() {
@@ -10,23 +10,14 @@ function Expore() {
     <section>
       <Typography variant="h2">Explore</Typography>
 
-      <Grid container spacing={1} style={{ marginTop: 20 }}>
+      <Grid container spacing={1} className={styles.grid__position} >
         {Components_Index.map((elm, idx) => {
           return (
             <Grid item xs={12} sm={6} md={4} lg={3}>
               <Link to={elm.path}>
-                <Paper
-                  style={{
-                    height: 60,
-                    padding: "5px 10px",
-                    alignItems: "center",
-                    display: "flex",
-                    position: "relative",
-                  }}
-                >
+                <Paper className={styles.paper__position}>
                   <Typography variant="h5">{elm.name}</Typography>
-
-                  <ArrowForward style={{ position: "absolute", right: 10 }} />
+                  <ArrowForward className={styles.arrowforward__position} />
                 </Paper>
               </Link>
             </Grid>