From c99918cc2bf2ccf9e089e2f12d6874db1ab00bf5 Mon Sep 17 00:00:00 2001
From: Maryam Gohargani <maryam.gohargani@mail.utoronto.ca>
Date: Wed, 6 Jan 2021 15:32:20 -0500
Subject: [PATCH 1/3] fixed colours and margins of Navbar

---
 frontend/components/Navbar/index.tsx | 14 +++++++++-----
 1 file changed, 9 insertions(+), 5 deletions(-)

diff --git a/frontend/components/Navbar/index.tsx b/frontend/components/Navbar/index.tsx
index 6f567b2..8d76771 100644
--- a/frontend/components/Navbar/index.tsx
+++ b/frontend/components/Navbar/index.tsx
@@ -7,6 +7,7 @@ import {
   Spacer,
   useColorMode,
   useColorModeValue,
+  LightMode,
 } from "@chakra-ui/react";
 import React from "react";
 import { FaMoon, FaSun } from "react-icons/fa";
@@ -16,17 +17,20 @@ export const Navbar = (): JSX.Element => {
   const SwitchIcon = useColorModeValue(FaMoon, FaSun);
   const nextMode = useColorModeValue("dark", "light");
 
+  const titleColor = useColorModeValue("white", "white");
+  const boxColor = useColorModeValue("#343A40", "#343A40");
+
   return (
-    <Flex w="100%" m="2" mb="4">
-      <Box m="2">
+    <Flex w="101%" mb="4" bg={boxColor} boxShadow="lg">
+      <Box m="4" color={titleColor}>
         <Heading size="md">Dialog</Heading>
       </Box>
       <Spacer />
-      <Box>
-        <Button m="1" size="sm">
+      <Box m="1">
+        <Button m="1" size="sm" colorScheme="blue">
           Sign Up
         </Button>
-        <Button m="1" size="sm">
+        <Button m="1" size="sm" colorScheme="blue">
           Login
         </Button>
         <IconButton

From fdca31ebca852a4d77713308af88779fca19475f Mon Sep 17 00:00:00 2001
From: Maryam Gohargani <maryam.gohargani@mail.utoronto.ca>
Date: Wed, 6 Jan 2021 15:42:36 -0500
Subject: [PATCH 2/3] changed colour of buttons in Navbar to correct colour

---
 frontend/components/Navbar/index.tsx | 13 +++++++------
 1 file changed, 7 insertions(+), 6 deletions(-)

diff --git a/frontend/components/Navbar/index.tsx b/frontend/components/Navbar/index.tsx
index 8d76771..c5bdd5c 100644
--- a/frontend/components/Navbar/index.tsx
+++ b/frontend/components/Navbar/index.tsx
@@ -17,20 +17,21 @@ export const Navbar = (): JSX.Element => {
   const SwitchIcon = useColorModeValue(FaMoon, FaSun);
   const nextMode = useColorModeValue("dark", "light");
 
-  const titleColor = useColorModeValue("white", "white");
-  const boxColor = useColorModeValue("#343A40", "#343A40");
+  const textColor = useColorModeValue("white", "white");
+  const boxBg = useColorModeValue("#343A40", "#343A40");
+  const buttonBg = useColorModeValue("#2D9CDB", "blue");
 
   return (
-    <Flex w="101%" mb="4" bg={boxColor} boxShadow="lg">
-      <Box m="4" color={titleColor}>
+    <Flex w="101%" mb="4" bg={boxBg} boxShadow="lg">
+      <Box m="4" color={textColor}>
         <Heading size="md">Dialog</Heading>
       </Box>
       <Spacer />
       <Box m="1">
-        <Button m="1" size="sm" colorScheme="blue">
+        <Button m="1" size="sm" bg={buttonBg} color={textColor}>
           Sign Up
         </Button>
-        <Button m="1" size="sm" colorScheme="blue">
+        <Button m="1" size="sm" bg={buttonBg} color={textColor}>
           Login
         </Button>
         <IconButton

From cdedd6c9ead8a157bea26140713f652c58104234 Mon Sep 17 00:00:00 2001
From: Maryam Gohargani <maryam.gohargani@mail.utoronto.ca>
Date: Wed, 6 Jan 2021 16:59:38 -0500
Subject: [PATCH 3/3] changed Navbar colour to match footer

---
 frontend/components/Navbar/index.tsx | 5 +++--
 1 file changed, 3 insertions(+), 2 deletions(-)

diff --git a/frontend/components/Navbar/index.tsx b/frontend/components/Navbar/index.tsx
index c5bdd5c..8b7b072 100644
--- a/frontend/components/Navbar/index.tsx
+++ b/frontend/components/Navbar/index.tsx
@@ -19,7 +19,8 @@ export const Navbar = (): JSX.Element => {
 
   const textColor = useColorModeValue("white", "white");
   const boxBg = useColorModeValue("#343A40", "#343A40");
-  const buttonBg = useColorModeValue("#2D9CDB", "blue");
+  const buttonBg = useColorModeValue("#2D9CDB", "#2D9CDB");
+  const iconColor = useColorModeValue("#ECC94B", "light");
 
   return (
     <Flex w="101%" mb="4" bg={boxBg} boxShadow="lg">
@@ -42,7 +43,7 @@ export const Navbar = (): JSX.Element => {
           color="current"
           margin="1"
           onClick={toggleColorMode}
-          icon={<SwitchIcon />}
+          icon={<SwitchIcon color={iconColor} />}
         />
       </Box>
     </Flex>