arno/trezor-wallet
1
0
Fork 0
mirror of https://github.com/trezor/trezor-wallet synced 2025-01-09 07:30:58 +00:00
Code Issues Releases Wiki Activity

Merge pull request #433 from trezor/feature/footer-translators

Browse Source 
Fix/Add thanks to translators
This commit is contained in:
Vladimir Volek 2019-03-06 16:15:21 +01:00 committed by GitHub
commit 072be53263
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
2 changed files with 90 additions and 40 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

121
src/components/Footer/index.js
View File

@ -4,13 +4,12 @@ import styled from 'styled-components';
import PropTypes from 'prop-types'; import PropTypes from 'prop-types';
import React from 'react'; import React from 'react';
import Link from 'components/Link'; import Link from 'components/Link';
import { getYear } from 'date-fns';
import { bindActionCreators } from 'redux'; import { bindActionCreators } from 'redux';
import { connect } from 'react-redux'; import { connect } from 'react-redux';
import { FormattedMessage } from 'react-intl'; import { FormattedMessage } from 'react-intl';
import colors from 'config/colors'; import colors from 'config/colors';
import { FONT_SIZE } from 'config/variables'; import { FONT_SIZE, SCREEN_SIZE } from 'config/variables';
import * as LogActions from 'actions/LogActions'; import * as LogActions from 'actions/LogActions';
import l10nMessages from './index.messages'; import l10nMessages from './index.messages';
@ -33,7 +32,7 @@ const Wrapper = styled.div`
justify-content: space-between; justify-content: space-between;
border-top: 1px solid ${colors.BACKGROUND}; border-top: 1px solid ${colors.BACKGROUND};
@media all and (max-width: 850px) { @media all and (max-width: ${SCREEN_SIZE.MD}) {
justify-content: center; justify-content: center;
} }
`; `;
@ -41,52 +40,94 @@ const Wrapper = styled.div`
const StyledLink = styled(Link)` const StyledLink = styled(Link)`
margin: 0 10px; margin: 0 10px;
white-space: nowrap; white-space: nowrap;
`;
const Copy = styled.div` &:first-child {
white-space: nowrap; margin-left: 0;
margin-right: 10px; }
`; `;
const Left = styled.div` const Left = styled.div`
display: flex; display: flex;
margin-right: 10px;
@media all and (max-width: ${SCREEN_SIZE.XS}) {
margin: 0;
}
`; `;
const Right = styled.div` const Right = styled.div``;
white-space: nowrap;
margin: 0 10px; const RatesLeft = styled.div`
@media all and (max-width: ${SCREEN_SIZE.XS}) {
display: none;
}
`; `;
const Footer = ({ opened, toggle, isLanding }: Props) => ( const TranslatorsRight = styled.div`
<Wrapper> @media all and (max-width: ${SCREEN_SIZE.XS}) {
<Left> display: none;
<Copy>&copy; {getYear(new Date())}</Copy> }
<StyledLink href="http://satoshilabs.com" isGreen> `;
SatoshiLabs
</StyledLink> const RatesRight = styled.div`
<StyledLink href="https://trezor.io/tos" isGreen> display: none;
<FormattedMessage {...l10nMessages.TR_TERMS} />
</StyledLink> @media all and (max-width: ${SCREEN_SIZE.XS}) {
<StyledLink onClick={toggle} isGreen> display: block;
{opened ? 'Hide Log' : 'Show Log'} width: 100%;
</StyledLink> }
</Left> `;
{!isLanding && (
<Right> const Footer = ({ opened, toggle, isLanding }: Props) => {
<FormattedMessage const exchangeRates = (
{...l10nMessages.TR_EXCHANGE_RATES_BY} <FormattedMessage
values={{ {...l10nMessages.TR_EXCHANGE_RATES_BY}
service: ( values={{
<Link href="https://www.coingecko.com" isGreen> service: (
Coingecko <Link href="https://www.coingecko.com" isGreen>
</Link> Coingecko
), </Link>
}} ),
/> }}
</Right> />
)} );
</Wrapper> return (
); <Wrapper>
<Left>
<StyledLink href="http://satoshilabs.com" isGreen>
SatoshiLabs
</StyledLink>
<StyledLink href="https://trezor.io/tos" isGreen>
<FormattedMessage {...l10nMessages.TR_TERMS} />
</StyledLink>
<StyledLink onClick={toggle} isGreen>
{opened ? 'Hide Log' : 'Show Log'}
</StyledLink>
<RatesLeft>{exchangeRates}</RatesLeft>
</Left>
{!isLanding && (
<Right>
<TranslatorsRight>
<FormattedMessage
{...l10nMessages.TR_WE_THANK_OUR_TRANSLATORS}
values={{
TR_CONTRIBUTION: (
<Link
href="https://wiki.trezor.io/CrowdIn.com_-_A_tool_for_translation"
isGreen
>
<FormattedMessage {...l10nMessages.TR_CONTRIBUTION} />
</Link>
),
}}
/>
</TranslatorsRight>
<RatesRight>{exchangeRates}</RatesRight>
</Right>
)}
</Wrapper>
);
};
Footer.propTypes = { Footer.propTypes = {
opened: PropTypes.bool.isRequired, opened: PropTypes.bool.isRequired,

9
src/components/Footer/index.messages.js
View File

@ -12,6 +12,15 @@ const definedMessages: Messages = defineMessages({
id: 'TR_EXCHANGE_RATES_BY', id: 'TR_EXCHANGE_RATES_BY',
defaultMessage: 'Exchange rates by {service}', defaultMessage: 'Exchange rates by {service}',
}, },
TR_WE_THANK_OUR_TRANSLATORS: {
id: 'TR_WE_THANK_OUR_TRANSLATORS',
defaultMessage: 'We thank our translators for their {TR_CONTRIBUTION}',
},
TR_CONTRIBUTION: {
id: 'TR_CONTRIBUTION',
defaultMessage: 'contribution',
description: 'Part of the sentence: We thank our translators for their contribution',
},
}); });
export default definedMessages; export default definedMessages;