fix channel thumbnail container render. style tweaks for smaller screens.

This commit is contained in:
Akinwale Ariwodola 2020-01-10 00:37:51 +01:00
parent 6bf2f9460d
commit bfc3b11035
3 changed files with 17 additions and 12 deletions

View file

@ -1,7 +1,7 @@
import React from 'react';
import { normalizeURI, parseURI } from 'lbry-redux';
import { ActivityIndicator, Platform, Text, TouchableOpacity, View } from 'react-native';
import { navigateToUri, formatTitle, getDownloadProgress, getStorageForFileInfo } from 'utils/helper';
import { navigateToUri, getDownloadProgress, getStorageForFileInfo } from 'utils/helper';
import Colors from 'styles/colors';
import ChannelIconItem from 'component/channelIconItem';
import channelIconStyle from 'styles/channelIcon';
@ -116,7 +116,9 @@ class ClaimResultItem extends React.PureComponent {
<View style={fileListStyle.detailsContainer}>
{(title || name) && (
<View style={fileListStyle.titleContainer}>
<Text style={fileListStyle.title}>{formatTitle(title) || formatTitle(name)}</Text>
<Text style={fileListStyle.title} numberOfLines={3}>
{title || name}
</Text>
{isRewardContent && <Icon style={fileListStyle.rewardIcon} name="award" size={12} />}
</View>
)}

View file

@ -1,7 +1,7 @@
import React from 'react';
import { normalizeURI, parseURI } from 'lbry-redux';
import { ActivityIndicator, Platform, Text, TouchableOpacity, View } from 'react-native';
import { navigateToUri, formatTitle, getDownloadProgress, getStorageForFileInfo } from 'utils/helper';
import { navigateToUri, getDownloadProgress, getStorageForFileInfo } from 'utils/helper';
import Colors from 'styles/colors';
import ChannelIconItem from 'component/channelIconItem';
import channelIconStyle from 'styles/channelIcon';
@ -151,7 +151,7 @@ class FileListItem extends React.PureComponent {
)}
{isChannel && (
<View style={fileListStyle.thumbnail}>
<View style={fileListStyle.channelThumbnailView}>
<View style={[fileListStyle.channelThumbnailContainer, this.state.autoStyle]}>
{hasThumbnail && (
<FastImage
@ -209,8 +209,11 @@ class FileListItem extends React.PureComponent {
{(title || name) && (
<View style={fileListStyle.titleContainer}>
<Text style={featuredResult ? fileListStyle.featuredTitle : fileListStyle.title}>
{formatTitle(title) || formatTitle(name)}
<Text
style={featuredResult ? fileListStyle.featuredTitle : fileListStyle.title}
numberOfLines={hideChannel ? 4 : 3}
>
{title || name}
</Text>
{isRewardContent && <Icon style={fileListStyle.rewardIcon} name="award" size={12} />}
</View>

View file

@ -28,7 +28,7 @@ const fileListStyle = StyleSheet.create({
},
featuredTitle: {
fontFamily: 'Inter-SemiBold',
fontSize: screenWidthPixels <= 720 ? 12 : 16,
fontSize: screenWidthPixels <= 720 ? 11 : 16,
color: Colors.White,
},
thumbnail: {
@ -70,16 +70,16 @@ const fileListStyle = StyleSheet.create({
},
title: {
fontFamily: 'Inter-SemiBold',
fontSize: screenWidthPixels <= 720 ? 12 : 14,
fontSize: screenWidthPixels <= 720 ? 11 : 14,
},
uri: {
fontFamily: 'Inter-SemiBold',
fontSize: screenWidthPixels <= 720 ? 12 : 14,
fontSize: screenWidthPixels <= 720 ? 11 : 14,
marginBottom: 8,
},
publisher: {
fontFamily: 'Inter-SemiBold',
fontSize: screenWidthPixels <= 720 ? 11 : 12,
fontSize: screenWidthPixels <= 720 ? 10 : 12,
marginTop: screenWidthPixels <= 720 ? 1 : 3,
color: Colors.LbryGreen,
},
@ -96,14 +96,14 @@ const fileListStyle = StyleSheet.create({
},
infoText: {
fontFamily: 'Inter-Regular',
fontSize: screenWidthPixels <= 720 ? 11 : 12,
fontSize: screenWidthPixels <= 720 ? 10 : 12,
color: Colors.ChannelGrey,
},
downloadInfo: {
marginTop: 2,
},
progress: {
marginTop: screenWidthPixels <= 720 ? 2 : 4,
marginTop: screenWidthPixels <= 720 ? 1 : 4,
},
progressCompleted: {
backgroundColor: Colors.LbryGreen,