bigbuffet/pleroma
2
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Merge branch 'next-admin' into 'next'

Browse source 
Next: Improve Reports styles

See merge request soapbox-pub/soapbox-fe!1275
This commit is contained in:
Alex Gleason 2022-04-29 03:00:17 +00:00
commit ff959a4417
3 changed files with 23 additions and 15 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

32
app/soapbox/features/admin/components/report.tsx
View file

@ -6,7 +6,8 @@ import { closeReports } from 'soapbox/actions/admin';
import { deactivateUserModal, deleteUserModal } from 'soapbox/actions/moderation'; import { deactivateUserModal, deleteUserModal } from 'soapbox/actions/moderation';
import snackbar from 'soapbox/actions/snackbar'; import snackbar from 'soapbox/actions/snackbar';
import Avatar from 'soapbox/components/avatar'; import Avatar from 'soapbox/components/avatar';
import { Button } from 'soapbox/components/ui'; import HoverRefWrapper from 'soapbox/components/hover_ref_wrapper';
import { Button, HStack } from 'soapbox/components/ui';
import DropdownMenu from 'soapbox/containers/dropdown_menu_container'; import DropdownMenu from 'soapbox/containers/dropdown_menu_container';
import Accordion from 'soapbox/features/ui/components/accordion'; import Accordion from 'soapbox/features/ui/components/accordion';
import { useAppDispatch } from 'soapbox/hooks'; import { useAppDispatch } from 'soapbox/hooks';
@ -74,16 +75,22 @@ const Report: React.FC<IReport> = ({ report }) => {
return ( return (
<div className='admin-report' key={report.get('id')}> <div className='admin-report' key={report.get('id')}>
<div className='admin-report__avatar'> <div className='admin-report__avatar'>
<Link to={`/@${acct}`} title={acct}> <HoverRefWrapper accountId={report.getIn(['account', 'id']) as string} inline>
<Avatar account={report.get('account')} size={32} /> <Link to={`/@${acct}`} title={acct}>
</Link> <Avatar account={report.get('account')} size={32} />
</Link>
</HoverRefWrapper>
</div> </div>
<div className='admin-report__content'> <div className='admin-report__content'>
<h4 className='admin-report__title'> <h4 className='admin-report__title'>
<FormattedMessage <FormattedMessage
id='admin.reports.report_title' id='admin.reports.report_title'
defaultMessage='Report on {acct}' defaultMessage='Report on {acct}'
values={{ acct: <Link to={`/@${acct}`} title={acct}>@{acct}</Link> }} values={{ acct: (
<HoverRefWrapper accountId={report.getIn(['account', 'id']) as string} inline>
<Link to={`/@${acct}`} title={acct}>@{acct}</Link>
</HoverRefWrapper>
) }}
/> />
</h4> </h4>
<div className='admin-report__statuses'> <div className='admin-report__statuses'>
@ -98,19 +105,24 @@ const Report: React.FC<IReport> = ({ report }) => {
)} )}
</div> </div>
<div className='admin-report__quote'> <div className='admin-report__quote'>
{report.get('content', '').length > 0 && {report.get('content', '').length > 0 && (
<blockquote className='md' dangerouslySetInnerHTML={{ __html: report.get('content') }} /> <blockquote className='md' dangerouslySetInnerHTML={{ __html: report.get('content') }} />
} )}
<span className='byline'>&mdash; <Link to={`/@${reporterAcct}`} title={reporterAcct}>@{reporterAcct}</Link></span> <span className='byline'>
&mdash;
<HoverRefWrapper accountId={report.getIn(['actor', 'id']) as string} inline>
<Link to={`/@${reporterAcct}`} title={reporterAcct}>@{reporterAcct}</Link>
</HoverRefWrapper>
</span>
</div> </div>
</div> </div>
<div className='admin-report__actions'> <HStack space={2} alignItems='start'>
<Button onClick={handleCloseReport}> <Button onClick={handleCloseReport}>
<FormattedMessage id='admin.reports.actions.close' defaultMessage='Close' /> <FormattedMessage id='admin.reports.actions.close' defaultMessage='Close' />
</Button> </Button>
<DropdownMenu items={menu} src={require('@tabler/icons/icons/dots-vertical.svg')} /> <DropdownMenu items={menu} src={require('@tabler/icons/icons/dots-vertical.svg')} />
</div> </HStack>
</div> </div>
); );
}; };

1
app/styles/components/accordion.scss
View file

@ -25,6 +25,7 @@
width: 100%; width: 100%;
&::after { &::after {
@apply text-black dark:text-white;
content: ''; content: '';
display: block; display: block;
font-family: 'Font Awesome 5 Free'; font-family: 'Font Awesome 5 Free';

5
app/styles/components/admin.scss
View file

@ -105,10 +105,6 @@
font-weight: bold; font-weight: bold;
text-overflow: ellipsis; text-overflow: ellipsis;
overflow: hidden; overflow: hidden;
a {
color: var(--primary-text-color);
}
} }
&__quote { &__quote {
@ -122,7 +118,6 @@
font-size: 12px; font-size: 12px;
a { a {
color: var(--primary-text-color);
text-decoration: none; text-decoration: none;
} }
} }