CoastalCommitsPastes/client/components/new-post/title/index.tsx

38 lines
No EOL
1 KiB
TypeScript

import { Text, Input } from '@geist-ui/core'
import { memo } from 'react'
import ShiftBy from '../../shift-by'
import styles from '../post.module.css'
const titlePlaceholders = [
"How to...",
"Status update for ...",
"My new project",
"My new idea",
"Let's talk about...",
"What's up with ...",
"I'm thinking about ...",
]
type props = {
setTitle: (title: string) => void
title?: string
}
const Title = ({ setTitle, title }: props) => {
return (<div className={styles.title}>
<Text h1 width={"150px"} className={styles.drift}>Drift</Text>
<ShiftBy y={-3}>
<Input
placeholder={titlePlaceholders[Math.floor(Math.random() * titlePlaceholders.length)]}
value={title || ""}
onChange={(event) => setTitle(event.target.value)}
height={"55px"}
font={1.5}
label="Post title"
style={{ width: "100%" }}
/>
</ShiftBy>
</div>)
}
export default memo(Title)