From 5ef44c4b24eff88a3de98ca1db6c86a623e1793d Mon Sep 17 00:00:00 2001
From: AceYang123 <leonisita@126.com>
Date: Thu, 10 Aug 2023 10:25:55 -0400
Subject: [PATCH 1/4] title & description

add the title and description
---
 index.js | 12 ++++++++++++
 1 file changed, 12 insertions(+)
 create mode 100644 index.js

diff --git a/index.js b/index.js
new file mode 100644
index 0000000..77fc02d
--- /dev/null
+++ b/index.js
@@ -0,0 +1,12 @@
+export default function Home() {
+  return (
+    <div className="home-container">
+      <div className="title">
+        Course Wiki
+      </div>
+      <div className="description">
+        Knowledge is the cheapest and most rewarding investment
+      </div>
+    </div>
+  );
+}

From 75120a17b970b1fa798e8caf301f7d186a84f8f4 Mon Sep 17 00:00:00 2001
From: mgrddsj <Jesse_Xu@live.com>
Date: Fri, 18 Aug 2023 20:30:32 -0400
Subject: [PATCH 2/4] feat(frontend): Update NavigationBar to new design

Updated the navigation bar to match the design specified in the figma
sample.
https://www.figma.com/file/MOSsfrxz01UqA94gO4eEc2/Untitled?type=design&node-id=0%3A1&mode=design&t=aIj3fmQBP15udH7g-1
---
 client/src/components/NavigationBar.js | 72 +++++++++-----------------
 1 file changed, 25 insertions(+), 47 deletions(-)

diff --git a/client/src/components/NavigationBar.js b/client/src/components/NavigationBar.js
index fac1c24..cc52670 100644
--- a/client/src/components/NavigationBar.js
+++ b/client/src/components/NavigationBar.js
@@ -29,32 +29,43 @@ export default function NavigationBar(props) {
       <AppBar
         component='nav'
         sx={{
-          minHeight: {xs: 260, sm: 420},
-          backgroundImage: 'url(/navigation-background.jpg)',
-          backgroundSize: 'cover',
-          backgroundRepeat: 'no-repeat',
-          backgroundPosition: 'center',
+          backgroundColor: '#fff',
+          boxShadow: 0,
         }}
       >
-        <Toolbar>
+        <Toolbar
+          sx={{
+            maxWidth: 920,
+            alignSelf: 'center',
+            width: '90%',
+          }}
+        >
           <Typography
-            variant='h6'
+            variant='h5'
             component='div'
-            sx={{flexGrow: 1, fontWeight: 'bold'}}
+            sx={{
+              color: '#000', flexGrow: 1,
+              fontSize: 28, fontWeight: 'bolder',
+            }}
           >
             Course Wiki
           </Typography>
           <Box sx={{display: {xs: 'none', sm: 'block'}}}>
             {navItems.map((item) => (
-              <Button key={item} sx={{color: '#fff'}} onClick={() => {
-                navigate(`/${item.toLowerCase()}`);
-              }}>
+              <Button key={item}
+                sx={{
+                  color: '#000', fontSize: 20,
+                  textTransform: 'none',
+                }}
+                onClick={() => {
+                  navigate(`/${item.toLowerCase()}`);
+                }}>
                 {item}
               </Button>
             ))}
           </Box>
           <IconButton
-            color='inherit'
+            color='#000'
             aria-label='open drawer'
             edge='start'
             onClick={(event) => {
@@ -85,42 +96,9 @@ export default function NavigationBar(props) {
             ))}
           </Menu>
         </Toolbar>
-        <Box
-          sx={{
-            display: 'flex',
-            flexDirection: 'column',
-            justifyContent: 'center',
-            alignItems: 'center',
-            minHeight: {xs: 180, sm: 300},
-          }}
-        >
-          <Typography
-            variant='h1'
-            sx={{
-              fontWeight: 'bold',
-              fontSize: {xs: 'h3.fontSize', sm: 80},
-            }}
-          >
-            Course Wiki
-          </Typography>
-          <Typography
-            variant='body1'
-            align='center'
-            sx={{
-              fontWeight: 'light',
-              paddingLeft: {xs: 3, sm: 0},
-              paddingRight: {xs: 3, sm: 0},
-              fontSize: {xs: 'body1.fontSize', sm: 'h6.fontSize'},
-            }}
-          >
-            Knowledge is the cheapest and most rewarding investment
-          </Typography>
-        </Box>
       </AppBar>
-      <Box component='main' sx={{p: 3}}>
-        <Toolbar sx={{
-          minHeight: {xs: 260, sm: 420},
-        }}/>
+      <Box component='main' sx={{p: 3, width: '100%'}}>
+        <Toolbar />
         {props.children}
       </Box>
     </Box>

From dc676f55ce26cac28066a5da4614532cc16b4a93 Mon Sep 17 00:00:00 2001
From: mgrddsj <Jesse_Xu@live.com>
Date: Fri, 18 Aug 2023 22:16:52 -0400
Subject: [PATCH 3/4] feat(frontend): Completed Home Page

---
 client/src/components/Home/index.js | 67 ++++++++++++++++++++++++++++-
 1 file changed, 66 insertions(+), 1 deletion(-)

diff --git a/client/src/components/Home/index.js b/client/src/components/Home/index.js
index 65a485b..1e14b9c 100644
--- a/client/src/components/Home/index.js
+++ b/client/src/components/Home/index.js
@@ -1,5 +1,70 @@
+import {Box, IconButton} from '@mui/material';
+import {TextField} from '@mui/material';
+import SearchIcon from '@mui/icons-material/Search';
+
+function SearchBar() {
+  return (
+    <div style={{display: 'flex', alignItems: 'center',
+      justifyContent: 'center'}}
+    >
+      <Box sx={{
+        display: 'flex', justifyContent: 'center',
+        width: '90%', maxWidth: 460, alignSelf: 'center',
+        boxShadow: 4, borderRadius: 2, padding: 1,
+        marginTop: 2, marginBottom: 4}}
+      >
+        <TextField id="outlined-basic" label="Search CourseWiki"
+          variant="outlined" size='small' sx={{width: '100%'}}/>
+        <IconButton color='#000' aria-label='search'
+          sx={{marginRight: -1}}
+        >
+          <SearchIcon />
+        </IconButton>
+      </Box>
+    </div>
+  );
+}
+
 export default function Home() {
   return (
-    'this is the home page'
+    <div style={{display: 'block', margin: -24,
+      backgroundColor: '#171717', minHeight: '100vh'}}
+    >
+      <div style={{display: 'grid', alignItems: 'center',
+        backgroundColor: 'white'}}
+      >
+        <h1 style={{
+          textAlign: 'center', fontSize: 'clamp(2.5rem, 10vw, 6rem)',
+          fontWeight: 'normal', marginTop: 20, marginBottom: 0}}
+        >
+          Course Wiki
+        </h1>
+        <h2 style={{textAlign: 'center', fontSize: 'clamp(1rem, 3vw, 1.5rem)',
+          fontWeight: 'normal'}}
+        >
+          Knowledge is the cheapest and most rewarding investment
+        </h2>
+        <SearchBar style={{display: 'block'}} />
+        <div className='home-image' style={{
+          display: 'flex',
+          justifyContent: 'center', width: '100%', position: 'relative'}}
+        >
+          <img src='https://i.imgur.com/kZznhsj.png' alt='home'
+            style={{
+              height: 'auto', width: '95%', alignSelf: 'center',
+              maxWidth: 1060, objectFit: 'contain', zIndex: 1,
+            }}/>
+          <div style={{
+            content: '""',
+            position: 'absolute',
+            bottom: 0,
+            left: 0,
+            right: 0,
+            height: '50%', // Half of the container
+            backgroundColor: '#171717',
+          }}></div>
+        </div>
+      </div>
+    </div>
   );
 }

From f136983242f26bb1b61882c1c53cf0684aa7c41a Mon Sep 17 00:00:00 2001
From: mgrddsj <Jesse_Xu@live.com>
Date: Fri, 18 Aug 2023 22:33:19 -0400
Subject: [PATCH 4/4] Remove misplaced file

This reverts commit 5ef44c4b24eff88a3de98ca1db6c86a623e1793d.
---
 index.js | 12 ------------
 1 file changed, 12 deletions(-)
 delete mode 100644 index.js

diff --git a/index.js b/index.js
deleted file mode 100644
index 77fc02d..0000000
--- a/index.js
+++ /dev/null
@@ -1,12 +0,0 @@
-export default function Home() {
-  return (
-    <div className="home-container">
-      <div className="title">
-        Course Wiki
-      </div>
-      <div className="description">
-        Knowledge is the cheapest and most rewarding investment
-      </div>
-    </div>
-  );
-}