From 33797ef427fbd0100f8f503ad80cdc89599be2fa Mon Sep 17 00:00:00 2001
From: nicolasito1411 <60229704+Marchand-Nicolas@users.noreply.github.com>
Date: Sat, 7 Oct 2023 12:30:39 +0200
Subject: [PATCH 1/2] Adding blur and fixing footer

---
 pages/categories/[category].tsx |  8 ++++++--
 styles/Home.module.css          |  2 ++
 styles/category.module.css      | 19 +++++++++++++++++++
 3 files changed, 27 insertions(+), 2 deletions(-)

diff --git a/pages/categories/[category].tsx b/pages/categories/[category].tsx
index ed245f6e..35251ae0 100644
--- a/pages/categories/[category].tsx
+++ b/pages/categories/[category].tsx
@@ -6,6 +6,7 @@ import styles from "../../styles/category.module.css";
 import homeStyles from "../../styles/Home.module.css";
 import Quest from "../../components/quests/quest";
 import BackButton from "../../components/UI/backButton";
+import Blur from "../../components/shapes/blur";
 
 const CategoriesPage: NextPage = () => {
   const router = useRouter();
@@ -20,8 +21,11 @@ const CategoriesPage: NextPage = () => {
   }, [categories, categoryName]);
 
   return (
-    <div className={homeStyles.screen}>
-      <div className={homeStyles.backButton}>
+    <div className={styles.screen}>
+      <div className={homeStyles.blur1}>
+        <Blur />
+      </div>
+      <div className={styles.backButton}>
         <BackButton onClick={() => router.back()} />
       </div>
       <h1 className={homeStyles.title}>Onboarding quests</h1>
diff --git a/styles/Home.module.css b/styles/Home.module.css
index 4a97e990..057f9597 100644
--- a/styles/Home.module.css
+++ b/styles/Home.module.css
@@ -103,6 +103,7 @@
   position: absolute;
   left: 0;
   top: 0;
+  z-index: -1;
 }
 
 .blur2 {
@@ -113,6 +114,7 @@
 
 .backButton {
   margin-left: 63px;
+  z-index: 10;
 }
 
 .controls {
diff --git a/styles/category.module.css b/styles/category.module.css
index 4e4ff350..e4eacc1c 100644
--- a/styles/category.module.css
+++ b/styles/category.module.css
@@ -1,3 +1,22 @@
+.screen {
+  z-index: 0;
+  position: relative;
+  padding-top: 12vh;
+  background-color: var(--background);
+  width: 100%;
+  min-height: calc(100vh - 117px - 2em);
+  display: flex;
+  justify-content: center;
+  flex-direction: column;
+}
+
+.backButton {
+  position: absolute;
+  margin-left: 63px;
+  z-index: 10;
+  top: 12vh;
+}
+
 .questList {
   display: flex;
   gap: 1rem;

From dbc1557a264eab915ca5851d8cac05867bde695b Mon Sep 17 00:00:00 2001
From: nicolasito1411 <60229704+Marchand-Nicolas@users.noreply.github.com>
Date: Mon, 9 Oct 2023 16:20:54 +0200
Subject: [PATCH 2/2] Adding a margin between footer and quests

---
 styles/category.module.css | 3 ++-
 1 file changed, 2 insertions(+), 1 deletion(-)

diff --git a/styles/category.module.css b/styles/category.module.css
index e4eacc1c..cad8ab82 100644
--- a/styles/category.module.css
+++ b/styles/category.module.css
@@ -4,10 +4,11 @@
   padding-top: 12vh;
   background-color: var(--background);
   width: 100%;
-  min-height: calc(100vh - 117px - 2em);
+  min-height: calc(100vh - 117px - 112px + 2em);
   display: flex;
   justify-content: center;
   flex-direction: column;
+  margin-bottom: calc(112px - 2em);
 }
 
 .backButton {