64 lines
2.1 KiB
TypeScript
64 lines
2.1 KiB
TypeScript
import { SparklesIcon } from '@heroicons/react/solid'
|
|
import { Spacer } from './layout/spacer'
|
|
import { firebaseLogin } from 'web/lib/firebase/users'
|
|
import { ContractsGrid } from './contract/contracts-list'
|
|
import { Contract } from 'common/contract'
|
|
import { Col } from './layout/col'
|
|
import { Row } from './layout/row'
|
|
import { SiteLink } from './site-link'
|
|
import { formatMoney } from 'common/util/format'
|
|
|
|
export function FeedPromo(props: { hotContracts: Contract[] }) {
|
|
const { hotContracts } = props
|
|
|
|
return (
|
|
<>
|
|
<Col className="mb-6 rounded-xl text-center sm:m-12 sm:mt-0">
|
|
<img
|
|
height={250}
|
|
width={250}
|
|
className="self-center"
|
|
src="/flappy-logo.gif"
|
|
/>
|
|
<h1 className="text-3xl sm:text-6xl xl:text-6xl">
|
|
<div className="font-semibold sm:mb-2">
|
|
Bet on{' '}
|
|
<span className="bg-gradient-to-r from-teal-400 to-green-400 bg-clip-text font-bold text-transparent">
|
|
anything!
|
|
</span>
|
|
</div>
|
|
</h1>
|
|
<Spacer h={6} />
|
|
<div className="mb-4 px-2 text-gray-500">
|
|
Bet on any topic imaginable with play-money markets. Or create your
|
|
own!
|
|
<br />
|
|
<br />
|
|
Sign up and get {formatMoney(1000)} - worth $10 to your{' '}
|
|
<SiteLink className="font-semibold" href="/charity">
|
|
favorite charity.
|
|
</SiteLink>
|
|
<br />
|
|
</div>
|
|
<Spacer h={6} />
|
|
<button
|
|
className="self-center rounded-md border-none bg-gradient-to-r from-teal-500 to-green-500 py-4 px-6 text-lg font-semibold normal-case text-white hover:from-teal-600 hover:to-green-600"
|
|
onClick={firebaseLogin}
|
|
>
|
|
Start betting now
|
|
</button>{' '}
|
|
</Col>
|
|
|
|
<Row className="m-4 mb-6 items-center gap-1 text-xl font-semibold text-gray-800">
|
|
<SparklesIcon className="inline h-5 w-5" aria-hidden="true" />
|
|
Trending markets
|
|
</Row>
|
|
<ContractsGrid
|
|
contracts={hotContracts?.slice(0, 10) || []}
|
|
loadMore={() => {}}
|
|
hasMore={false}
|
|
/>
|
|
</>
|
|
)
|
|
}
|