UI tune ups

zio/stable
Paul Frazee 2023-05-25 20:44:37 -05:00
parent 27ff9ce43b
commit 68332bc877
2 changed files with 12 additions and 19 deletions

View File

@ -6,6 +6,7 @@ import {RenderTabBarFnProps} from 'view/com/pager/Pager'
import {useStores} from 'state/index' import {useStores} from 'state/index'
import {usePalette} from 'lib/hooks/usePalette' import {usePalette} from 'lib/hooks/usePalette'
import {useAnimatedValue} from 'lib/hooks/useAnimatedValue' import {useAnimatedValue} from 'lib/hooks/useAnimatedValue'
import {useColorSchemeStyle} from 'lib/hooks/useColorSchemeStyle'
import {Link} from '../util/Link' import {Link} from '../util/Link'
import {Text} from '../util/text/Text' import {Text} from '../util/text/Text'
import {CogIcon} from 'lib/icons' import {CogIcon} from 'lib/icons'
@ -32,6 +33,8 @@ export const FeedsTabBar = observer(
transform: [{translateY: Animated.multiply(interp, -100)}], transform: [{translateY: Animated.multiply(interp, -100)}],
} }
const brandBlue = useColorSchemeStyle(s.brandBlue, s.blue3)
const onPressAvi = React.useCallback(() => { const onPressAvi = React.useCallback(() => {
store.shell.openDrawer() store.shell.openDrawer()
}, [store]) }, [store])
@ -59,9 +62,7 @@ export const FeedsTabBar = observer(
/> />
</TouchableOpacity> </TouchableOpacity>
</View> </View>
<Text type="title-lg" style={[s.brandBlue, s.bold]}> <Text style={[brandBlue, s.bold, styles.title]}>Bluesky</Text>
Bluesky
</Text>
<View style={[pal.view]}> <View style={[pal.view]}>
<Link <Link
href="/settings/saved-feeds" href="/settings/saved-feeds"
@ -104,4 +105,7 @@ const styles = StyleSheet.create({
paddingBottom: 2, paddingBottom: 2,
width: '100%', width: '100%',
}, },
title: {
fontSize: 21,
},
}) })

View File

@ -49,7 +49,6 @@ export const MultiFeed = observer(function Feed({
extraData?: any extraData?: any
}) { }) {
const pal = usePalette('default') const pal = usePalette('default')
const palInverted = usePalette('inverted')
const theme = useTheme() const theme = useTheme()
const {track} = useAnalytics() const {track} = useAnalytics()
const [isRefreshing, setIsRefreshing] = React.useState(false) const [isRefreshing, setIsRefreshing] = React.useState(false)
@ -130,15 +129,9 @@ export const MultiFeed = observer(function Feed({
) )
} else if (item.type === 'footer') { } else if (item.type === 'footer') {
return ( return (
<Link <Link style={[styles.footerLink, pal.viewLight]} href="/search/feeds">
style={[styles.footerLink, palInverted.view]} <FontAwesomeIcon icon="search" size={18} color={pal.colors.text} />
href="/search/feeds"> <Text type="xl-medium" style={pal.text}>
<FontAwesomeIcon
icon="search"
size={18}
color={palInverted.colors.text}
/>
<Text type="lg-medium" style={palInverted.text}>
Discover new feeds Discover new feeds
</Text> </Text>
</Link> </Link>
@ -146,7 +139,7 @@ export const MultiFeed = observer(function Feed({
} }
return null return null
}, },
[showPostFollowBtn, pal, palInverted], [showPostFollowBtn, pal],
) )
const FeedFooter = React.useCallback( const FeedFooter = React.useCallback(
@ -181,11 +174,7 @@ export const MultiFeed = observer(function Feed({
/> />
} }
contentContainerStyle={s.contentContainer} contentContainerStyle={s.contentContainer}
style={[ style={[{paddingTop: headerOffset}, pal.view, styles.container]}
{paddingTop: headerOffset},
isDesktopWeb ? pal.view : pal.viewLight,
styles.container,
]}
onScroll={onScroll} onScroll={onScroll}
scrollEventThrottle={scrollEventThrottle} scrollEventThrottle={scrollEventThrottle}
indicatorStyle={theme.colorScheme === 'dark' ? 'white' : 'black'} indicatorStyle={theme.colorScheme === 'dark' ? 'white' : 'black'}