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
|