feedcreate: simplify design

This commit is contained in:
mantikoros 2022-01-27 15:08:18 -06:00
parent 077eeec2c7
commit 6e2d16225e

View File

@ -7,7 +7,6 @@ import { NewContract } from '../pages/create'
import { firebaseLogin, User } from '../lib/firebase/users' import { firebaseLogin, User } from '../lib/firebase/users'
import { ContractsGrid } from './contracts-list' import { ContractsGrid } from './contracts-list'
import { Contract } from '../../common/contract' import { Contract } from '../../common/contract'
import { TagsList } from './tags-list'
import { Col } from './layout/col' import { Col } from './layout/col'
import clsx from 'clsx' import clsx from 'clsx'
@ -16,7 +15,7 @@ export function FeedPromo(props: { hotContracts: Contract[] }) {
return ( return (
<> <>
<Col className="w-full bg-white p-6 sm:rounded-lg shadow-md"> <Col className="w-full bg-white p-6 sm:rounded-lg">
<h1 className="mt-4 text-4xl sm:mt-5 sm:text-6xl lg:mt-6 xl:text-6xl"> <h1 className="mt-4 text-4xl sm:mt-5 sm:text-6xl lg:mt-6 xl:text-6xl">
<div className="mb-2">Create your own</div> <div className="mb-2">Create your own</div>
<div className="font-bold bg-clip-text text-transparent bg-gradient-to-r from-teal-400 to-green-400"> <div className="font-bold bg-clip-text text-transparent bg-gradient-to-r from-teal-400 to-green-400">
@ -41,12 +40,13 @@ export function FeedPromo(props: { hotContracts: Contract[] }) {
</Col> </Col>
<Spacer h={6} /> <Spacer h={6} />
{/*
<TagsList <TagsList
className="mt-2" className="mt-2"
tags={['#politics', '#crypto', '#covid', '#sports', '#meta']} tags={['#politics', '#crypto', '#covid', '#sports', '#meta']}
/> />
<Spacer h={6} /> <Spacer h={6} /> */}
<ContractsGrid <ContractsGrid
contracts={hotContracts?.slice(0, 10) || []} contracts={hotContracts?.slice(0, 10) || []}
showHotVolume showHotVolume
@ -80,7 +80,9 @@ export default function FeedCreate(props: {
const placeholder = props.placeholder ?? `e.g. ${placeholders[randIndex]}` const placeholder = props.placeholder ?? `e.g. ${placeholders[randIndex]}`
return ( return (
<div className={clsx('w-full bg-indigo-50 sm:rounded-md p-4', className)}> <div
className={clsx('w-full bg-white border-2 sm:rounded-md p-4', className)}
>
<div className="relative flex items-start space-x-3"> <div className="relative flex items-start space-x-3">
{user?.avatarUrl ? ( {user?.avatarUrl ? (
<AvatarWithIcon username={user.username} avatarUrl={user.avatarUrl} /> <AvatarWithIcon username={user.username} avatarUrl={user.avatarUrl} />