From aae9a63cd2833e9ac67e0387cc4ddf77496af7a3 Mon Sep 17 00:00:00 2001
From: Onuwa Nnachi Isaac <matrix4u2002@gmail.com>
Date: Thu, 25 Jul 2019 07:17:32 +0100
Subject: [PATCH] Fix outstanding issues #14

---
 .../components/DappListItem/DappListItem.jsx     |  4 +++-
 src/common/components/Modal/Modal.module.scss    |  4 +++-
 .../HighestRanked/HighestRanked.module.scss      | 14 +-------------
 src/modules/HowToSubmit/HowToSubmit.module.scss  |  6 +++++-
 .../RecentlyAdded/RecentlyAdded.module.scss      | 16 ++--------------
 5 files changed, 14 insertions(+), 30 deletions(-)

diff --git a/src/common/components/DappListItem/DappListItem.jsx b/src/common/components/DappListItem/DappListItem.jsx
index 7cab2da..bc90a4d 100644
--- a/src/common/components/DappListItem/DappListItem.jsx
+++ b/src/common/components/DappListItem/DappListItem.jsx
@@ -36,7 +36,9 @@ const DappListItem = props => {
         isRanked ? styles.rankedListItem : styles.listItem
       } ${visible ? '' : styles.transparent}`}
     >
-      {isRanked && <div className={styles.position}>{position}</div>}
+      {isRanked && (
+        <div className={position ? styles.position : null}>{position}</div>
+      )}
       <div
         className={styles.imgWrapper}
         onClick={() => onToggleProfileModal(dapp.id, name)}
diff --git a/src/common/components/Modal/Modal.module.scss b/src/common/components/Modal/Modal.module.scss
index 8dc115f..d4b2624 100644
--- a/src/common/components/Modal/Modal.module.scss
+++ b/src/common/components/Modal/Modal.module.scss
@@ -45,7 +45,9 @@
     background: #939ba1;
     cursor: pointer;
     transform: rotate(45deg);
-    z-index: 99;
+    z-index: 999;
+    position: sticky;
+    margin-left: 90%;
   }
 }
 
diff --git a/src/modules/HighestRanked/HighestRanked.module.scss b/src/modules/HighestRanked/HighestRanked.module.scss
index ee2bcda..3653bb6 100644
--- a/src/modules/HighestRanked/HighestRanked.module.scss
+++ b/src/modules/HighestRanked/HighestRanked.module.scss
@@ -18,18 +18,6 @@
 
   @media (min-width: $desktop) {
     // grid-auto-flow: row;
-    grid-template-rows: repeat(4, 1fr);
-    grid-template-columns: unset;
-    overflow-x: hidden;
-  }
-
-  @media (min-width: 970px) {
-    grid-template-columns: unset;
-    grid-template-rows: repeat(4, 1fr);
-  }
-
-  @media (min-width: 1300px) {
-    grid-template-columns: unset;
-    grid-template-rows: repeat(4, 1fr);
+    grid-template-columns: repeat(3, 1fr);
   }
 }
diff --git a/src/modules/HowToSubmit/HowToSubmit.module.scss b/src/modules/HowToSubmit/HowToSubmit.module.scss
index 6d25187..88462a6 100644
--- a/src/modules/HowToSubmit/HowToSubmit.module.scss
+++ b/src/modules/HowToSubmit/HowToSubmit.module.scss
@@ -17,7 +17,8 @@
   padding: calculateRem(10) 0;
   position: sticky;
   top: 0;
-  background: #fff;
+  z-index: 99;
+  background: #ffffff;
   border-bottom: 1px solid #f7f7f7;
 }
 
@@ -79,6 +80,9 @@ a {
   height: 64px;
   display: flex;
   align-items: center;
+  position: sticky;
+  bottom: 0;
+  background: #ffffff;
   justify-content: center;
   border-top: 1px solid #f7f7f7;
 
diff --git a/src/modules/RecentlyAdded/RecentlyAdded.module.scss b/src/modules/RecentlyAdded/RecentlyAdded.module.scss
index 8b19c17..fb87584 100644
--- a/src/modules/RecentlyAdded/RecentlyAdded.module.scss
+++ b/src/modules/RecentlyAdded/RecentlyAdded.module.scss
@@ -10,7 +10,7 @@
 .grid {
   display: grid;
   grid-auto-flow: column;
-  grid-template-columns: repeat(3, 1fr);
+  grid-template-rows: repeat(3, 1fr);
   grid-gap: calculateRem(20);
   overflow-x: scroll;
   overflow-y: hidden;
@@ -19,18 +19,6 @@
 
   @media (min-width: $desktop) {
     // grid-auto-flow: row;
-    grid-template-rows: repeat(3, 1fr);
-    grid-template-columns: unset;
-    overflow-x: hidden;
-  }
-
-  @media (min-width: 970px) {
-    grid-template-columns: unset;
-    grid-template-rows: repeat(3, 1fr);
-  }
-
-  @media (min-width: 1300px) {
-    grid-template-columns: unset;
-    grid-template-rows: repeat(3, 1fr);
+    grid-template-columns: repeat(3, 1fr);
   }
 }