treehouse
/
mastodon
21
8
Fork 5
Code Issues 32 Pull Requests Projects 1 Releases Wiki Activity

[Glitch] Display verified links in glitch flavor 

Port front-end changes from f4d549d300 to glitch-soc
remotes/1727458204337373841/tmp_refs/heads/signup-info-prompt
Thibaut Girka 2018-09-21 07:37:37 +02:00 committed by ThibG
parent 5833cc41c2
commit 9e8d776a77
2 changed files with 19 additions and 16 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

14
app/javascript/flavours/glitch/features/account/components/header.js
View File

@ -16,8 +16,18 @@ const messages = defineMessages({
requested: { id: 'account.requested', defaultMessage: 'Awaiting approval. Click to cancel follow request' }, requested: { id: 'account.requested', defaultMessage: 'Awaiting approval. Click to cancel follow request' },
unblock: { id: 'account.unblock', defaultMessage: 'Unblock @{name}' }, unblock: { id: 'account.unblock', defaultMessage: 'Unblock @{name}' },
edit_profile: { id: 'account.edit_profile', defaultMessage: 'Edit profile' }, edit_profile: { id: 'account.edit_profile', defaultMessage: 'Edit profile' },
link_verified_on: { id: 'account.link_verified_on', defaultMessage: 'Ownership of this link was checked on {date}' },
}); });
const dateFormatOptions = {
month: 'short',
day: 'numeric',
year: 'numeric',
hour12: false,
hour: '2-digit',
minute: '2-digit',
};
@injectIntl @injectIntl
export default class Header extends ImmutablePureComponent { export default class Header extends ImmutablePureComponent {
@ -122,7 +132,9 @@ export default class Header extends ImmutablePureComponent {
{fields.map((pair, i) => ( {fields.map((pair, i) => (
<dl key={i}> <dl key={i}>
<dt dangerouslySetInnerHTML={{ __html: pair.get('name_emojified') }} title={pair.get('name')} /> <dt dangerouslySetInnerHTML={{ __html: pair.get('name_emojified') }} title={pair.get('name')} />
<dd dangerouslySetInnerHTML={{ __html: pair.get('value_emojified') }} title={pair.get('value_plain')} /> <dd className={pair.get('verified_at') && 'verified'} title={pair.get('value_plain')}>
{pair.get('verified_at') && <span title={intl.formatMessage(messages.link_verified_on, { date: intl.formatDate(pair.get('verified_at'), dateFormatOptions) })}><i className='fa fa-check verified__mark' /></span>} <span dangerouslySetInnerHTML={{ __html: pair.get('value_emojified') }} />
</dd>
</dl> </dl>
))} ))}
</div> </div>

21
app/javascript/flavours/glitch/styles/components/metadata.scss
View File

@ -4,17 +4,11 @@
overflow: hidden; overflow: hidden;
margin: 20px -10px -20px; margin: 20px -10px -20px;
border-bottom: 0; border-bottom: 0;
border-top: 0;
a {
text-decoration: none;
&:hover{
text-decoration: underline;
}
}
dl { dl {
border-top: 1px solid lighten($ui-base-color, 8%); border-top: 1px solid lighten($ui-base-color, 4%);
border-bottom: 0;
display: flex; display: flex;
} }
@ -35,10 +29,6 @@
width: 120px; width: 120px;
flex: 0 0 auto; flex: 0 0 auto;
font-weight: 500; font-weight: 500;
a {
color: $primary-text-color;
}
} }
dd { dd {
@ -46,8 +36,9 @@
color: $primary-text-color; color: $primary-text-color;
background: $ui-base-color; background: $ui-base-color;
a { &.verified {
color: $highlight-text-color; border: 1px solid rgba($valid-value-color, 0.5);
background: rgba($valid-value-color, 0.25);
} }
} }
} }