buttons overlaying content fix (#1005)

* buttons overlaying content fix
This commit is contained in:
ingawei 2022-10-05 15:19:10 -05:00 committed by GitHub
parent b40a114168
commit ec006f25c4
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23

View File

@ -6,12 +6,13 @@ import { Spacer } from '../layout/spacer'
import { Group } from 'common/group' import { Group } from 'common/group'
import { deleteFieldFromGroup, updateGroup } from 'web/lib/firebase/groups' import { deleteFieldFromGroup, updateGroup } from 'web/lib/firebase/groups'
import PencilIcon from '@heroicons/react/solid/PencilIcon' import PencilIcon from '@heroicons/react/solid/PencilIcon'
import { DocumentRemoveIcon } from '@heroicons/react/solid' import { TrashIcon } from '@heroicons/react/solid'
import { createPost } from 'web/lib/firebase/api' import { createPost } from 'web/lib/firebase/api'
import { Post } from 'common/post' import { Post } from 'common/post'
import { deletePost, updatePost } from 'web/lib/firebase/posts' import { deletePost, updatePost } from 'web/lib/firebase/posts'
import { useState } from 'react' import { useState } from 'react'
import { usePost } from 'web/hooks/use-post' import { usePost } from 'web/hooks/use-post'
import { Col } from '../layout/col'
export function GroupOverviewPost(props: { export function GroupOverviewPost(props: {
group: Group group: Group
@ -99,35 +100,31 @@ function RichEditGroupAboutPost(props: { group: Group; post: Post | null }) {
</p> </p>
</div> </div>
) : ( ) : (
<div className="relative"> <Col>
<div className="absolute top-0 right-0 z-10 space-x-2"> <Content content={post.content} />
<Row className="place-content-end">
<Button <Button
color="gray" color="gray-white"
size="xs" size="2xs"
onClick={() => { onClick={() => {
setEditing(true) setEditing(true)
editor?.commands.focus('end') editor?.commands.focus('end')
}} }}
> >
<PencilIcon className="inline h-4 w-4" /> <PencilIcon className="inline h-5 w-5" />
Edit
</Button> </Button>
<Button <Button
color="gray" color="gray-white"
size="xs" size="2xs"
onClick={() => { onClick={() => {
deleteGroupAboutPost() deleteGroupAboutPost()
}} }}
> >
<DocumentRemoveIcon className="inline h-4 w-4" /> <TrashIcon className="inline h-5 w-5" />
Delete
</Button> </Button>
</div> </Row>
</Col>
<Content content={post.content} />
<Spacer h={2} />
</div>
)} )}
</> </>
) )