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

more trezor-ui-components integration

Browse Source
This commit is contained in:
slowbackspace 2019-03-18 18:23:40 +01:00
parent 482f62d317
commit 2ed64452d5
26 changed files with 44 additions and 73 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
src/components/Notification/components/NotificationButton/index.js
View File

@ -3,11 +3,9 @@
import * as React from 'react';
import styled from 'styled-components';
import PropTypes from 'prop-types';
import Icon from 'components/Icon';
import colors from 'config/colors';
import { Icon, Loader, colors } from 'trezor-ui-components';
import { WHITE_COLOR } from 'config/animations';
import { getPrimaryColor } from 'utils/notification';
import Loader from 'components/Loader';
import { TRANSITION, FONT_SIZE, FONT_WEIGHT, SCREEN_SIZE } from 'config/variables';
type Props = {

3
src/components/images/DeviceIcon/index.js
View File

@ -2,8 +2,7 @@
import React from 'react';
import PropTypes from 'prop-types';
import COLORS from 'config/colors';
import ICONS from 'config/icons';
import { colors as COLORS, icons as ICONS } from 'trezor-ui-components';
import styled from 'styled-components';
import type { TrezorDevice } from 'flowtype';

13
src/components/modals/confirm/Address/index.js
View File

@ -3,14 +3,11 @@
import React from 'react';
import PropTypes from 'prop-types';
import styled from 'styled-components';
import colors from 'config/colors';
import { FONT_SIZE } from 'config/variables';
import { H3 } from 'components/Heading';
import P from 'components/Paragraph';
import { FormattedMessage } from 'react-intl';
import { H6, P, colors } from 'trezor-ui-components';
import { FONT_SIZE } from 'config/variables';
import l10nCommonMessages from 'views/common.messages';
import l10nMessages from './index.messages';
@ -43,9 +40,9 @@ const ConfirmAddress = (props: Props) => {
return (
<Wrapper>
<Header>
<H3>
<H6>
<FormattedMessage {...l10nMessages.TR_CONFIRM_ADDRESS_ON_TREZOR} />
</H3>
</H6>
<P>
<FormattedMessage {...l10nMessages.TR_PLEASE_COMPARE_YOUR_ADDRESS} />
</P>

11
src/components/modals/confirm/SignTx/index.js
View File

@ -4,12 +4,10 @@ import React from 'react';
import PropTypes from 'prop-types';
import styled from 'styled-components';
import colors from 'config/colors';
import { H5, P, colors } from 'trezor-ui-components';
import { LINE_HEIGHT, FONT_SIZE, FONT_WEIGHT } from 'config/variables';
import P from 'components/Paragraph';
import DeviceIcon from 'components/images/DeviceIcon';
import { H3 } from 'components/Heading';
import { FormattedMessage } from 'react-intl';
import type { TrezorDevice, State } from 'flowtype';
@ -37,6 +35,7 @@ const Content = styled.div`
const StyledP = styled(P)`
padding-bottom: 20px;
text-align: center;
color: ${colors.TEXT};
font-size: ${FONT_SIZE.BASE};
&:last-child {
@ -72,13 +71,13 @@ const ConfirmSignTx = (props: Props) => {
<Wrapper>
<Header>
<DeviceIcon device={props.device} size={60} color={colors.TEXT_SECONDARY} />
<H3>
<H5>
<FormattedMessage
{...l10nMessages.TR_CONFIRM_TRANSACTION_ON}
values={{ deviceLabel: props.device.label }}
/>
</H3>
<P isSmaller>
</H5>
<P textAlign="center" size="small">
<FormattedMessage {...l10nMessages.TR_DETAILS_ARE_SHOWN_ON} />
</P>
</Header>

9
src/components/modals/passphrase/Type/index.js
View File

@ -4,11 +4,8 @@ import React from 'react';
import PropTypes from 'prop-types';
import styled from 'styled-components';
import colors from 'config/colors';
import { H5, P, colors } from 'trezor-ui-components';
import DeviceIcon from 'components/images/DeviceIcon';
import { H3 } from 'components/Heading';
import P from 'components/Paragraph';
import type { TrezorDevice } from 'flowtype';
@ -27,8 +24,8 @@ const PassphraseType = (props: Props) => (
<Wrapper>
<Header>
<DeviceIcon device={props.device} size={60} color={colors.TEXT_SECONDARY} />
<H3>Complete the action on {props.device.label} device</H3>
<P isSmaller>
<H5>Complete the action on {props.device.label} device</H5>
<P size="small">
If you enter a wrong passphrase, you will not unlock the desired hidden wallet.
</P>
</Header>

5
src/components/notifications/Context/components/Action/components/NotificationsGroups/components/Group/index.js
View File

@ -1,10 +1,7 @@
import React, { PureComponent } from 'react';
import PropTypes from 'prop-types';
import styled from 'styled-components';
import Icon from 'components/Icon';
import ICONS from 'config/icons';
import colors from 'config/colors';
import Notification from 'components/Notification';
import { colors, Notification, Icon, icons as ICONS } from 'trezor-ui-components';
import { getIcon, getPrimaryColor } from 'utils/notification';
const Wrapper = styled.div``;

2
src/config/animations.js
View File

@ -1,5 +1,5 @@
import { keyframes } from 'styled-components';
import colors from 'config/colors';
import { colors } from 'trezor-ui-components';
export const ROTATE_180_UP = keyframes`
from {

2
src/support/styles/Tooltip.js
View File

@ -1,5 +1,5 @@
import { css } from 'styled-components';
import colors from 'config/colors';
import { colors } from 'trezor-ui-components';
import { FONT_SIZE, LINE_HEIGHT } from 'config/variables';
const tooltipStyles = css`

2
src/support/styles/index.js
View File

@ -1,5 +1,5 @@
import { createGlobalStyle } from 'styled-components';
import colors from 'config/colors';
import { colors } from 'trezor-ui-components';
import { FONT_WEIGHT } from 'config/variables';
import tooltipStyles from './Tooltip';

2
src/utils/device.js
View File

@ -1,6 +1,6 @@
/* @flow */
import colors from 'config/colors';
import { colors } from 'trezor-ui-components';
import type { Device } from 'trezor-connect';
import type { TrezorDevice, State } from 'flowtype';

3
src/utils/notification.js
View File

@ -1,5 +1,4 @@
import colors from 'config/colors';
import icons from 'config/icons';
import { colors, icons } from 'trezor-ui-components';
const getPrimaryColor = type => {
let color;

3
src/views/Landing/components/LandingWrapper/index.js
View File

@ -5,9 +5,8 @@ import styled from 'styled-components';
import Header from 'components/Header';
import Footer from 'components/Footer';
import Log from 'components/Log';
import Loader from 'components/Loader';
import ContextNotifications from 'components/notifications/Context';
import colors from 'config/colors';
import { colors, Loader } from 'trezor-ui-components';
import InitializationError from '../InitializationError';

3
src/views/Wallet/components/Content/components/FirmwareUnsupported/index.js
View File

@ -1,9 +1,8 @@
/* @flow */
import React from 'react';
import styled from 'styled-components';
import colors from 'config/colors';
import { H4, P, Button, Link } from 'trezor-ui-components';
import { H4, P, Button, Link, colors } from 'trezor-ui-components';
import CoinLogo from 'components/images/CoinLogo';
import { FormattedMessage } from 'react-intl';

14
src/views/Wallet/components/Content/index.js
View File

@ -1,18 +1,14 @@
/* @flow */
import * as React from 'react';
import PropTypes from 'prop-types';
import styled from 'styled-components';
import Loader from 'components/Loader';
import PropTypes from 'prop-types';
import { FormattedMessage } from 'react-intl';
import { P, H4, Loader, colors } from 'trezor-ui-components';
import { FONT_SIZE, FONT_WEIGHT, SCREEN_SIZE } from 'config/variables';
import { H1 } from 'components/Heading';
import P from 'components/Paragraph';
import colors from 'config/colors';
import type { State } from 'flowtype';
import FirmwareUpdate from 'views/Wallet/views/FirmwareUpdate';
import { FormattedMessage } from 'react-intl';
import type { State } from 'flowtype';
import FirmwareUnsupported from './components/FirmwareUnsupported';
import l10nMessages from './index.messages';
@ -43,7 +39,7 @@ const Loading = styled.div`
flex-direction: column;
`;
const Title = styled(H1)`
const Title = styled(H4)`
font-size: ${FONT_SIZE.BIGGER};
font-weight: ${FONT_WEIGHT.NORMAL};
color: ${props => (props.type === 'progress' ? colors.TEXT_SECONDARY : '')};

12
src/views/Wallet/components/LeftNavigation/components/AccountMenu/index.js
View File

@ -1,18 +1,14 @@
/* @flow */
import React from 'react';
import BigNumber from 'bignumber.js';
import Icon from 'components/Icon';
import colors from 'config/colors';
import Loader from 'components/Loader';
import styled, { css } from 'styled-components';
import * as stateUtils from 'reducers/utils';
import Tooltip from 'components/Tooltip';
import ICONS from 'config/icons';
import { NavLink } from 'react-router-dom';
import { FormattedMessage, FormattedNumber } from 'react-intl';
import { toFiatCurrency } from 'utils/fiatConverter';
import { NavLink } from 'react-router-dom';
import * as stateUtils from 'reducers/utils';
import { findDeviceAccounts } from 'reducers/AccountsReducer';
import { Icon, Loader, Tooltip, icons as ICONS, colors } from 'trezor-ui-components';
import { FONT_SIZE, BORDER_WIDTH, LEFT_NAVIGATION_ROW } from 'config/variables';
import type { Accounts } from 'flowtype';

4
src/views/Wallet/components/LeftNavigation/components/DeviceMenu/components/DeviceList/index.js
View File

@ -2,11 +2,9 @@
import React, { PureComponent } from 'react';
import styled from 'styled-components';
import Icon from 'components/Icon';
import DeviceHeader from 'components/DeviceHeader';
import * as deviceUtils from 'utils/device';
import icons from 'config/icons';
import colors from 'config/colors';
import { Icon, colors, icons } from 'trezor-ui-components';
import type { TrezorDevice } from 'flowtype';
import type { Props as CommonProps } from '../../../common';

2
src/views/Wallet/components/LeftNavigation/components/Divider/index.js
View File

@ -2,7 +2,7 @@ import styled, { css } from 'styled-components';
import React from 'react';
import PropTypes from 'prop-types';
import colors from 'config/colors';
import { colors } from 'trezor-ui-components';
import { FONT_SIZE, FONT_WEIGHT } from 'config/variables';
const Wrapper = styled.div`

3
src/views/Wallet/components/LeftNavigation/components/RowCoin/index.js
View File

@ -1,10 +1,9 @@
import React from 'react';
import PropTypes from 'prop-types';
import styled from 'styled-components';
import Icon from 'components/Icon';
import CoinLogo from 'components/images/CoinLogo';
import { FONT_SIZE, LEFT_NAVIGATION_ROW } from 'config/variables';
import colors from 'config/colors';
import { Icon, colors } from 'trezor-ui-components';
import Row from '../Row';
const CoinNameWrapper = styled.div`

2
src/views/Wallet/components/LeftNavigation/components/Sidebar/index.js
View File

@ -2,7 +2,7 @@
import * as React from 'react';
import styled from 'styled-components';
import colors from 'config/colors';
import { colors } from 'trezor-ui-components';
import { SCREEN_SIZE } from 'config/variables';
import { SLIDE_RIGHT, SLIDE_LEFT } from 'config/animations';

2
src/views/Wallet/components/Title/index.js
View File

@ -1,7 +1,7 @@
import React from 'react';
import PropTypes from 'prop-types';
import styled from 'styled-components';
import colors from 'config/colors';
import { colors } from 'trezor-ui-components';
import { FONT_SIZE, FONT_WEIGHT } from 'config/variables';
const Wrapper = styled.div`

2
src/views/Wallet/components/TopNavigationAccount/components/Indicator/index.js
View File

@ -1,7 +1,7 @@
/* @flow */
import styled, { css } from 'styled-components';
import colors from 'config/colors';
import { colors } from 'trezor-ui-components';
import React, { PureComponent } from 'react';
type Props = {

2
src/views/Wallet/components/TopNavigationAccount/index.js
View File

@ -5,7 +5,7 @@ import React from 'react';
import { FONT_SIZE, FONT_WEIGHT, SCREEN_SIZE } from 'config/variables';
import { NavLink } from 'react-router-dom';
import { connect } from 'react-redux';
import colors from 'config/colors';
import { colors } from 'trezor-ui-components';
import type { State } from 'flowtype';
import { FormattedMessage } from 'react-intl';

2
src/views/Wallet/components/TopNavigationWalletSettings/index.js
View File

@ -5,7 +5,7 @@ import { getPattern } from 'support/routes';
import { NavLink } from 'react-router-dom';
import colors from 'config/colors';
import { colors } from 'trezor-ui-components';
import { FormattedMessage } from 'react-intl';
import l10nCommonMessages from 'views/common.messages';

2
src/views/Wallet/index.js
View File

@ -1,7 +1,7 @@
/* @flow */
import * as React from 'react';
import colors from 'config/colors';
import { colors } from 'trezor-ui-components';
import styled, { css } from 'styled-components';
import { connect } from 'react-redux';
import { Route, withRouter } from 'react-router-dom';

5
src/views/Wallet/views/Account/Send/components/PendingTransactions/index.js
View File

@ -1,8 +1,7 @@
/* @flow */
import React from 'react';
import styled from 'styled-components';
import colors from 'config/colors';
import { H2 } from 'components/Heading';
import { colors, H5 } from 'trezor-ui-components';
import Transaction from 'components/Transaction';
import type { Network } from 'reducers/LocalStorageReducer';
@ -25,7 +24,7 @@ const PendingTransactions = (props: Props) => {
return (
<Wrapper>
<H2>Pending transactions</H2>
<H5>Pending transactions</H5>
{pending.map(tx => (
<Transaction key={tx.hash} network={props.network} tx={tx} />
))}

3
src/views/Wallet/views/Account/SignVerify/index.js
View File

@ -1,10 +1,9 @@
/* @flow */
import React, { Component } from 'react';
import styled from 'styled-components';
import { Input, TextArea, Button } from 'trezor-ui-components';
import { Input, TextArea, Button, colors } from 'trezor-ui-components';
import Title from 'views/Wallet/components/Title';
import Content from 'views/Wallet/components/Content';
import colors from 'config/colors';
import { SCREEN_SIZE } from 'config/variables';
import { FormattedMessage } from 'react-intl';