fix: ShareView and loading of image/videos colors (#5664)
* chore: change shareview and loading image/videos colors * test: update snapshot * fix: change header color * chore: improve videoconf base color
This commit is contained in:
parent
7c448222e1
commit
3918b56a82
File diff suppressed because one or more lines are too long
|
@ -114,7 +114,7 @@ export const ImageViewer = ({ uri = '', imageComponentType, width, height, ...pr
|
|||
const { colors } = useTheme();
|
||||
|
||||
return (
|
||||
<View style={[styles.flex, { width, height, backgroundColor: colors.surfaceRoom }]}>
|
||||
<View style={[styles.flex, { width, height, backgroundColor: colors.surfaceNeutral }]}>
|
||||
<GestureDetector gesture={gesture}>
|
||||
<Animated.View onLayout={onLayout} style={[styles.flex, style]}>
|
||||
<Component
|
||||
|
|
|
@ -6,7 +6,7 @@ import sharedStyles from '../../../../views/Styles';
|
|||
export default function useStyle() {
|
||||
const { colors } = useTheme();
|
||||
const style = StyleSheet.create({
|
||||
container: { height: 108, flex: 1, borderWidth: 1, borderRadius: 4, marginTop: 8, borderColor: colors.surfaceHover },
|
||||
container: { height: 108, flex: 1, borderWidth: 1, borderRadius: 4, marginTop: 8, borderColor: colors.surfaceNeutral },
|
||||
callInfoContainer: { flex: 1, alignItems: 'center', paddingLeft: 16, flexDirection: 'row' },
|
||||
infoContainerText: {
|
||||
fontSize: 12,
|
||||
|
@ -23,7 +23,7 @@ export default function useStyle() {
|
|||
},
|
||||
callToActionContainer: {
|
||||
height: 48,
|
||||
backgroundColor: colors.surfaceHover,
|
||||
backgroundColor: colors.surfaceNeutral,
|
||||
flexDirection: 'row',
|
||||
alignItems: 'center',
|
||||
paddingLeft: 16
|
||||
|
|
|
@ -19,7 +19,7 @@ const OverlayComponent = ({
|
|||
|
||||
return (
|
||||
<>
|
||||
<View style={[style, styles.blurView, { backgroundColor: colors.surfaceDark }]} />
|
||||
<View style={[style, styles.blurView, { backgroundColor: colors.surfaceNeutral }]} />
|
||||
<View style={[style, styles.blurIndicator]}>
|
||||
{loading ? <RCActivityIndicator size={54} /> : <CustomIcon name={iconName} size={54} />}
|
||||
</View>
|
||||
|
|
|
@ -103,7 +103,8 @@ export default StyleSheet.create({
|
|||
minHeight: isTablet ? 300 : 200,
|
||||
borderRadius: 4,
|
||||
borderWidth: 1,
|
||||
overflow: 'hidden'
|
||||
overflow: 'hidden',
|
||||
borderColor: 'rgba(0, 0, 0, 0.1)'
|
||||
},
|
||||
imageBlurContainer: {
|
||||
height: '100%'
|
||||
|
|
|
@ -121,20 +121,20 @@ const AttachmentView = (): React.ReactElement => {
|
|||
const options: StackNavigationOptions = {
|
||||
title: title || '',
|
||||
headerTitleAlign: 'center',
|
||||
headerTitleStyle: { color: colors.surfaceTint },
|
||||
headerTitleStyle: { color: colors.fontDefault },
|
||||
headerTintColor: colors.surfaceTint,
|
||||
headerTitleContainerStyle: { flex: 1, maxWidth: undefined },
|
||||
headerLeftContainerStyle: { flexGrow: undefined, flexBasis: undefined },
|
||||
headerRightContainerStyle: { flexGrow: undefined, flexBasis: undefined },
|
||||
headerLeft: () => (
|
||||
<HeaderButton.CloseModal testID='close-attachment-view' navigation={navigation} color={colors.surfaceTint} />
|
||||
<HeaderButton.CloseModal testID='close-attachment-view' navigation={navigation} color={colors.fontDefault} />
|
||||
),
|
||||
headerRight: () =>
|
||||
Allow_Save_Media_to_Gallery && !isImageBase64(attachment.image_url) ? (
|
||||
<HeaderButton.Download testID='save-image' onPress={handleSave} color={colors.surfaceTint} />
|
||||
<HeaderButton.Download testID='save-image' onPress={handleSave} color={colors.fontDefault} />
|
||||
) : null,
|
||||
headerBackground: () => (
|
||||
<HeaderBackground style={{ backgroundColor: colors.surfaceDark, shadowOpacity: 0, elevation: 0 }} />
|
||||
<HeaderBackground style={{ backgroundColor: colors.surfaceNeutral, shadowOpacity: 0, elevation: 0 }} />
|
||||
)
|
||||
};
|
||||
navigation.setOptions(options);
|
||||
|
|
|
@ -68,7 +68,7 @@ const Header = React.memo(({ room, thread }: IHeader) => {
|
|||
icon = 'channel-private';
|
||||
}
|
||||
|
||||
const textColor = themes[theme].surfaceTint;
|
||||
const textColor = themes[theme].fontDefault;
|
||||
|
||||
let title;
|
||||
if (thread?.id) {
|
||||
|
|
|
@ -48,7 +48,7 @@ interface IIconPreview {
|
|||
|
||||
const IconPreview = React.memo(({ iconName, title, description, theme, width, height, danger }: IIconPreview) => (
|
||||
<ScrollView
|
||||
style={{ backgroundColor: themes[theme].surfaceRoom }}
|
||||
style={{ backgroundColor: themes[theme].surfaceNeutral }}
|
||||
contentContainerStyle={[styles.fileContainer, { width, height }]}
|
||||
>
|
||||
<CustomIcon name={iconName} size={56} color={danger ? themes[theme].buttonBackgroundDangerDefault : themes[theme].badgeBackgroundLevel2} />
|
||||
|
|
|
@ -121,25 +121,25 @@ class ShareView extends Component<IShareViewProps, IShareViewState> {
|
|||
const options: StackNavigationOptions = {
|
||||
headerTitle: () => <Header room={room} thread={thread} />,
|
||||
headerTitleAlign: 'left',
|
||||
headerTintColor: themes[theme].surfaceTint
|
||||
headerTintColor: themes[theme].backdropColor
|
||||
};
|
||||
|
||||
// if is share extension show default back button
|
||||
if (!this.isShareExtension) {
|
||||
options.headerLeft = () => (
|
||||
<HeaderButton.CloseModal navigation={navigation} color={themes[theme].surfaceTint} testID='share-view-close' />
|
||||
<HeaderButton.CloseModal navigation={navigation} color={themes[theme].fontDefault} testID='share-view-close' />
|
||||
);
|
||||
}
|
||||
|
||||
if (!attachments.length && !readOnly) {
|
||||
options.headerRight = () => (
|
||||
<HeaderButton.Container>
|
||||
<HeaderButton.Item title={I18n.t('Send')} onPress={this.send} color={themes[theme].surfaceTint} />
|
||||
<HeaderButton.Item title={I18n.t('Send')} onPress={this.send} color={themes[theme].fontDefault} />
|
||||
</HeaderButton.Container>
|
||||
);
|
||||
}
|
||||
|
||||
options.headerBackground = () => <View style={[styles.container, { backgroundColor: themes[theme].surfaceDark }]} />;
|
||||
options.headerBackground = () => <View style={[styles.container, { backgroundColor: themes[theme].surfaceNeutral }]} />;
|
||||
|
||||
navigation.setOptions(options);
|
||||
};
|
||||
|
@ -405,7 +405,7 @@ class ShareView extends Component<IShareViewProps, IShareViewState> {
|
|||
);
|
||||
}
|
||||
return (
|
||||
<SafeAreaView style={{ backgroundColor: themes[theme].surfaceRoom }}>
|
||||
<SafeAreaView style={{ backgroundColor: themes[theme].backdropColor, flex: 1 }}>
|
||||
<StatusBar barStyle='light-content' backgroundColor={themes[theme].surfaceDark} />
|
||||
{this.renderContent()}
|
||||
</SafeAreaView>
|
||||
|
|
Loading…
Reference in New Issue