mirrors/BlueWallet
1
0
Fork 0
mirror of https://github.com/BlueWallet/BlueWallet.git synced 2025-03-26 08:55:56 +01:00
Code Issues Projects Releases Packages Wiki Activity

Merge pull request #6412 from BlueWallet/buttonsn

Browse source 
REF: New button design
This commit is contained in:
GLaDOS 2024-04-15 20:27:15 +00:00 • committed by GitHub
commit 201ca049ee
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
1 changed files with 15 additions and 9 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

24
components/FloatButtons.tsx
View file

@ -4,8 +4,8 @@ import { useSafeAreaInsets } from 'react-native-safe-area-context';
import { useTheme } from './themes';
const BORDER_RADIUS = 30;
const PADDINGS = 8;
const BORDER_RADIUS = 8;
const PADDINGS = 24;
const ICON_MARGIN = 7;
const cStyles = StyleSheet.create({
@ -23,7 +23,6 @@ const cStyles = StyleSheet.create({
bottom: -1000,
},
rootPost: {
borderRadius: BORDER_RADIUS,
flexDirection: 'row',
overflow: 'hidden',
},
@ -136,6 +135,7 @@ export const FButton = ({ text, icon, width, first, last, ...props }: FButtonPro
const bStylesHook = StyleSheet.create({
root: {
backgroundColor: colors.buttonBackgroundColor,
borderRadius: BORDER_RADIUS,
},
text: {
color: colors.buttonAlternativeTextColor,
@ -143,19 +143,25 @@ export const FButton = ({ text, icon, width, first, last, ...props }: FButtonPro
textDisabled: {
color: colors.formBorder,
},
marginRight: {
marginRight: 10,
},
});
const style: Record<string, any> = {};
const additionalStyles = !last ? bStylesHook.marginRight : {};
if (width) {
const paddingLeft = first ? BORDER_RADIUS / 2 : PADDINGS;
const paddingRight = last ? BORDER_RADIUS / 2 : PADDINGS;
style.paddingRight = paddingRight;
style.paddingLeft = paddingLeft;
style.width = width + paddingRight + paddingLeft;
style.paddingHorizontal = PADDINGS;
style.width = width + PADDINGS * 2;
}
return (
<TouchableOpacity accessibilityLabel={text} accessibilityRole="button" style={[bStyles.root, bStylesHook.root, style]} {...props}>
<TouchableOpacity
accessibilityLabel={text}
accessibilityRole="button"
style={[bStyles.root, bStylesHook.root, style, additionalStyles]}
{...props}
>
<View style={bStyles.icon}>{icon}</View>
<Text numberOfLines={1} style={[bStyles.text, props.disabled ? bStylesHook.textDisabled : bStylesHook.text]}>
{text}