fix: minor pages ui (#700)

This commit is contained in:
Aaryan Khandelwal 2023-04-04 18:31:28 +05:30 committed by GitHub
parent 7f7ceec24c
commit 0036ac6afb
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
3 changed files with 15 additions and 28 deletions

View File

@ -148,15 +148,15 @@ export const CreateUpdateBlockInline: React.FC<Props> = ({
useEffect(() => { useEffect(() => {
window.addEventListener("keydown", (e: KeyboardEvent) => { window.addEventListener("keydown", (e: KeyboardEvent) => {
if (e.key === "Escape") onClose(); if (e.key === "Escape") handleClose();
}); });
return () => { return () => {
window.removeEventListener("keydown", (e: KeyboardEvent) => { window.removeEventListener("keydown", (e: KeyboardEvent) => {
if (e.key === "Escape") onClose(); if (e.key === "Escape") handleClose();
}); });
}; };
}, [onClose]); }, [handleClose]);
return ( return (
<div className="border rounded-[10px] p-2 ml-6"> <div className="border rounded-[10px] p-2 ml-6">

View File

@ -50,9 +50,9 @@ export const SinglePageDetailedItem: React.FC<TSingleStatProps> = ({
const { workspaceSlug, projectId } = router.query; const { workspaceSlug, projectId } = router.query;
return ( return (
<Link href={`/${workspaceSlug}/projects/${projectId}/pages/${page.id}`}> <div className="relative first:rounded-t last:rounded-b border">
<a> <Link href={`/${workspaceSlug}/projects/${projectId}/pages/${page.id}`}>
<div className="relative rounded border p-4"> <a className="block p-4">
<div className="flex items-center justify-between gap-2"> <div className="flex items-center justify-between gap-2">
<div className="flex items-center gap-2"> <div className="flex items-center gap-2">
<p className="mr-2 truncate text-sm font-medium">{truncateText(page.name, 75)}</p> <p className="mr-2 truncate text-sm font-medium">{truncateText(page.name, 75)}</p>
@ -157,26 +157,13 @@ export const SinglePageDetailedItem: React.FC<TSingleStatProps> = ({
</CustomMenu> </CustomMenu>
</div> </div>
</div> </div>
<div className="relative mt-6 space-y-2 text-sm text-gray-600"> <div className="relative mt-2 space-y-2 text-sm text-gray-600">
<div className="page-block-section -m-4 -mt-6"> {page.blocks.length > 0
{page.blocks.length > 0 ? ( ? page.blocks.slice(0, 3).map((block) => <h4>{block.name}</h4>)
<RemirrorRichTextEditor : null}
value={
!page.blocks[0].description ||
(typeof page.blocks[0].description === "object" &&
Object.keys(page.blocks[0].description).length === 0)
? page.blocks[0].description_html
: page.blocks[0].description
}
editable={false}
customClassName="text-gray-500"
noBorder
/>
) : null}
</div>
</div> </div>
</div> </a>
</a> </Link>
</Link> </div>
); );
}; };

View File

@ -477,7 +477,7 @@ const SinglePage: NextPage<UserAuth> = (props) => {
{!createBlockForm && ( {!createBlockForm && (
<button <button
type="button" type="button"
className="flex items-center gap-1 rounded bg-gray-100 px-2.5 py-1 text-xs hover:bg-gray-200 mt-4" className="flex items-center gap-1 rounded bg-gray-100 px-2.5 py-1 ml-6 text-xs hover:bg-gray-200 mt-4"
onClick={handleNewBlock} onClick={handleNewBlock}
> >
<PlusIcon className="h-3 w-3" /> <PlusIcon className="h-3 w-3" />
@ -485,7 +485,7 @@ const SinglePage: NextPage<UserAuth> = (props) => {
</button> </button>
)} )}
{createBlockForm && ( {createBlockForm && (
<div ref={scrollToRef}> <div className="mt-4" ref={scrollToRef}>
<CreateUpdateBlockInline <CreateUpdateBlockInline
handleClose={() => setCreateBlockForm(false)} handleClose={() => setCreateBlockForm(false)}
focus="name" focus="name"