fix: Update logo in header and footer

src/components/Footer.tsx

@@ -8,27 +8,9 @@ type FooterLinkProps = {
 
 function Footer() {
   return (
-    <Flex direction="column" alignItems="center">
-      <Box>
-        <Grid
-          display="inline-grid"
-          gap={5}
-          alignItems="center"
-          justifyContent="center"
-          my={5}
-          flexDirection="row"
-        >
-          <GridItem
-            colStart={{ base: 1, lg: "auto" }}
-            colEnd={{ base: 4, lg: "auto" }}
-            order={{ base: "-1", lg: "initial" }}
-            justifySelf="center"
-          >
-            <Image src="/images/SCSE-Logo.png" alt="SCSE Logo" boxSize={14} />
-          </GridItem>
-        </Grid>
-      </Box>
-      <Image src="/images/vercellogo.svg" w={48} objectFit="contain" my={5} />
+    <Flex direction="column" alignItems="center" mt={10} mb={5}>
+      <Image src="https://cdn.ntuscse.com/LogoBW.png" alt="SCSE Logo" boxSize={14} />
+      <Image src="/images/vercellogo.svg" w={48} objectFit="contain" my={2} />
     </Flex>
   );
 }

src/components/Header.tsx

@@ -36,10 +36,10 @@ const Header = () => {
     <Flex pos="sticky" zIndex={2} bg="#0e2b50" top={0} py={4} px={{ base: 4, md: 4, lg: 16 }} align="center">
       <HStack spacing={2}>
         <RouterLink to={routes.HOME}>
-          <Flex alignItems="center">
-            <Image src="/images/SCSE-Logo.png" alt="SCSE Logo" boxSize={14} />
+          <HStack align="center" gap="0.5em">
+            <Image src="https://cdn.ntuscse.com/LogoRedAccent.png" alt="SCSE Logo" boxSize={14} />
             <Heading ml={1} color="white">SCSE MERCH</Heading>
-          </Flex>
+          </HStack>
         </RouterLink>
       </HStack>