61 lines
1.4 KiB
TypeScript
61 lines
1.4 KiB
TypeScript
import {
|
|
Box,
|
|
Container,
|
|
Flex,
|
|
Heading,
|
|
Text,
|
|
Image,
|
|
VStack,
|
|
HStack,
|
|
SimpleGrid,
|
|
Center,
|
|
} from '@chakra-ui/react'
|
|
|
|
import Header from './components/header'
|
|
import Hero1 from './components/hero1'
|
|
import Hero2 from './components/hero2'
|
|
import Compare from './components/compare'
|
|
import Qa from './components/qa'
|
|
import Oil_info from './components/oil_info'
|
|
import Bestoil from './components/bestoil'
|
|
|
|
function App() {
|
|
return (
|
|
<>
|
|
<Container maxW="100vw" p={0} m={0}>
|
|
<Header />
|
|
{/* Hero Section */}
|
|
<Box position="relative">
|
|
<Hero1 />
|
|
<Box mt={{ base: "-5vw", sm: "-5vw", md: "-5vw", lg: "-5vw", xl: "-5vw" }}>
|
|
<Hero2 />
|
|
</Box>
|
|
<Compare />
|
|
{/* Q&A Section */}
|
|
<Box mt={{ base: "-15vw", sm: "-15vw", md: "0vw", lg: "0vw", xl: "0vw" }}>
|
|
<Qa />
|
|
</Box>
|
|
<Box>
|
|
<Oil_info />
|
|
</Box>
|
|
<Box>
|
|
<Bestoil />
|
|
</Box>
|
|
</Box>
|
|
{/* Info Section */}
|
|
|
|
|
|
{/* Footer */}
|
|
<Box bg="#7BC142" color="white" py={6} w="full">
|
|
<Box maxW="100%" px={0} mx={0} textAlign="center">
|
|
<Text mb={2}>服務專線：29437810</Text>
|
|
<Box w="150px" h="40px" bg="gray.300" borderRadius="md" mx="auto" />
|
|
</Box>
|
|
</Box>
|
|
</Container>
|
|
</>
|
|
)
|
|
}
|
|
|
|
export default App
|