diff --git a/src/components/coin-divider/CoinDividerEditButton.js b/src/components/coin-divider/CoinDividerEditButton.js
index e5d07b3c4f0..4a1833b3549 100644
--- a/src/components/coin-divider/CoinDividerEditButton.js
+++ b/src/components/coin-divider/CoinDividerEditButton.js
@@ -1,5 +1,5 @@
import React, { useCallback } from 'react';
-import { LayoutAnimation } from 'react-native';
+import { LayoutAnimation, StyleSheet } from 'react-native';
import { useTheme } from '../../theme/ThemeContext';
import { magicMemo } from '../../utils';
import { ButtonPressAnimation, OpacityToggler } from '../animations';
@@ -7,6 +7,7 @@ import { Row } from '../layout';
import { Text } from '../text';
import styled from '@/styled-thing';
import { padding, shadow } from '@/styles';
+import { IS_ANDROID } from '@/env';
const ButtonContent = styled(Row).attrs({
justify: 'center',
@@ -39,6 +40,7 @@ const CoinDividerEditButton = ({ isActive, isVisible, onPress, shouldReloadList,
opacity={textOpacityAlwaysOn || isActive ? 1 : 0.3333333333}
size="lmedium"
weight="bold"
+ style={sx.text}
>
{text}
@@ -48,4 +50,10 @@ const CoinDividerEditButton = ({ isActive, isVisible, onPress, shouldReloadList,
);
};
+const sx = StyleSheet.create({
+ text: {
+ marginTop: IS_ANDROID ? -4 : 0,
+ },
+});
+
export default magicMemo(CoinDividerEditButton, ['isActive', 'isVisible', 'text']);
diff --git a/src/components/coin-divider/CoinDividerOpenButton.js b/src/components/coin-divider/CoinDividerOpenButton.js
index 9c079004ce9..c818dc22b9b 100644
--- a/src/components/coin-divider/CoinDividerOpenButton.js
+++ b/src/components/coin-divider/CoinDividerOpenButton.js
@@ -53,7 +53,7 @@ const CoinDividerEditButton = ({ isSmallBalancesOpen, onPress }) => {
opacity: 0.6,
transform: [
{ translateX: 0 + animation.value * 5 },
- { translateY: (IS_ANDROID ? 4 : 0) + animation.value * 1.25 },
+ { translateY: (IS_ANDROID ? (!animation.value ? 2.5 : 4) : 0) + animation.value * 1.25 },
{ rotate: animation.value * -90 + 'deg' },
],
};
@@ -74,6 +74,7 @@ const CoinDividerEditButton = ({ isSmallBalancesOpen, onPress }) => {
opacity={1}
size="lmedium"
weight="bold"
+ style={{ marginTop: IS_ANDROID ? -4 : 0 }}
>
{isSmallBalancesOpen ? i18n.t(i18n.l.button.less) : i18n.t(i18n.l.button.all)}
diff --git a/src/components/coin-row/CollectiblesSendRow.tsx b/src/components/coin-row/CollectiblesSendRow.tsx
index 4f87045430d..294fd818d0f 100644
--- a/src/components/coin-row/CollectiblesSendRow.tsx
+++ b/src/components/coin-row/CollectiblesSendRow.tsx
@@ -1,5 +1,5 @@
import React, { Fragment, useMemo } from 'react';
-import { PressableProps, TouchableWithoutFeedback } from 'react-native';
+import { PressableProps, TouchableWithoutFeedback, StyleSheet } from 'react-native';
import { buildAssetUniqueIdentifier } from '../../helpers/assets';
import { useTheme } from '../../theme/ThemeContext';
import { deviceUtils, getUniqueTokenType, magicMemo } from '../../utils';
@@ -33,6 +33,7 @@ const BottomRow = ({ selected, subtitle }: { selected: boolean; subtitle: string
letterSpacing="roundedMedium"
size="smedium"
weight={selected ? 'bold' : 'regular'}
+ style={sx.bottomRow}
>
{subtitle}
@@ -137,6 +138,12 @@ const CollectiblesSendRow = React.memo(
(props, nextProps) => buildAssetUniqueIdentifier(props.item) !== buildAssetUniqueIdentifier(nextProps.item)
);
+const sx = StyleSheet.create({
+ bottomRow: {
+ marginTop: ios ? 0 : -6,
+ },
+});
+
CollectiblesSendRow.displayName = 'CollectiblesSendRow';
// @ts-expect-error
CollectiblesSendRow.dividerHeight = dividerHeight;
diff --git a/src/components/coin-row/SendCoinRow.js b/src/components/coin-row/SendCoinRow.js
index dd2a3543c60..15e2067aa86 100644
--- a/src/components/coin-row/SendCoinRow.js
+++ b/src/components/coin-row/SendCoinRow.js
@@ -1,5 +1,5 @@
import React from 'react';
-import { TouchableWithoutFeedback } from 'react-native';
+import { StyleSheet, TouchableWithoutFeedback } from 'react-native';
import LinearGradient from 'react-native-linear-gradient';
import { useTheme } from '../../theme/ThemeContext';
import { deviceUtils } from '../../utils';
@@ -49,6 +49,7 @@ const BottomRow = ({ balance, native, nativeCurrencySymbol, selected, showNative
numberOfLines={1}
size="smedium"
weight={selected ? 'bold' : 'regular'}
+ style={sx.bottomRow}
>
{showNativeValue
? `${fiatValue} available`
@@ -133,7 +134,7 @@ const SendCoinRow = ({
children
) : (
- {fiatValueFormatted}
+ {fiatValueFormatted}
)}
@@ -141,6 +142,15 @@ const SendCoinRow = ({
);
};
+const sx = StyleSheet.create({
+ nativeAmountBubbleText: {
+ marginTop: android ? -2.5 : 0,
+ },
+ bottomRow: {
+ marginTop: android ? -6 : 0,
+ },
+});
+
SendCoinRow.displayName = 'SendCoinRow';
SendCoinRow.selectedHeight = selectedHeight;
diff --git a/src/components/contacts/ContactRow.js b/src/components/contacts/ContactRow.js
index e52b5f8251e..a0a44097f35 100644
--- a/src/components/contacts/ContactRow.js
+++ b/src/components/contacts/ContactRow.js
@@ -16,6 +16,7 @@ import styled from '@/styled-thing';
import { margin } from '@/styles';
import { addressHashedColorIndex, addressHashedEmoji } from '@/utils/profileUtils';
import * as i18n from '@/languages';
+import { StyleSheet } from 'react-native';
const ContactAddress = styled(TruncatedAddress).attrs(({ theme: { colors }, lite }) => ({
align: 'left',
@@ -44,7 +45,7 @@ const ContactName = styled(TruncatedText).attrs(({ lite }) => ({
size: 'lmedium',
weight: lite ? 'regular' : 'medium',
}))({
- height: 22,
+ height: ios ? 22 : 26,
width: ({ deviceWidth }) => deviceWidth - 90,
});
@@ -53,6 +54,12 @@ const css = {
symmetrical: margin.object(9.5, 19),
};
+const sx = StyleSheet.create({
+ bottomRowText: {
+ marginTop: ios ? 0 : -4.5,
+ },
+});
+
const ContactRow = ({ address, color, nickname, symmetricalMargins, ...props }, ref) => {
const profilesEnabled = useExperimentalFlag(PROFILES);
const { width: deviceWidth } = useDimensions();
@@ -132,7 +139,12 @@ const ContactRow = ({ address, color, nickname, symmetricalMargins, ...props },
{isValidDomainFormat(address) ? address : abbreviations.address(address, 4, 6)}
)}
-
+
{balanceText}