LBRYCommunity/lbry-react-native
1
0
Fork 0
Code Issues Pull requests 12 Packages Projects Releases Wiki Activity

Floating balance icon (#23)

Browse source 
* use coins icon for floating balance
This commit is contained in:
Akinwale Ariwodola 2019-08-15 19:15:41 +01:00 committed by GitHub
parent e443a0fdbb
commit 84fe0f69d5
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
2 changed files with 20 additions and 13 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

5
src/component/floatingWalletBalance/view.js
View file

@ -23,7 +23,7 @@ class FloatingWalletBalance extends React.PureComponent<Props> {
style={floatingButtonStyle.pendingContainer}
onPress={() => navigation && navigation.navigate({ routeName: 'Rewards' })}
>
<Icon name="award" size={18} style={floatingButtonStyle.rewardIcon} />
<Icon name="award" size={14} style={floatingButtonStyle.rewardIcon} />
<Text style={floatingButtonStyle.text}>{unclaimedRewardAmount}</Text>
</TouchableOpacity>
)}
@ -31,9 +31,10 @@ class FloatingWalletBalance extends React.PureComponent<Props> {
style={floatingButtonStyle.container}
onPress={() => navigation && navigation.navigate({ routeName: 'WalletStack' })}
>
<Icon name="coins" size={12} style={floatingButtonStyle.balanceIcon} />
{isNaN(balance) && <ActivityIndicator size="small" color={Colors.White} />}
{(!isNaN(balance) || balance === 0) && (
<Text style={floatingButtonStyle.text}>{formatCredits(parseFloat(balance), 2) + ' LBC'}</Text>
<Text style={floatingButtonStyle.text}>{formatCredits(parseFloat(balance), 0)}</Text>
)}
</TouchableOpacity>
</View>

28
src/styles/floatingButton.js
View file

@ -13,13 +13,14 @@ const floatingButtonStyle = StyleSheet.create({
container: {
zIndex: 100,
borderRadius: 24,
padding: 14,
paddingLeft: 20,
paddingRight: 20,
padding: 10,
paddingLeft: 16,
paddingRight: 16,
alignItems: 'center',
justifyContent: 'center',
flexDirection: 'row',
backgroundColor: Colors.LbryGreen,
shadowColor: 'black',
shadowColor: Colors.Black,
shadowOpacity: 0.1,
shadowRadius: StyleSheet.hairlineWidth,
shadowOffset: {
@ -29,10 +30,10 @@ const floatingButtonStyle = StyleSheet.create({
},
pendingContainer: {
borderRadius: 24,
padding: 14,
paddingLeft: 20,
paddingRight: 70,
marginRight: -60,
padding: 10,
paddingLeft: 12,
paddingRight: 58,
marginRight: -52,
alignItems: 'center',
justifyContent: 'center',
backgroundColor: Colors.BrighterLbryGreen,
@ -41,8 +42,8 @@ const floatingButtonStyle = StyleSheet.create({
},
text: {
color: Colors.White,
fontFamily: 'Inter-UI-Bold',
fontSize: 18,
fontFamily: 'Inter-UI-SemiBold',
fontSize: 16,
},
bottomRight: {
right: 10,
@ -50,7 +51,12 @@ const floatingButtonStyle = StyleSheet.create({
},
rewardIcon: {
color: Colors.White,
marginRight: 4,
marginRight: 3,
},
balanceIcon: {
color: Colors.White,
marginRight: 3,
marginTop: -1,
},
});