diff --git a/app/src/component/searchResultItem/view.js b/app/src/component/searchResultItem/view.js index fbe7013..414e528 100644 --- a/app/src/component/searchResultItem/view.js +++ b/app/src/component/searchResultItem/view.js @@ -3,6 +3,7 @@ import { normalizeURI, parseURI } from 'lbry-redux'; import { ActivityIndicator, Text, TouchableOpacity, View } from 'react-native'; import Colors from '../../styles/colors'; import FileItemMedia from '../fileItemMedia'; +import Link from '../../component/link'; import NsfwOverlay from '../../component/nsfwOverlay'; import searchStyle from '../../styles/search'; @@ -33,13 +34,11 @@ class SearchResultItem extends React.PureComponent { return ( - - - + {isResolvingUri && ( @@ -49,7 +48,11 @@ class SearchResultItem extends React.PureComponent { )} {!isResolvingUri && {title || name}} - {!isResolvingUri && channel && {channel}} + {!isResolvingUri && channel && + { + const channelUri = normalizeURI(channel); + navigation.navigate({ routeName: 'File', key: channelUri, params: { uri: channelUri }}); + }} />} {obscureNsfw && navigation.navigate({ routeName: 'Settings', key: 'settingsPage' })} />} diff --git a/app/src/styles/fileItemMedia.js b/app/src/styles/fileItemMedia.js index 2c50d2c..c379f3b 100644 --- a/app/src/styles/fileItemMedia.js +++ b/app/src/styles/fileItemMedia.js @@ -1,14 +1,12 @@ import { StyleSheet, Dimensions } from 'react-native'; -const screenDimension = Dimensions.get('window'); -const width = screenDimension.width - 48; // screen width minus combined left and right margins - const fileItemMediaStyle = StyleSheet.create({ autothumb: { flex: 1, width: '100%', height: 200, - justifyContent: 'center' + justifyContent: 'center', + alignItems: 'center' }, autothumbText: { fontFamily: 'Metropolis-SemiBold', diff --git a/app/src/styles/search.js b/app/src/styles/search.js index 898b81f..f7357d3 100644 --- a/app/src/styles/search.js +++ b/app/src/styles/search.js @@ -1,4 +1,11 @@ -import { StyleSheet } from 'react-native'; +import { Dimensions, StyleSheet } from 'react-native'; +import Colors from './colors'; + +const screenDimension = Dimensions.get('window'); +const screenWidth = screenDimension.width; +const screenHeight = screenDimension.height; +const thumbnailHeight = 100; +const thumbnailWidth = (screenHeight / screenWidth) * thumbnailHeight; const searchStyle = StyleSheet.create({ container: { @@ -24,14 +31,13 @@ const searchStyle = StyleSheet.create({ marginTop: 16 }, thumbnail: { - width: '100%', - height: 72 - }, - thumbnailContainer: { - width: '40%' + width: thumbnailWidth, + height: thumbnailHeight, + marginRight: 16, + justifyContent: 'center' }, detailsContainer: { - width: '55%' + flex: 1 }, searchInput: { width: '100%', @@ -41,7 +47,7 @@ const searchStyle = StyleSheet.create({ }, title: { fontFamily: 'Metropolis-SemiBold', - fontSize: 14 + fontSize: 16 }, uri: { fontFamily: 'Metropolis-SemiBold', @@ -50,9 +56,9 @@ const searchStyle = StyleSheet.create({ }, publisher: { fontFamily: 'Metropolis-SemiBold', - fontSize: 12, + fontSize: 14, marginTop: 3, - color: '#c0c0c0' + color: Colors.LbryGreen }, noResultsText: { textAlign: 'center',