Updated max lines of status content

Improving visibility
This commit is contained in:
mgabdev 2020-01-15 11:14:44 -05:00
parent f40ff36f1b
commit 4787060608
3 changed files with 25 additions and 24 deletions

View File

@ -7,7 +7,7 @@ import Permalink from './permalink';
import classnames from 'classnames'; import classnames from 'classnames';
import Icon from 'gabsocial/components/icon'; import Icon from 'gabsocial/components/icon';
const MAX_HEIGHT = 642; // 20px * 32 (+ 2px padding at the top) const MAX_HEIGHT = 200;
export default class StatusContent extends React.PureComponent { export default class StatusContent extends React.PureComponent {

View File

@ -7,36 +7,37 @@ import { connect } from 'react-redux';
import { NavLink } from 'react-router-dom'; import { NavLink } from 'react-router-dom';
const mapStateToProps = (state, { id }) => ({ const mapStateToProps = (state, { id }) => ({
status: state.getIn(['statuses', id]), status: state.getIn(['statuses', id]),
account: state.getIn(['accounts', state.getIn(['statuses', id, 'account'])]), account: state.getIn(['accounts', state.getIn(['statuses', id, 'account'])]),
}); });
@connect(mapStateToProps) @connect(mapStateToProps)
export default class StatusQuote extends React.PureComponent { export default class StatusQuote extends React.PureComponent {
static contextTypes = { static contextTypes = {
router: PropTypes.object, router: PropTypes.object,
}; };
static propTypes = { static propTypes = {
status: ImmutablePropTypes.map.isRequired, status: ImmutablePropTypes.map.isRequired,
}; };
render() { render() {
const { status, account } = this.props; const { status, account } = this.props;
const statusUrl = `/${account.get('acct')}/posts/${status.get('id')}`; const statusUrl = `/${account.get('acct')}/posts/${status.get('id')}`;
return ( return (
<NavLink to={statusUrl} className="status__quote"> <NavLink to={statusUrl} className="status__quote">
<DisplayName account={account} /> <DisplayName account={account} />
<StatusContent
<StatusContent status={status}
status={status} expanded={false}
expanded={false} onClick
/> collapsable
</NavLink> />
); </NavLink>
} );
}
} }

View File

@ -428,7 +428,7 @@
} }
.status__content.status__content--collapsed { .status__content.status__content--collapsed {
max-height: 20px * 15; // 15 lines is roughly above 500 characters max-height: 20px * 10; // 10 lines x 20px per line of text
} }
.status__content__read-more-button { .status__content__read-more-button {