From f95212062e559f247bfdb1f7eef9fb65dde4fd03 Mon Sep 17 00:00:00 2001
From: Keyvan Sadeghi <ksa128@uit.no>
Date: Sun, 2 Jun 2024 21:18:21 +0200
Subject: [PATCH 1/7] added color to the background in the footer

---
 src/components/molecules/footer/Footer.tsx | 9 ++++++---
 src/styles/colors.scss                     | 2 ++
 2 files changed, 8 insertions(+), 3 deletions(-)

diff --git a/src/components/molecules/footer/Footer.tsx b/src/components/molecules/footer/Footer.tsx
index ee300786..658d7b36 100644
--- a/src/components/molecules/footer/Footer.tsx
+++ b/src/components/molecules/footer/Footer.tsx
@@ -85,11 +85,14 @@ const Footer: React.FC = () => {
   // uses margin auto, needs parent page to have minHeight=100vh if content is not over 100vh
   return (
     <Flex
-      my="2rem"
+      my="0rem"
       w="100%"
       direction={{ base: 'column', lg: 'row' }}
-      mt="auto">
-      <Flex justify="space-evenly" width={{ base: '100%', lg: '60%' }}>
+      mt="auto"
+      style={{background: '#11131d', paddingTop: '2rem'}}>
+      <Flex justify="space-evenly" width={{ base: '100%', lg: '60%' }}
+            
+        >
         <FooterList header={'Ressurser'}>
           <FooterItem label={'Om TD'} path={'/about-us'} />
           <FooterItem
diff --git a/src/styles/colors.scss b/src/styles/colors.scss
index 342bce9d..9b9966f9 100644
--- a/src/styles/colors.scss
+++ b/src/styles/colors.scss
@@ -1,6 +1,8 @@
 $td-red: #a4161a;
 $secondary: #f8d2cc;
 
+
+
 $background-color: #161926;
 $off-background-color: #161a1d;
 

From 98e8d85a38351e83a8b0f45365b839a61857d21a Mon Sep 17 00:00:00 2001
From: Keyvan Sadeghi <ksa128@uit.no>
Date: Sun, 2 Jun 2024 21:18:42 +0200
Subject: [PATCH 2/7] Made the color as a theme variable for consistency

---
 src/components/molecules/footer/Footer.tsx | 4 ++--
 src/theme.ts                               | 1 +
 2 files changed, 3 insertions(+), 2 deletions(-)

diff --git a/src/components/molecules/footer/Footer.tsx b/src/components/molecules/footer/Footer.tsx
index 658d7b36..674634fa 100644
--- a/src/components/molecules/footer/Footer.tsx
+++ b/src/components/molecules/footer/Footer.tsx
@@ -11,7 +11,7 @@ import {
   Heading,
   Flex,
 } from '@chakra-ui/react';
-
+import theme from '../../../theme';
 interface FooterListProps {
   header: string;
   children?: React.ReactNode;
@@ -89,7 +89,7 @@ const Footer: React.FC = () => {
       w="100%"
       direction={{ base: 'column', lg: 'row' }}
       mt="auto"
-      style={{background: '#11131d', paddingTop: '2rem'}}>
+      style={{background: theme.colors.darkerBackground, paddingTop: '2rem'}}>
       <Flex justify="space-evenly" width={{ base: '100%', lg: '60%' }}
             
         >
diff --git a/src/theme.ts b/src/theme.ts
index efd4aae0..254f8472 100644
--- a/src/theme.ts
+++ b/src/theme.ts
@@ -23,6 +23,7 @@ const theme = extendTheme(
         td: '#C7323A' /* TD red */,
       },
       primary: '#ffffff',
+      darkerBackground: '#11131d', 
       slate: {
         500: '#444658',
         600: '#2b2c3d',

From 1d37e2d35560b8a57238520f5ab1646976a51801 Mon Sep 17 00:00:00 2001
From: Keyvan Sadeghi <ksa128@uit.no>
Date: Sun, 2 Jun 2024 21:29:45 +0200
Subject: [PATCH 3/7] run prettier for formatting

---
 src/components/molecules/footer/Footer.tsx | 8 +++-----
 src/styles/colors.scss                     | 2 --
 src/theme.ts                               | 2 +-
 3 files changed, 4 insertions(+), 8 deletions(-)

diff --git a/src/components/molecules/footer/Footer.tsx b/src/components/molecules/footer/Footer.tsx
index 674634fa..d2fb514a 100644
--- a/src/components/molecules/footer/Footer.tsx
+++ b/src/components/molecules/footer/Footer.tsx
@@ -85,14 +85,12 @@ const Footer: React.FC = () => {
   // uses margin auto, needs parent page to have minHeight=100vh if content is not over 100vh
   return (
     <Flex
-      my="0rem"
+      my="2rem"
       w="100%"
       direction={{ base: 'column', lg: 'row' }}
       mt="auto"
-      style={{background: theme.colors.darkerBackground, paddingTop: '2rem'}}>
-      <Flex justify="space-evenly" width={{ base: '100%', lg: '60%' }}
-            
-        >
+      style={{ background: theme.colors.darkerBackground, paddingTop: '2rem' }}>
+      <Flex justify="space-evenly" width={{ base: '100%', lg: '60%' }}>
         <FooterList header={'Ressurser'}>
           <FooterItem label={'Om TD'} path={'/about-us'} />
           <FooterItem
diff --git a/src/styles/colors.scss b/src/styles/colors.scss
index 9b9966f9..342bce9d 100644
--- a/src/styles/colors.scss
+++ b/src/styles/colors.scss
@@ -1,8 +1,6 @@
 $td-red: #a4161a;
 $secondary: #f8d2cc;
 
-
-
 $background-color: #161926;
 $off-background-color: #161a1d;
 
diff --git a/src/theme.ts b/src/theme.ts
index 254f8472..7d22affb 100644
--- a/src/theme.ts
+++ b/src/theme.ts
@@ -23,7 +23,7 @@ const theme = extendTheme(
         td: '#C7323A' /* TD red */,
       },
       primary: '#ffffff',
-      darkerBackground: '#11131d', 
+      darkerBackground: '#11131d',
       slate: {
         500: '#444658',
         600: '#2b2c3d',

From 9b540102cfc7da8a83536d7ac772fb6c434077c8 Mon Sep 17 00:00:00 2001
From: Keyvan Sadeghi <ksa128@uit.no>
Date: Mon, 3 Jun 2024 10:28:01 +0200
Subject: [PATCH 4/7] fix the bug where the bottom of footer does not extend
 thropugh the rest of the bottom

---
 src/components/molecules/footer/Footer.tsx | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/components/molecules/footer/Footer.tsx b/src/components/molecules/footer/Footer.tsx
index d2fb514a..7fa4a445 100644
--- a/src/components/molecules/footer/Footer.tsx
+++ b/src/components/molecules/footer/Footer.tsx
@@ -85,7 +85,7 @@ const Footer: React.FC = () => {
   // uses margin auto, needs parent page to have minHeight=100vh if content is not over 100vh
   return (
     <Flex
-      my="2rem"
+      my="0rem"
       w="100%"
       direction={{ base: 'column', lg: 'row' }}
       mt="auto"

From 8a031269ddb425c03210b2a55efbb0e85ea8deab Mon Sep 17 00:00:00 2001
From: Keyvan Sadeghi <ksa128@uit.no>
Date: Mon, 3 Jun 2024 13:00:43 +0200
Subject: [PATCH 5/7] Add darker bgcolor for the footer to separate it from the
 rest of the website

---
 src/components/molecules/footer/Footer.tsx |  3 ++-
 src/theme.ts                               | 10 +++++-----
 2 files changed, 7 insertions(+), 6 deletions(-)

diff --git a/src/components/molecules/footer/Footer.tsx b/src/components/molecules/footer/Footer.tsx
index 7fa4a445..d87c525f 100644
--- a/src/components/molecules/footer/Footer.tsx
+++ b/src/components/molecules/footer/Footer.tsx
@@ -89,7 +89,8 @@ const Footer: React.FC = () => {
       w="100%"
       direction={{ base: 'column', lg: 'row' }}
       mt="auto"
-      style={{ background: theme.colors.darkerBackground, paddingTop: '2rem' }}>
+      bgColor="slate.900"
+      style={{ paddingTop: '2rem' }}>
       <Flex justify="space-evenly" width={{ base: '100%', lg: '60%' }}>
         <FooterList header={'Ressurser'}>
           <FooterItem label={'Om TD'} path={'/about-us'} />
diff --git a/src/theme.ts b/src/theme.ts
index 7d22affb..58a16eeb 100644
--- a/src/theme.ts
+++ b/src/theme.ts
@@ -23,12 +23,12 @@ const theme = extendTheme(
         td: '#C7323A' /* TD red */,
       },
       primary: '#ffffff',
-      darkerBackground: '#11131d',
       slate: {
-        500: '#444658',
-        600: '#2b2c3d',
-        700: '#1b1e2c',
-        800: '#161926',
+          500: '#444658',
+          600: '#2b2c3d',
+          700: '#1b1e2c',
+          800: '#161926',
+          900: '#11131d',
       },
       secondary: '#f8d2cc',
       inputBackground: '#272530',

From 988121a87b2bd9b207d34d040ae7caebd06d71f0 Mon Sep 17 00:00:00 2001
From: Keyvan Sadeghi <ksa128@uit.no>
Date: Mon, 3 Jun 2024 13:23:30 +0200
Subject: [PATCH 6/7] Add darker bgcolor for the footer to separate it from the
 rest of the website

---
 src/theme.ts | 10 +++++-----
 1 file changed, 5 insertions(+), 5 deletions(-)

diff --git a/src/theme.ts b/src/theme.ts
index 58a16eeb..07768575 100644
--- a/src/theme.ts
+++ b/src/theme.ts
@@ -24,11 +24,11 @@ const theme = extendTheme(
       },
       primary: '#ffffff',
       slate: {
-          500: '#444658',
-          600: '#2b2c3d',
-          700: '#1b1e2c',
-          800: '#161926',
-          900: '#11131d',
+        500: '#444658',
+        600: '#2b2c3d',
+        700: '#1b1e2c',
+        800: '#161926',
+        900: '#11131d',
       },
       secondary: '#f8d2cc',
       inputBackground: '#272530',

From 8fcface1ac4bdb4199df0c7f2451ec3326eca4bb Mon Sep 17 00:00:00 2001
From: Keyvan Sadeghi <ksa128@uit.no>
Date: Mon, 3 Jun 2024 13:28:58 +0200
Subject: [PATCH 7/7] Add darker bgcolor for the footer to separate it from the
 rest of the website

---
 src/components/molecules/footer/Footer.tsx | 3 ++-
 src/theme.ts                               | 2 +-
 2 files changed, 3 insertions(+), 2 deletions(-)

diff --git a/src/components/molecules/footer/Footer.tsx b/src/components/molecules/footer/Footer.tsx
index 7fa4a445..d87c525f 100644
--- a/src/components/molecules/footer/Footer.tsx
+++ b/src/components/molecules/footer/Footer.tsx
@@ -89,7 +89,8 @@ const Footer: React.FC = () => {
       w="100%"
       direction={{ base: 'column', lg: 'row' }}
       mt="auto"
-      style={{ background: theme.colors.darkerBackground, paddingTop: '2rem' }}>
+      bgColor="slate.900"
+      style={{ paddingTop: '2rem' }}>
       <Flex justify="space-evenly" width={{ base: '100%', lg: '60%' }}>
         <FooterList header={'Ressurser'}>
           <FooterItem label={'Om TD'} path={'/about-us'} />
diff --git a/src/theme.ts b/src/theme.ts
index 7d22affb..07768575 100644
--- a/src/theme.ts
+++ b/src/theme.ts
@@ -23,12 +23,12 @@ const theme = extendTheme(
         td: '#C7323A' /* TD red */,
       },
       primary: '#ffffff',
-      darkerBackground: '#11131d',
       slate: {
         500: '#444658',
         600: '#2b2c3d',
         700: '#1b1e2c',
         800: '#161926',
+        900: '#11131d',
       },
       secondary: '#f8d2cc',
       inputBackground: '#272530',