From 9d7a9b8d9478ef283a463f6b9a3c861ac4243fad Mon Sep 17 00:00:00 2001
From: philipcheung <zerophilip2013hk@gmail.com>
Date: Sun, 2 Nov 2025 14:18:01 +0800
Subject: [PATCH] ui updated

---
 src/components/new_ui/advantages.tsx | 18 +++++++++---------
 1 file changed, 9 insertions(+), 9 deletions(-)

diff --git a/src/components/new_ui/advantages.tsx b/src/components/new_ui/advantages.tsx
index ef03c4f..f687b27 100644
--- a/src/components/new_ui/advantages.tsx
+++ b/src/components/new_ui/advantages.tsx
@@ -138,7 +138,7 @@ function Advantages() {
             <SimpleGrid
                 columns={{ base: 1, sm: 1, md: 2 }}
                 p={4}
-                w={{ base: '50vw', sm: '90vw', md: '90vw', lg: '80vw', xl: '70vw' }}
+                w={{ base: '100%', sm: '95vw', md: '90vw', lg: '80vw', xl: '70vw' }}
                 h={'auto'}
 
             >
@@ -148,13 +148,13 @@ function Advantages() {
                         alignItems="center"
                         key={item.id}>
                         <Image
-                            w={{ base: '40vw', sm: '180px', md: '80px', lg: '110px', xl: '110px' }}
+                            w={{ base: '45vw', sm: '180px', md: '80px', lg: '110px', xl: '110px' }}
                             src={item.image}
                         />
 
                         <Image
-                            mt={{ base: '-30px', sm: '-70px', md: '-30px', lg: '-50px', xl: '-50px' }}
-                            h={{ base: '40vw', sm: '80px', md: '60px', lg: '80px', xl: '80px' }}
+                            mt={{ base: '-70px', sm: '-70px', md: '-30px', lg: '-50px', xl: '-50px' }}
+                            h={{ base: '18vw', sm: '80px', md: '60px', lg: '80px', xl: '80px' }}
                             src={item.titleImage2}
                         />
 
@@ -163,19 +163,19 @@ function Advantages() {
                             className='font-melle font-xbold'
                             fontWeight={400}
                             color='white'
-                            fontSize={{ base: '6vw', sm: '6vw', md: '3xl', lg: '5xl', xl: '5xl' }}
+                            fontSize={{ base: '9vw', sm: '4xl', md: '3xl', lg: '5xl', xl: '5xl' }}
                         >
                             {item.title}
                         </Text>
                         <Image
-                            h={{ base: '40vw', sm: item.id != 4 ? '200px' : '300px', md: item.id != 4 ? '180px' : '280px', lg: item.id != 4 ? '200px' : '300px', xl: item.id != 4 ? '200px' : '300px' }}
+                            h={{ base: item.id != 4 ? '50vw' : '70vw', sm: item.id != 4 ? '200px' : '300px', md: item.id != 4 ? '180px' : '280px', lg: item.id != 4 ? '200px' : '300px', xl: item.id != 4 ? '200px' : '300px' }}
                             src={item.titleImage}
                         />
 
                         <Text
-                            w={{ base: '90%', sm: '70%', md: '80%', lg: '80%', xl: '80%' }}
+                            w={{ base: '90%', sm: '80%', md: '80%', lg: '80%', xl: '80%' }}
                             className="font-noto-sans font-demi-light"
-                            fontSize={{ base: 'md', sm: 'xl', md: 'xl', lg: '2xl', xl: '2xl' }}
+                            fontSize={{ base: 'xl', sm: 'xl', md: 'xl', lg: '2xl', xl: '2xl' }}
                             color="white"
                             lineHeight="1.8"
                             textAlign="left"
@@ -194,7 +194,7 @@ function Advantages() {
                                 mt={-4}
                                 ml={3}
                             >
-                                <Flex flexWrap="wrap" justifyContent="center" gap="10px" maxWidth="945px">
+                                <Flex  flexDirection={'column'} justifyContent="center" gap="10px" maxWidth="945px">
                                     {oilCube.map((item, index) => (
                                         <MotionStack
                                             key={index}