Change larger reblogs/favourites numbers to be shortened in web UI (#20303)

pull/20321/head
Eugen Rochko 2022-11-10 08:49:59 +01:00 committed by GitHub
parent 16122761c5
commit 7bdb2433f1
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
2 changed files with 4 additions and 3 deletions

View File

@ -1,6 +1,6 @@
import React from 'react'; import React from 'react';
import PropTypes from 'prop-types'; import PropTypes from 'prop-types';
import { FormattedNumber } from 'react-intl'; import ShortNumber from 'mastodon/components/short_number';
import TransitionMotion from 'react-motion/lib/TransitionMotion'; import TransitionMotion from 'react-motion/lib/TransitionMotion';
import spring from 'react-motion/lib/spring'; import spring from 'react-motion/lib/spring';
import { reduceMotion } from 'mastodon/initial_state'; import { reduceMotion } from 'mastodon/initial_state';
@ -51,7 +51,7 @@ export default class AnimatedNumber extends React.PureComponent {
const { direction } = this.state; const { direction } = this.state;
if (reduceMotion) { if (reduceMotion) {
return obfuscate ? obfuscatedCount(value) : <FormattedNumber value={value} />; return obfuscate ? obfuscatedCount(value) : <ShortNumber value={value} />;
} }
const styles = [{ const styles = [{
@ -65,7 +65,7 @@ export default class AnimatedNumber extends React.PureComponent {
{items => ( {items => (
<span className='animated-number'> <span className='animated-number'>
{items.map(({ key, data, style }) => ( {items.map(({ key, data, style }) => (
<span key={key} style={{ position: (direction * style.y) > 0 ? 'absolute' : 'static', transform: `translateY(${style.y * 100}%)` }}>{obfuscate ? obfuscatedCount(data) : <FormattedNumber value={data} />}</span> <span key={key} style={{ position: (direction * style.y) > 0 ? 'absolute' : 'static', transform: `translateY(${style.y * 100}%)` }}>{obfuscate ? obfuscatedCount(data) : <ShortNumber value={data} />}</span>
))} ))}
</span> </span>
)} )}

View File

@ -1303,6 +1303,7 @@
display: inline-block; display: inline-block;
font-weight: 500; font-weight: 500;
font-size: 12px; font-size: 12px;
line-height: 17px;
margin-left: 6px; margin-left: 6px;
} }