OpenSourceArk/Ghost
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Added static design for Search page

Browse Source 
ref https://linear.app/tryghost/issue/AP-352/search-for-mastodon-usernames-in-ghost-admin
This commit is contained in:
Djordje Vlaisavljevic 2024-08-17 17:33:19 +01:00
parent 6171a417de
commit 8cbdecfc7f
2 changed files with 37 additions and 2 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

38
apps/admin-x-activitypub/src/components/Search.tsx
View File

@ -1,6 +1,8 @@
import APAvatar from './global/APAvatar';
import ActivityItem from './activities/ActivityItem';
import MainNavigation from './navigation/MainNavigation';
import React from 'react';
import {Icon} from '@tryghost/admin-x-design-system';
import {Button, Icon} from '@tryghost/admin-x-design-system';
interface SearchProps {}
@ -9,7 +11,39 @@ const Search: React.FC<SearchProps> = ({}) => {
<>
<MainNavigation />
<div className='z-0 flex w-full flex-col items-center pt-8'>
<div className='flex w-full max-w-[560px] items-center gap-2 rounded-full bg-grey-100 px-3 py-2 text-grey-500'><Icon name='magnifying-glass' size={18} />Search the Fediverse</div>
<div className='mb-6 flex w-full max-w-[560px] items-center gap-2 rounded-full bg-grey-100 px-3 py-2 text-grey-500'><Icon name='magnifying-glass' size={18} />Search the Fediverse</div>
<ActivityItem>
<APAvatar/>
<div>
<div className='text-grey-600'><span className='font-bold text-black'>Lydia Mango</span> @username@domain.com</div>
<div className='text-sm'>1,535 followers</div>
</div>
<Button className='ml-auto' label='Follow' link />
</ActivityItem>
<ActivityItem>
<APAvatar/>
<div>
<div className='text-grey-600'><span className='font-bold text-black'>Tiana Passaquindici Arcand</span> @username@domain.com</div>
<div className='text-sm'>4,545 followers</div>
</div>
<Button className='ml-auto' label='Follow' link />
</ActivityItem>
<ActivityItem>
<APAvatar/>
<div>
<div className='text-grey-600'><span className='font-bold text-black'>Gretchen Press</span> @username@domain.com</div>
<div className='text-sm'>1,156 followers</div>
</div>
<Button className='ml-auto' label='Follow' link />
</ActivityItem>
<ActivityItem>
<APAvatar/>
<div>
<div className='text-grey-600'><span className='font-bold text-black'>Leo Lubin</span> @username@domain.com</div>
<div className='text-sm'>1,584 followers</div>
</div>
<Button className='ml-auto' label='Follow' link />
</ActivityItem>
</div>
</>
);

1
apps/admin-x-activitypub/src/components/activities/ActivityItem.tsx
View File

@ -19,6 +19,7 @@ const ActivityItem: React.FC<ActivityItemProps> = ({children}) => {
<div className='flex w-full items-center gap-3 border-b border-grey-100 py-4'>
{childrenArray[0]}
{childrenArray[1]}
{childrenArray[2]}
</div>
</div>
);