-
Notifications
You must be signed in to change notification settings - Fork 1
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
- Loading branch information
1 parent
5f92d00
commit b7e66f3
Showing
8 changed files
with
613 additions
and
21 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,84 @@ | ||
| 'use client'; | ||
|
|
||
| import { | ||
| Box, | ||
| Flex, | ||
| HStack, | ||
| Image, | ||
| List, | ||
| ListIcon, | ||
| ListItem, | ||
| Text, | ||
| UnorderedList, | ||
| } from '@chakra-ui/react'; | ||
|
|
||
| const News = { | ||
| content: [ | ||
| 'Earn sequencer fees', | ||
| 'Have dedicated throughput', | ||
| 'Offer low transaction fees to your users', | ||
| 'Complete control over gas fee, gas block limit, and withdrawal periods', | ||
| 'And more', | ||
| ], | ||
| }; | ||
|
|
||
| const Section_5 = () => { | ||
| return ( | ||
| <Box bgColor={'#fff'} display={'flex'} flexDirection={'column'}> | ||
| <HStack | ||
| display={'flex'} | ||
| flexDirection={'row'} | ||
| className="maxWidth" | ||
| alignSelf={'center'} | ||
| spacing={['80px']} | ||
| > | ||
| <Flex flex={1}> | ||
| <Image src="/images/image_section_2.png" /> | ||
| </Flex> | ||
| <Flex flex={1} flexDirection={'column'}> | ||
| <Text fontSize={['48px']} color={'#000'}> | ||
| Why launch | ||
| <Text fontSize={['48px']} color={'#00C250'} as="span"> | ||
| {' '} | ||
| your own blockchain?{' '} | ||
| </Text>{' '} | ||
| </Text> | ||
| <Box height={['12px']} /> | ||
| <Text fontSize={['16px']} fontWeight={400} color={'#000'}> | ||
| Whatever your vision — a dapp, a fully onchain game, a DEX, or an | ||
| ecosystem — there are many benefits of running your own blockchain. | ||
| </Text> | ||
| <Box height={['32px']} /> | ||
| <Box | ||
| bgColor={'#F2FCF6'} | ||
| padding={['24px']} | ||
| border={'1px solid #C2F0D5'} | ||
| color={'#000'} | ||
| > | ||
| <List spacing={['20px']}> | ||
| {News.content.map((item) => ( | ||
| <ListItem | ||
| flexDir={'row'} | ||
| display={'flex'} | ||
| alignItems={'center'} | ||
| > | ||
| <Box | ||
| w={'8px'} | ||
| h={'8px'} | ||
| borderRadius={100} | ||
| bgColor={'#00C250'} | ||
| marginRight={'12px'} | ||
| ></Box> | ||
| {item || ''} | ||
| </ListItem> | ||
| ))} | ||
| </List> | ||
| </Box> | ||
| </Flex> | ||
| </HStack> | ||
| <Box height={['120px']} /> | ||
| </Box> | ||
| ); | ||
| }; | ||
|
|
||
| export default Section_5; |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,119 @@ | ||
| 'use client'; | ||
|
|
||
| import { CDN_APP_ICON_URL } from '@/config'; | ||
| import { | ||
| Box, | ||
| Flex, | ||
| HStack, | ||
| Image, | ||
| ListItem, | ||
| Text, | ||
| UnorderedList, | ||
| } from '@chakra-ui/react'; | ||
|
|
||
| interface IContent { | ||
| title: string; | ||
| icon: string; | ||
| description: string; | ||
| } | ||
|
|
||
| const CONTENTS: Array<IContent> = [ | ||
| { | ||
| title: 'Unlimited throughput', | ||
| description: | ||
| 'Hyperscale Bitcoin with an unlimited number of Bitcoin Virtual Machines as Bitcoin L2 blockchains.', | ||
| icon: 'reinvention_13.png', | ||
| }, | ||
| { | ||
| title: 'Infinite applications', | ||
| description: | ||
| 'Bitcoin Virtual Machines support Solidity smart contracts on Bitcoin, so you can quickly build all kinds of decentralized applications on Bitcoin.', | ||
| icon: 'reinvention_14.png', | ||
| }, | ||
| { | ||
| title: 'Fast & cheap', | ||
| description: | ||
| 'Bitcoin Virtual Machines implement rollups on Bitcoin. Rollups significantly reduce the block time and transaction fees.', | ||
| icon: 'reinvention_15.png', | ||
| }, | ||
| ]; | ||
|
|
||
| const Section_6 = () => { | ||
| const renderItem = (item: IContent) => { | ||
| return ( | ||
| <Flex | ||
| key={item.title} | ||
| flexDir={'column'} | ||
| justify={'center'} | ||
| p={['20px']} | ||
| flex={1} | ||
| bgColor={'#fff'} | ||
| > | ||
| <Image | ||
| src={`${CDN_APP_ICON_URL}/${item.icon}`} | ||
| maxW={'360px'} | ||
| w={'100%'} | ||
| alignSelf={'center'} | ||
| /> | ||
| <Box h={['20px']}></Box> | ||
| <Text | ||
| fontSize={['24px']} | ||
| align="center" | ||
| fontWeight={400} | ||
| color={'#000'} | ||
| > | ||
| {item.title} | ||
| </Text> | ||
| <Box h={['16px']}></Box> | ||
| <Text | ||
| fontSize={['16px']} | ||
| align="center" | ||
| fontWeight={400} | ||
| color={'#000'} | ||
| > | ||
| {item.description} | ||
| </Text> | ||
| </Flex> | ||
| ); | ||
| }; | ||
|
|
||
| return ( | ||
| <Box | ||
| bgColor={'#F3F1E8'} | ||
| display={'flex'} | ||
| flexDirection={'column'} | ||
| py={['120px']} | ||
| > | ||
| <HStack | ||
| display={'flex'} | ||
| flexDirection={'row'} | ||
| className="maxWidth" | ||
| alignSelf={'center'} | ||
| spacing={['50px']} | ||
| > | ||
| <Flex flex={1} flexDirection={'column'} justify={'center'}> | ||
| <Text fontSize={['48px']} color={'#000'} textAlign={'center'}> | ||
| Scalable infrastructure for Bitcoin | ||
| </Text> | ||
| <Box height={['16px']} /> | ||
| <Text | ||
| fontSize={['20px']} | ||
| fontWeight={400} | ||
| color={'#000'} | ||
| textAlign={'center'} | ||
| > | ||
| If Ethereum is the world’s computer, Bitcoin is the world’s | ||
| supercomputer. With Bitcoin Virtual Machine, anyone can launch their | ||
| own Bitcoin L2 blockchain. | ||
| </Text> | ||
| <Box height={['40px']} /> | ||
| <Flex padding={['24px']} gap={['36px']}> | ||
| {CONTENTS.map(renderItem)} | ||
| </Flex> | ||
| </Flex> | ||
| </HStack> | ||
| </Box> | ||
| ); | ||
| }; | ||
|
|
||
| export default Section_6; |
Oops, something went wrong.