diff options
author | Paul Frazee <pfrazee@gmail.com> | 2023-03-14 13:03:43 -0500 |
---|---|---|
committer | Paul Frazee <pfrazee@gmail.com> | 2023-03-14 13:03:43 -0500 |
commit | acf0f80de2a7a96ad8ee58dbf6aa8cb59859c9e8 (patch) | |
tree | ea84f4665976b847ea7d32190324f47c1e0b414f /src/view/com/auth/util/HelpTip.tsx | |
parent | d55780f5c333208eaac1d5240929959b131e8787 (diff) | |
download | voidsky-acf0f80de2a7a96ad8ee58dbf6aa8cb59859c9e8.tar.zst |
Rework account creation and login views
Diffstat (limited to 'src/view/com/auth/util/HelpTip.tsx')
-rw-r--r-- | src/view/com/auth/util/HelpTip.tsx | 32 |
1 files changed, 32 insertions, 0 deletions
diff --git a/src/view/com/auth/util/HelpTip.tsx b/src/view/com/auth/util/HelpTip.tsx new file mode 100644 index 000000000..3ea4437df --- /dev/null +++ b/src/view/com/auth/util/HelpTip.tsx @@ -0,0 +1,32 @@ +import React from 'react' +import {StyleSheet, View} from 'react-native' +import {Text} from 'view/com/util/text/Text' +import {InfoCircleIcon} from 'lib/icons' +import {s, colors} from 'lib/styles' +import {useColorSchemeStyle} from 'lib/hooks/useColorSchemeStyle' + +export function HelpTip({text}: {text: string}) { + const bg = useColorSchemeStyle( + {backgroundColor: colors.gray1}, + {backgroundColor: colors.gray8}, + ) + const fg = useColorSchemeStyle({color: colors.gray5}, {color: colors.gray4}) + return ( + <View style={[styles.helptip, bg]}> + <InfoCircleIcon size={18} style={fg} strokeWidth={1.5} /> + <Text type="xs-medium" style={[fg, s.ml5]}> + {text} + </Text> + </View> + ) +} + +const styles = StyleSheet.create({ + helptip: { + flexDirection: 'row', + alignItems: 'center', + borderRadius: 6, + paddingHorizontal: 10, + paddingVertical: 8, + }, +}) |