diff options
author | John Fawcett <jrf0110@gmail.com> | 2023-04-12 20:27:55 -0500 |
---|---|---|
committer | GitHub <noreply@github.com> | 2023-04-12 18:27:55 -0700 |
commit | f6769b283fe83d7abbc0545077b3dca978184eed (patch) | |
tree | fab3973591fd0514d290de18f37280baca5563f9 /src/view/com/util/FAB.tsx | |
parent | 2fed6c402159c6084dd481ab87c5e8b034e910ac (diff) | |
download | voidsky-f6769b283fe83d7abbc0545077b3dca978184eed.tar.zst |
Mobile Web (#427)
* WIP * WIP * Fix header offset on web * Remove debug * Fix web mobile feed and FAB layout * Fix modals on mobile web * Remove dead code * Remove ios config that shouldnt be committed now * Move bottom bar into its own folder * Fix web drawer navigation and state behaviors * Remove dark mode toggle from web drawer for now * Fix search on mobile web * Fix the logged out splash screen on mobile web * Fixes to detox simulator --------- Co-authored-by: Paul Frazee <pfrazee@gmail.com>
Diffstat (limited to 'src/view/com/util/FAB.tsx')
-rw-r--r-- | src/view/com/util/FAB.tsx | 71 |
1 files changed, 0 insertions, 71 deletions
diff --git a/src/view/com/util/FAB.tsx b/src/view/com/util/FAB.tsx deleted file mode 100644 index 3427d368e..000000000 --- a/src/view/com/util/FAB.tsx +++ /dev/null @@ -1,71 +0,0 @@ -import React from 'react' -import {observer} from 'mobx-react-lite' -import { - Animated, - GestureResponderEvent, - StyleSheet, - TouchableWithoutFeedback, -} from 'react-native' -import LinearGradient from 'react-native-linear-gradient' -import {gradients} from 'lib/styles' -import {useAnimatedValue} from 'lib/hooks/useAnimatedValue' -import {useStores} from 'state/index' - -type OnPress = ((event: GestureResponderEvent) => void) | undefined -export const FAB = observer( - ({ - testID, - icon, - onPress, - }: { - testID?: string - icon: JSX.Element - onPress: OnPress - }) => { - const store = useStores() - const interp = useAnimatedValue(0) - React.useEffect(() => { - Animated.timing(interp, { - toValue: store.shell.minimalShellMode ? 1 : 0, - duration: 100, - useNativeDriver: true, - isInteraction: false, - }).start() - }, [interp, store.shell.minimalShellMode]) - const transform = { - transform: [{translateY: Animated.multiply(interp, 60)}], - } - return ( - <TouchableWithoutFeedback testID={testID} onPress={onPress}> - <Animated.View style={[styles.outer, transform]}> - <LinearGradient - colors={[gradients.blueLight.start, gradients.blueLight.end]} - start={{x: 0, y: 0}} - end={{x: 1, y: 1}} - style={styles.inner}> - {icon} - </LinearGradient> - </Animated.View> - </TouchableWithoutFeedback> - ) - }, -) - -const styles = StyleSheet.create({ - outer: { - position: 'absolute', - zIndex: 1, - right: 28, - bottom: 94, - width: 60, - height: 60, - borderRadius: 30, - }, - inner: { - width: 60, - height: 60, - borderRadius: 30, - justifyContent: 'center', - alignItems: 'center', - }, -}) |