Fixed wallet design issues

This commit is contained in:
Mustafa Buyukcelebi 2019-01-24 00:07:43 +03:00
parent e28f3cd33b
commit a1bb2072e5
4 changed files with 19 additions and 9 deletions

View File

@ -21,9 +21,10 @@ const WalletLineItem = ({
text, text,
textColor, textColor,
index, index,
style,
}) => ( }) => (
<GrayWrapper isGray={index % 2 === 0}> <GrayWrapper isGray={index && index % 2 !== 0}>
<View style={[styles.container, fitContent && styles.fitContent]}> <View style={[styles.container, fitContent && styles.fitContent, style]}>
<View style={styles.iconTextWrapper}> <View style={styles.iconTextWrapper}>
{iconName && ( {iconName && (
<View <View

View File

@ -8,7 +8,7 @@ import { groomingTransactionData } from '../../../utils/wallet';
import { getTimeFromNow } from '../../../utils/time'; import { getTimeFromNow } from '../../../utils/time';
// Components // Components
// import { FilterBar } from '../../filterBar'; import { FilterBar } from '../../filterBar';
import { WalletLineItem, Card } from '../../basicUIElements'; import { WalletLineItem, Card } from '../../basicUIElements';
import { CollapsibleCard } from '../../collapsibleCard'; import { CollapsibleCard } from '../../collapsibleCard';
@ -39,15 +39,14 @@ class TransactionView extends PureComponent {
return ( return (
<Fragment> <Fragment>
{/* this feature not implemented yet */} {/* this feature not implemented yet */}
{/* <FilterBar <FilterBar
dropdownIconName="arrow-drop-down" dropdownIconName="arrow-drop-down"
options={['ALL TRANSACTIONS', 'VOTES', 'REPLIES']} options={['ALL TRANSACTIONS', 'VOTES', 'REPLIES']}
defaultText="ALL TRANSACTIONS" defaultText="ALL TRANSACTIONS"
onDropdownSelect={() => this._handleOnDropdownSelect()} onDropdownSelect={() => this._handleOnDropdownSelect()}
rightIconName="ios-lock" rightIconName="ios-lock"
iconSize={16} iconSize={16}
if (index % 2 === 0) { />
/> */}
<Card> <Card>
{transactions {transactions
&& transactions.map((item, index) => { && transactions.map((item, index) => {

View File

@ -7,4 +7,8 @@ export default EStyleSheet.create({
blackText: { blackText: {
color: '$primaryBlack', color: '$primaryBlack',
}, },
walletLineDetail: {
marginBottom: 15,
marginTop: 0,
},
}); });

View File

@ -39,7 +39,7 @@ class WalletDetailsView extends PureComponent {
rightText={`${Math.round(walletData.balance * 1000) / 1000} STEEM`} rightText={`${Math.round(walletData.balance * 1000) / 1000} STEEM`}
isBoldText isBoldText
/> />
<GrayWrapper> <GrayWrapper isGray>
<WalletLineItem <WalletLineItem
text={intl.formatMessage({ text={intl.formatMessage({
id: 'profile.steem_power', id: 'profile.steem_power',
@ -57,6 +57,7 @@ class WalletDetailsView extends PureComponent {
rightText={`- ${Math.round( rightText={`- ${Math.round(
vestsToSp(walletData.vestingSharesDelegated, walletData.steemPerMVests) * 1000, vestsToSp(walletData.vestingSharesDelegated, walletData.steemPerMVests) * 1000,
) / 1000} SP`} ) / 1000} SP`}
style={styles.walletLineDetail}
/> />
)} )}
{walletData.vestingSharesReceived > 0 && ( {walletData.vestingSharesReceived > 0 && (
@ -64,6 +65,7 @@ class WalletDetailsView extends PureComponent {
rightText={`+ ${Math.round( rightText={`+ ${Math.round(
vestsToSp(walletData.vestingSharesReceived, walletData.steemPerMVests) * 1000, vestsToSp(walletData.vestingSharesReceived, walletData.steemPerMVests) * 1000,
) / 1000} SP`} ) / 1000} SP`}
style={styles.walletLineDetail}
/> />
)} )}
{(walletData.vestingSharesDelegated > 0 || walletData.vestingSharesReceived > 0) && ( {(walletData.vestingSharesDelegated > 0 || walletData.vestingSharesReceived > 0) && (
@ -72,6 +74,7 @@ class WalletDetailsView extends PureComponent {
vestsToSp(walletData.vestingSharesTotal, walletData.steemPerMVests) * 1000, vestsToSp(walletData.vestingSharesTotal, walletData.steemPerMVests) * 1000,
) / 1000} SP`} ) / 1000} SP`}
rightTextColor="#357ce6" rightTextColor="#357ce6"
style={styles.walletLineDetail}
/> />
)} )}
</GrayWrapper> </GrayWrapper>
@ -85,7 +88,7 @@ class WalletDetailsView extends PureComponent {
rightText={`$${Math.round(walletData.sbdBalance * 1000) / 1000}`} rightText={`$${Math.round(walletData.sbdBalance * 1000) / 1000}`}
isBoldText isBoldText
/> />
<GrayWrapper> <GrayWrapper isGray>
<WalletLineItem <WalletLineItem
text={intl.formatMessage({ text={intl.formatMessage({
id: 'profile.savings', id: 'profile.savings',
@ -95,7 +98,10 @@ class WalletDetailsView extends PureComponent {
rightText={`${Math.round(walletData.savingBalance * 1000) / 1000} STEEM`} rightText={`${Math.round(walletData.savingBalance * 1000) / 1000} STEEM`}
isBoldText isBoldText
/> />
<WalletLineItem rightText={`$${Math.round(walletData.savingBalanceSbd * 1000) / 1000}`} /> <WalletLineItem
rightText={`$${Math.round(walletData.savingBalanceSbd * 1000) / 1000}`}
style={styles.walletLineDetail}
/>
</GrayWrapper> </GrayWrapper>
{walletData.showPowerDown && ( {walletData.showPowerDown && (
<WalletLineItem <WalletLineItem