TryGhost/Ghost
1
0
Fork 0
mirror of https://github.com/TryGhost/Ghost.git synced 2024-11-23 03:42:27 +03:00
Code Issues Projects Releases Wiki Activity

Updated AP reply box design

Browse Source 
ref https://linear.app/tryghost/issue/AP-307/component-for-replying-to-objects-in-the-inboxfeed
This commit is contained in:
Djordje Vlaisavljevic 2024-09-17 23:43:35 +01:00 committed by Fabien 'egg' O'Carroll
parent 6df9ad6537
commit b6c5cca890
3 changed files with 8 additions and 5 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

5
apps/admin-x-activitypub/src/components/feed/ArticleModal.tsx
View File

@ -76,7 +76,7 @@ const FeedItemDivider: React.FC = () => (
const ArticleModal: React.FC<ArticleModalProps> = ({object, actor, comments, allComments}) => { const ArticleModal: React.FC<ArticleModalProps> = ({object, actor, comments, allComments}) => {
const MODAL_SIZE_SM = 640; const MODAL_SIZE_SM = 640;
const MODAL_SIZE_LG = 1024; const MODAL_SIZE_LG = 2800;
const [modalSize, setModalSize] = useState<number>(MODAL_SIZE_SM); const [modalSize, setModalSize] = useState<number>(MODAL_SIZE_SM);
const modal = useModal(); const modal = useModal();
@ -144,7 +144,7 @@ const ArticleModal: React.FC<ArticleModalProps> = ({object, actor, comments, all
</MainHeader> </MainHeader>
<div className='mt-10 w-auto'> <div className='mt-10 w-auto'>
{object.type === 'Note' && ( {object.type === 'Note' && (
<div className='mx-auto max-w-[580px]'> <div className='mx-auto max-w-[580px] pb-16'>
<FeedItem <FeedItem
actor={actor} actor={actor}
comments={comments} comments={comments}
@ -153,6 +153,7 @@ const ArticleModal: React.FC<ArticleModalProps> = ({object, actor, comments, all
type='Note' type='Note'
/> />
<APReplyBox placeholder='Reply to @fake@user...'/> <APReplyBox placeholder='Reply to @fake@user...'/>
<FeedItemDivider />
{/* {object.content && <div dangerouslySetInnerHTML={({__html: object.content})} className='ap-note-content text-pretty text-[1.5rem] text-grey-900'></div>} */} {/* {object.content && <div dangerouslySetInnerHTML={({__html: object.content})} className='ap-note-content text-pretty text-[1.5rem] text-grey-900'></div>} */}
{/* {renderAttachment(object)} */} {/* {renderAttachment(object)} */}

4
apps/admin-x-activitypub/src/components/global/APReplyBox.tsx
View File

@ -47,8 +47,8 @@ const APReplyBox: React.FC<APTextAreaProps> = ({
// }; // };
const styles = clsx( const styles = clsx(
'order-2 w-full resize-none rounded-lg border bg-grey-150 px-3 py-2 text-[1.5rem] transition-all dark:bg-grey-900 dark:text-white', 'ap-textarea order-2 w-full resize-none rounded-lg border py-2 pr-3 text-[1.5rem] transition-all dark:text-white',
error ? 'border-red bg-white' : 'border-transparent placeholder:text-grey-500 hover:bg-grey-100 focus:border-green focus:bg-white focus:shadow-[0_0_0_2px_rgba(48,207,67,0.25)] dark:placeholder:text-grey-800 dark:hover:bg-grey-925 dark:focus:bg-grey-950', error ? 'border-red' : 'border-transparent placeholder:text-grey-500 dark:placeholder:text-grey-800',
title && 'mt-1.5', title && 'mt-1.5',
className className
); );

4
apps/admin-x-activitypub/src/styles/index.css
View File

@ -50,4 +50,6 @@ animation: bump 0.3s ease-in-out;
width: 0; width: 0;
} }
.ap-textarea {
field-sizing: content;
}