diff options
6 files changed, 85 insertions, 75 deletions
diff --git a/app/javascript/flavours/glitch/components/account.js b/app/javascript/flavours/glitch/components/account.js index 8bfc8e9dc..8e810ce5f 100644 --- a/app/javascript/flavours/glitch/components/account.js +++ b/app/javascript/flavours/glitch/components/account.js @@ -27,6 +27,7 @@ export default @injectIntl class Account extends ImmutablePureComponent { static propTypes = { + size: PropTypes.number, account: ImmutablePropTypes.map, onFollow: PropTypes.func.isRequired, onBlock: PropTypes.func.isRequired, @@ -41,6 +42,10 @@ class Account extends ImmutablePureComponent { onActionClick: PropTypes.func, }; + static defaultProps = { + size: 36, + }; + handleFollow = () => { this.props.onFollow(this.props.account); } @@ -75,6 +80,7 @@ class Account extends ImmutablePureComponent { actionIcon, actionTitle, defaultAction, + size, } = this.props; if (!account) { @@ -163,7 +169,7 @@ class Account extends ImmutablePureComponent { <div className='account'> <div className='account__wrapper'> <Permalink key={account.get('id')} className='account__display-name' title={account.get('acct')} href={account.get('url')} to={`/@${account.get('acct')}`}> - <div className='account__avatar-wrapper'><Avatar account={account} size={36} /></div> + <div className='account__avatar-wrapper'><Avatar account={account} size={size} /></div> {mute_expires_at} <DisplayName account={account} /> </Permalink> diff --git a/app/javascript/flavours/glitch/components/server_banner.js b/app/javascript/flavours/glitch/components/server_banner.js index 9cb0ef13c..36e0ff238 100644 --- a/app/javascript/flavours/glitch/components/server_banner.js +++ b/app/javascript/flavours/glitch/components/server_banner.js @@ -61,7 +61,7 @@ class ServerBanner extends React.PureComponent { <div className='server-banner__meta__column'> <h4><FormattedMessage id='server_banner.administered_by' defaultMessage='Administered by:' /></h4> - <Account id={server.getIn(['contact', 'account', 'id'])} /> + <Account id={server.getIn(['contact', 'account', 'id'])} size={36} /> </div> <div className='server-banner__meta__column'> diff --git a/app/javascript/flavours/glitch/features/about/index.js b/app/javascript/flavours/glitch/features/about/index.js index 3d26c59bc..4129c8236 100644 --- a/app/javascript/flavours/glitch/features/about/index.js +++ b/app/javascript/flavours/glitch/features/about/index.js @@ -125,7 +125,7 @@ class About extends React.PureComponent { <div className='about__meta__column'> <h4><FormattedMessage id='server_banner.administered_by' defaultMessage='Administered by:' /></h4> - <Account id={server.getIn(['contact', 'account', 'id'])} /> + <Account id={server.getIn(['contact', 'account', 'id'])} size={36} /> </div> <hr className='about__meta__divider' /> @@ -209,6 +209,11 @@ class About extends React.PureComponent { </Section> <LinkFooter /> + + <div className='about__footer'> + <p><FormattedMessage id='about.fork_disclaimer' defaultMessage='Glitch-soc is free open source software forked from Mastodon.' /></p> + <p><FormattedMessage id='about.disclaimer' defaultMessage='Mastodon is free, open-source software, and a trademark of Mastodon gGmbH.' /></p> + </div> </div> <Helmet> diff --git a/app/javascript/flavours/glitch/features/ui/components/link_footer.js b/app/javascript/flavours/glitch/features/ui/components/link_footer.js index 3f74c908a..d7a4cf130 100644 --- a/app/javascript/flavours/glitch/features/ui/components/link_footer.js +++ b/app/javascript/flavours/glitch/features/ui/components/link_footer.js @@ -3,7 +3,7 @@ import React from 'react'; import PropTypes from 'prop-types'; import { FormattedMessage, defineMessages, injectIntl } from 'react-intl'; import { Link } from 'react-router-dom'; -import { version, repository, source_url, profile_directory as profileDirectory } from 'flavours/glitch/initial_state'; +import { domain, version, source_url, profile_directory as profileDirectory } from 'flavours/glitch/initial_state'; import { logOut } from 'flavours/glitch/utils/log_out'; import { openModal } from 'flavours/glitch/actions/modal'; import { PERMISSION_INVITE_USERS } from 'flavours/glitch/permissions'; @@ -48,44 +48,44 @@ class LinkFooter extends React.PureComponent { render () { const { signedIn, permissions } = this.context.identity; - const items = []; - items.push(<a key='apps' href='https://joinmastodon.org/apps' target='_blank'><FormattedMessage id='navigation_bar.apps' defaultMessage='Get the app' /></a>); - items.push(<Link key='about' to='/about'><FormattedMessage id='navigation_bar.info' defaultMessage='About' /></Link>); - items.push(<a key='mastodon' href='https://joinmastodon.org' target='_blank'><FormattedMessage id='getting_started.what_is_mastodon' defaultMessage='About Mastodon' /></a>); - items.push(<a key='docs' href='https://docs.joinmastodon.org' target='_blank'><FormattedMessage id='getting_started.documentation' defaultMessage='Documentation' /></a>); - items.push(<Link key='privacy-policy' to='/privacy-policy'><FormattedMessage id='getting_started.privacy_policy' defaultMessage='Privacy Policy' /></Link>); - items.push(<Link key='hotkeys' to='/keyboard-shortcuts'><FormattedMessage id='navigation_bar.keyboard_shortcuts' defaultMessage='Hotkeys' /></Link>); - - if (profileDirectory) { - items.push(<Link key='directory' to='/directory'><FormattedMessage id='getting_started.directory' defaultMessage='Directory' /></Link>); - } - - if (signedIn) { - if ((permissions & PERMISSION_INVITE_USERS) === PERMISSION_INVITE_USERS) { - items.push(<a key='invites' href='/invites' target='_blank'><FormattedMessage id='getting_started.invite' defaultMessage='Invite people' /></a>); - } - - items.push(<a key='security' href='/auth/edit'><FormattedMessage id='getting_started.security' defaultMessage='Security' /></a>); - items.push(<a key='logout' href='/auth/sign_out' onClick={this.handleLogoutClick}><FormattedMessage id='navigation_bar.logout' defaultMessage='Logout' /></a>); - } + const canInvite = signedIn && ((permissions & PERMISSION_INVITE_USERS) === PERMISSION_INVITE_USERS); + const canProfileDirectory = profileDirectory; return ( - <div className='getting-started__footer'> - <ul> - {items.map((item, index, array) => ( - <li>{item} { index === array.length - 1 ? null : ' · ' }</li> - ))} - </ul> + <div className='link-footer'> + <p> + <strong>{domain}</strong>: + {' '} + <Link key='about' to='/about'><FormattedMessage id='footer.about' defaultMessage='About' /></Link> + {canInvite && ( + <> + {' · '} + <a key='invites' href='/invites' target='_blank'><FormattedMessage id='footer.invite' defaultMessage='Invite people' /></a> + </> + )} + {canProfileDirectory && ( + <> + {' · '} + <Link key='directory' to='/directory'><FormattedMessage id='footer.directory' defaultMessage='Profiles directory' /></Link> + </> + )} + {' · '} + <Link key='privacy-policy' to='/privacy-policy'><FormattedMessage id='footer.privacy_policy' defaultMessage='Privacy policy' /></Link> + </p> <p> - <FormattedMessage - id='getting_started.open_source_notice' - defaultMessage='Glitchsoc is open source software, a friendly fork of {Mastodon}. You can contribute or report issues on GitHub at {github}.' - values={{ - github: <span><a href={source_url} rel='noopener noreferrer' target='_blank'>{repository}</a> (v{version})</span>, - Mastodon: <a href='https://github.com/mastodon/mastodon' rel='noopener noreferrer' target='_blank'>Mastodon</a> }} - /> + <strong>Mastodon</strong>: + {' '} + <a href='https://joinmastodon.org' target='_blank'><FormattedMessage id='footer.about' defaultMessage='About' /></a> + {' · '} + <a href='https://joinmastodon.org/apps' target='_blank'><FormattedMessage id='footer.get_app' defaultMessage='Get the app' /></a> + {' · '} + <Link to='/keyboard-shortcuts'><FormattedMessage id='footer.keyboard_shortcuts' defaultMessage='Keyboard shortcuts' /></Link> + {' · '} + <a href={source_url} rel='noopener noreferrer' target='_blank'><FormattedMessage id='footer.source_code' defaultMessage='View source code' /></a> + {' · '} + v{version} </p> </div> ); diff --git a/app/javascript/flavours/glitch/styles/components/about.scss b/app/javascript/flavours/glitch/styles/components/about.scss index ca9ba3ebf..c6cc6c615 100644 --- a/app/javascript/flavours/glitch/styles/components/about.scss +++ b/app/javascript/flavours/glitch/styles/components/about.scss @@ -30,6 +30,34 @@ } } +.link-footer { + flex: 0 0 auto; + padding: 10px; + padding-top: 20px; + z-index: 1; + font-size: 13px; + + p { + color: $dark-text-color; + margin-bottom: 20px; + + strong { + font-weight: 500; + } + + a { + color: $dark-text-color; + text-decoration: underline; + + &:hover, + &:focus, + &:active { + text-decoration: none; + } + } + } +} + .about { padding: 20px; @@ -37,6 +65,14 @@ border-radius: 4px; } + &__footer { + color: $dark-text-color; + text-align: center; + font-size: 15px; + line-height: 22px; + margin-top: 20px; + } + &__header { margin-bottom: 30px; @@ -157,7 +193,7 @@ } } - .getting-started__footer { + .link-footer { padding: 0; margin-top: 60px; text-align: center; diff --git a/app/javascript/flavours/glitch/styles/components/index.scss b/app/javascript/flavours/glitch/styles/components/index.scss index 28f93018d..c3276b035 100644 --- a/app/javascript/flavours/glitch/styles/components/index.scss +++ b/app/javascript/flavours/glitch/styles/components/index.scss @@ -1044,43 +1044,6 @@ color: $dark-text-color; } - &__footer { - flex: 0 0 auto; - padding: 10px; - padding-top: 20px; - z-index: 1; - font-size: 13px; - - ul { - margin-bottom: 10px; - } - - ul li { - display: inline; - } - - p { - color: $dark-text-color; - margin-bottom: 20px; - - a { - color: $dark-text-color; - text-decoration: underline; - } - } - - a { - text-decoration: none; - color: $darker-text-color; - - &:hover, - &:focus, - &:active { - text-decoration: underline; - } - } - } - &__trends { flex: 0 1 auto; opacity: 1; |