import { Component } from 'react'
import Image from 'next/image'
import { Box } from '@mui/material'
import logo from './assets/warframe_logo.png'

export default class Hero extends Component {
  render () {
    return (
      <Box
        sx={{
          py: 12,
          textAlign: 'center'
        }}
      >
        <Box
          sx={{
            width: 400,
            m: 'auto'
          }}
        >
          <Image
            src={logo}
            alt='logo'
            layout='responsive'
            width={500}
            height={300}
          />
        </Box>
        <Box
          sx={{
            width: 400,
            m: 'auto'
          }}
        >
          <h1>Market Gaps</h1>
          <p>Find a profitable difference between the price of the set and the price of the sum of it's parts.</p>
        </Box>
      </Box>
    )
  }
}