updated

src/components/footer.tsx

@@ -0,0 +1,43 @@
+import { Stack, Flex, Image, Text, } from '@chakra-ui/react';
+import { colors } from '../colors';
+
+function Footer() {
+    const currentYear = new Date().getFullYear();
+    return (
+        <Stack bg={colors.topBarColor} py={5} w="full"
+            align={'center'}
+        >
+            <Text
+                className='font-melle font-xbold'
+                fontSize={'4xl'}
+                color={'white'}
+            >
+                {"查詢：29437810"}
+            </Text>
+            <Flex alignItems={'center'} justifyContent={'center'} direction="column">
+                <Image src="/images/headerlogo.png" alt="Logo" width="150px" />
+                <Text textAlign={'center'} marginLeft={3} marginTop={2} className="font-melle font-medium" color={'#075C39'}>
+                    {"【積極求變 健康向前】"}
+                </Text>
+            </Flex>
+            <Flex
+                alignItems={'flex-end'}
+                w={{ base: '100%', sm: '100%', md: '60%', lg: '55%', xl: '55%' }}
+                h='60px'
+
+            >
+                <Text
+                    className='font-noto-sans font-regular'
+                    color={colors.textColor}
+                    fontSize={{ base: 'xs', sm: 'sm', md: 'md', lg: 'md', xl: 'md' }}
+                    mt={5}
+                    ml={2}
+                >
+                    {`Copyright © ${currentYear}合興食油（香港）有限公司 版權所有，不得轉載。`}
+                </Text>
+            </Flex>
+        </Stack>
+    );
+}
+
+export default Footer;