verdnatura-mirror/Rocket.Chat.ReactNative
verdnatura-mirror
/
Rocket.Chat.ReactNative
mirror of https://github.com/RocketChat/Rocket.Chat.ReactNative
2
0
Fork 1
Code Issues Packages Projects Releases Wiki Activity

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:
Gleidson Daniel Silva 2024-04-25 17:19:02 -03:00 committed by GitHub
parent 7c448222e1
commit 3918b56a82
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
9 changed files with 20 additions and 19 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

6
__tests__/containers/message/__snapshots__/Message.stories.storyshot
View File

File diff suppressed because one or more lines are too long

2
app/containers/ImageViewer/ImageViewer.tsx
View File

@ -114,7 +114,7 @@ export const ImageViewer = ({ uri = '', imageComponentType, width, height, ...pr
const { colors } = useTheme(); const { colors } = useTheme();
return ( return (
<View style={[styles.flex, { width, height, backgroundColor: colors.surfaceRoom }]}> <View style={[styles.flex, { width, height, backgroundColor: colors.surfaceNeutral }]}>
<GestureDetector gesture={gesture}> <GestureDetector gesture={gesture}>
<Animated.View onLayout={onLayout} style={[styles.flex, style]}> <Animated.View onLayout={onLayout} style={[styles.flex, style]}>
<Component <Component

4
app/containers/UIKit/VideoConferenceBlock/components/styles.ts
View File

@ -6,7 +6,7 @@ import sharedStyles from '../../../../views/Styles';
export default function useStyle() { export default function useStyle() {
const { colors } = useTheme(); const { colors } = useTheme();
const style = StyleSheet.create({ 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' }, callInfoContainer: { flex: 1, alignItems: 'center', paddingLeft: 16, flexDirection: 'row' },
infoContainerText: { infoContainerText: {
fontSize: 12, fontSize: 12,
@ -23,7 +23,7 @@ export default function useStyle() {
}, },
callToActionContainer: { callToActionContainer: {
height: 48, height: 48,
backgroundColor: colors.surfaceHover, backgroundColor: colors.surfaceNeutral,
flexDirection: 'row', flexDirection: 'row',
alignItems: 'center', alignItems: 'center',
paddingLeft: 16 paddingLeft: 16

2
app/containers/message/Components/OverlayComponent/index.tsx
View File

@ -19,7 +19,7 @@ const OverlayComponent = ({
return ( return (
<> <>
<View style={[style, styles.blurView, { backgroundColor: colors.surfaceDark }]} /> <View style={[style, styles.blurView, { backgroundColor: colors.surfaceNeutral }]} />
<View style={[style, styles.blurIndicator]}> <View style={[style, styles.blurIndicator]}>
{loading ? <RCActivityIndicator size={54} /> : <CustomIcon name={iconName} size={54} />} {loading ? <RCActivityIndicator size={54} /> : <CustomIcon name={iconName} size={54} />}
</View> </View>

3
app/containers/message/styles.ts
View File

@ -103,7 +103,8 @@ export default StyleSheet.create({
minHeight: isTablet ? 300 : 200, minHeight: isTablet ? 300 : 200,
borderRadius: 4, borderRadius: 4,
borderWidth: 1, borderWidth: 1,
overflow: 'hidden' overflow: 'hidden',
borderColor: 'rgba(0, 0, 0, 0.1)'
}, },
imageBlurContainer: { imageBlurContainer: {
height: '100%' height: '100%'

8
app/views/AttachmentView.tsx
View File

@ -121,20 +121,20 @@ const AttachmentView = (): React.ReactElement => {
const options: StackNavigationOptions = { const options: StackNavigationOptions = {
title: title || '', title: title || '',
headerTitleAlign: 'center', headerTitleAlign: 'center',
headerTitleStyle: { color: colors.surfaceTint }, headerTitleStyle: { color: colors.fontDefault },
headerTintColor: colors.surfaceTint, headerTintColor: colors.surfaceTint,
headerTitleContainerStyle: { flex: 1, maxWidth: undefined }, headerTitleContainerStyle: { flex: 1, maxWidth: undefined },
headerLeftContainerStyle: { flexGrow: undefined, flexBasis: undefined }, headerLeftContainerStyle: { flexGrow: undefined, flexBasis: undefined },
headerRightContainerStyle: { flexGrow: undefined, flexBasis: undefined }, headerRightContainerStyle: { flexGrow: undefined, flexBasis: undefined },
headerLeft: () => ( headerLeft: () => (
<HeaderButton.CloseModal testID='close-attachment-view' navigation={navigation} color={colors.surfaceTint} /> <HeaderButton.CloseModal testID='close-attachment-view' navigation={navigation} color={colors.fontDefault} />
), ),
headerRight: () => headerRight: () =>
Allow_Save_Media_to_Gallery && !isImageBase64(attachment.image_url) ? ( 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, ) : null,
headerBackground: () => ( headerBackground: () => (
<HeaderBackground style={{ backgroundColor: colors.surfaceDark, shadowOpacity: 0, elevation: 0 }} /> <HeaderBackground style={{ backgroundColor: colors.surfaceNeutral, shadowOpacity: 0, elevation: 0 }} />
) )
}; };
navigation.setOptions(options); navigation.setOptions(options);

2
app/views/ShareView/Header.tsx
View File

@ -68,7 +68,7 @@ const Header = React.memo(({ room, thread }: IHeader) => {
icon = 'channel-private'; icon = 'channel-private';
} }
const textColor = themes[theme].surfaceTint; const textColor = themes[theme].fontDefault;
let title; let title;
if (thread?.id) { if (thread?.id) {

2
app/views/ShareView/Preview.tsx
View File

@ -48,7 +48,7 @@ interface IIconPreview {
const IconPreview = React.memo(({ iconName, title, description, theme, width, height, danger }: IIconPreview) => ( const IconPreview = React.memo(({ iconName, title, description, theme, width, height, danger }: IIconPreview) => (
<ScrollView <ScrollView
style={{ backgroundColor: themes[theme].surfaceRoom }} style={{ backgroundColor: themes[theme].surfaceNeutral }}
contentContainerStyle={[styles.fileContainer, { width, height }]} contentContainerStyle={[styles.fileContainer, { width, height }]}
> >
<CustomIcon name={iconName} size={56} color={danger ? themes[theme].buttonBackgroundDangerDefault : themes[theme].badgeBackgroundLevel2} /> <CustomIcon name={iconName} size={56} color={danger ? themes[theme].buttonBackgroundDangerDefault : themes[theme].badgeBackgroundLevel2} />

10
app/views/ShareView/index.tsx
View File

@ -121,25 +121,25 @@ class ShareView extends Component<IShareViewProps, IShareViewState> {
const options: StackNavigationOptions = { const options: StackNavigationOptions = {
headerTitle: () => <Header room={room} thread={thread} />, headerTitle: () => <Header room={room} thread={thread} />,
headerTitleAlign: 'left', headerTitleAlign: 'left',
headerTintColor: themes[theme].surfaceTint headerTintColor: themes[theme].backdropColor
}; };
// if is share extension show default back button // if is share extension show default back button
if (!this.isShareExtension) { if (!this.isShareExtension) {
options.headerLeft = () => ( 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) { if (!attachments.length && !readOnly) {
options.headerRight = () => ( options.headerRight = () => (
<HeaderButton.Container> <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> </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); navigation.setOptions(options);
}; };
@ -405,7 +405,7 @@ class ShareView extends Component<IShareViewProps, IShareViewState> {
); );
} }
return ( return (
<SafeAreaView style={{ backgroundColor: themes[theme].surfaceRoom }}> <SafeAreaView style={{ backgroundColor: themes[theme].backdropColor, flex: 1 }}>
<StatusBar barStyle='light-content' backgroundColor={themes[theme].surfaceDark} /> <StatusBar barStyle='light-content' backgroundColor={themes[theme].surfaceDark} />
{this.renderContent()} {this.renderContent()}
</SafeAreaView> </SafeAreaView>