ProfileField: style verified links

next
Alex Gleason 2022-04-29 21:51:48 -05:00
rodzic ce73b30237
commit c4e376816d
Nie znaleziono w bazie danych klucza dla tego podpisu
ID klucza GPG: 7211D1F99744FBB7
1 zmienionych plików z 10 dodań i 8 usunięć

Wyświetl plik

@ -2,7 +2,7 @@ import classNames from 'classnames';
import React from 'react'; import React from 'react';
import { defineMessages, useIntl, FormattedMessage, FormatDateOptions } from 'react-intl'; import { defineMessages, useIntl, FormattedMessage, FormatDateOptions } from 'react-intl';
import { Widget, Stack, Icon, Text } from 'soapbox/components/ui'; import { Widget, Stack, HStack, Icon, Text } from 'soapbox/components/ui';
import BundleContainer from 'soapbox/features/ui/containers/bundle_container'; import BundleContainer from 'soapbox/features/ui/containers/bundle_container';
import { CryptoAddress } from 'soapbox/features/ui/util/async-components'; import { CryptoAddress } from 'soapbox/features/ui/util/async-components';
@ -55,16 +55,18 @@ const ProfileField: React.FC<IProfileField> = ({ field }) => {
</dt> </dt>
<dd <dd
className={classNames({ 'verified': field.verified_at })} className={classNames({ 'text-success-500': field.verified_at })}
title={field.value_plain} title={field.value_plain}
> >
{field.verified_at && ( <HStack space={2} alignItems='center'>
<span title={intl.formatMessage(messages.linkVerifiedOn, { date: intl.formatDate(field.verified_at, dateFormatOptions) })}> {field.verified_at && (
<Icon className='verified__mark' src={require('@tabler/icons/icons/check.svg')} /> <span className='flex-none' title={intl.formatMessage(messages.linkVerifiedOn, { date: intl.formatDate(field.verified_at, dateFormatOptions) })}>
</span> <Icon src={require('@tabler/icons/icons/check.svg')} />
)} </span>
)}
<Text tag='span' dangerouslySetInnerHTML={{ __html: field.value_emojified }} /> <Text tag='span' dangerouslySetInnerHTML={{ __html: field.value_emojified }} />
</HStack>
</dd> </dd>
</dl> </dl>
); );