import { Card, Container, Grid, Image, Spacer, Text } from '@nextui-org/react'
import React from 'react'
import SwapImg from '../../../assets/Swap.jpg'

const Swap = () => {
  return (
    <>
    <Container>
      <Grid.Container alignItems='center'>
        <Grid md={6} sm={6} xs={6} >
        <Image showSkeleton objectFit='contain' css={{ borderRadius: '30px 0 0 30px' }} src={SwapImg} alt={SwapImg} width='100%' height='70%' />
        </Grid>
        <Grid md={6} sm={6} xs={6} >
          <Card css={{$$cardColor:'#1E2835', border: '1px solid #303945'}} variant='bordered'>
            <Card.Body css={{ p: '30px' }} >
              <Text h1 color='white' > SWAP </Text>
              <Text h3 color='white' > Operation Starts In Q4 2024 </Text>
              <Text color='#738da3' > 
                It is a financial technique made through the exchange of cryptocurrency fund flows, and swap transactions are a financial technique in which two or more parties raise funds more advantageously during a predetermined (collection name) coin price, and avoid risks by exchanging debts with each other to increase the value of the coin. All operating income of swap finance is distributed fairly to both(collection name) NFT and coin owners.
              </Text>
            </Card.Body>
          </Card>
        </Grid>
      </Grid.Container>
      <Spacer y={8} />
    </Container>
    </>
  )
}

export default Swap