Remove and fix CSS properties that are invalid in React Native

This commit is contained in:
Nat 2021-04-18 15:56:33 -03:00
parent b2f56a7fff
commit c0fb5913f4
11 changed files with 69 additions and 69 deletions

View File

@ -23,7 +23,8 @@ const BackBarJsx = (props) => {
const styles = {
nav: {
borderBottom: "2px solid #CCC",
borderBottomWidth: 1,
borderBottomColor: "#CCC",
backgroundColor: "white",
flexDirection: "row",

View File

@ -1,5 +1,8 @@
import React, { useState, useEffect } from "react";
import { Image } from "react-native";
import {
Image,
Dimensions,
} from "react-native";
import { checkUnreadNotifications } from "src/requests";
@ -101,25 +104,24 @@ const TrayJsx = (props) => {
const iconSize = 30;
const SCREEN_WIDTH = Dimensions.get("window").width;
const styles = {
tray: {
width: "100%",
width: SCREEN_WIDTH,
paddingTop: iconSize / 2,
paddingBottom: iconSize / 2,
borderTop: "2px solid #CCC",
borderTopWidth: 2,
borderTopColor: "#CCC",
backgroundColor: "white"
},
iconList: {
display: "flex",
flexDirection: "row",
justifyContent: "space-evenly",
alignItems: "center",
margin: 0,
paddingLeft: 0,
listStyle: "none",
},
icon: {
width: iconSize,

View File

@ -83,7 +83,6 @@ const DiscoverJsx = (props) => {
const SCREEN_WIDTH = Dimensions.get("window").width;
const styles = {
form: {
display: "flex",
justifyContent: "center",
backgroundColor: "white",
padding: 20

View File

@ -176,7 +176,7 @@ const styles = {
thumbnail: {
width: 50,
height: 50,
borderRadius: "100%",
borderRadius: 25,
marginRight: 10,
}
}

View File

@ -78,7 +78,7 @@ const styles = {
height: screen_width / 3,
borderWidth: 1,
borderColor: "#888",
borderRadius: "100%",
borderRadius: screen_width / 6,
marginRight: 20,
},
hashtag: {

View File

@ -79,13 +79,13 @@ const styles = {
height: screen_height - (screen_height / 12)
},
interruptionOuter: {
borderTop: "2px solid #CCC",
borderTopWidth: 1,
borderTopColor: "#CCC",
},
interruption: {
marginTop: 10,
marginBottom: 10,
flex: 1,
justifyContent: "center",
alignItems: "center",
},
@ -97,7 +97,8 @@ const styles = {
height: screen_width * 0.3
},
buttonOlder: {
border: "2px solid black",
borderWidth: 1,
borderColor: "#888",
borderRadius: 5,
margin: 30,

View File

@ -304,10 +304,9 @@ const styles = {
padding: screen_width / 20,
},
profileHeader: {
display: "flex",
flexDirection: "row",
alignItems: "center",
marginBottom: screen_width / 20
marginBottom: screen_width / 20,
},
displayName: {
fontSize: 24
@ -316,8 +315,8 @@ const styles = {
width: screen_width / 5,
height: screen_width / 5,
borderRadius: "100%",
marginRight: screen_width / 20
borderRadius: screen_width / 10,
marginRight: screen_width / 20,
},
profileHeaderIcon: {
width: screen_width / 12,
@ -325,7 +324,7 @@ const styles = {
},
profileContextContainer: {
marginLeft: "auto",
marginRight: screen_width / 15
marginRight: screen_width / 15,
},
accountStats: {
fontSize: 14,
@ -343,10 +342,10 @@ const styles = {
padding: 10
},
rowName: {
width: "33%",
width: screen_width / 3,
textAlign: "center"
},
rowValue: { width: "67%" },
rowValue: { width: (screen_width / 3) * 2 },
anchor: {
color: "#888",
textDecoration: "underline"
@ -354,7 +353,6 @@ const styles = {
button: {
borderWidth: 1,
borderStyle: "solid",
borderColor: "#888",
borderRadius: 5,

View File

@ -178,7 +178,7 @@ const CommentJsx = (props) => {
style = { styles.avatar } />
<View style = { styles.contentContainer }>
<Text style = { styles.content }>
<span style = { styles.bold }>{ props.data.username }</span>&nbsp;
<Text style = { styles.bold }>{ props.data.username }</Text>&nbsp;
{ props.data.content }
</Text>
<View style = { styles.commentActions }>
@ -229,37 +229,40 @@ const ViewCommentsJsx = (props) => {
<View style = { { flex: 1 } }>
<BackBarJsx navigation = { props.navigation }/>
<ScrollView>
<View style = { { display: state.loaded ? "block" : "none" } }>
<View style = { styles.parentPost }>
<CommentJsx
data = { state.postData } />
{ state.loaded
? <View>
<View style = { styles.parentPost }>
<CommentJsx
data = { state.postData } />
</View>
<View>
{
state.descendants.map((thread, i) => {
const comment = thread[0];
const subs = thread.slice(1);
return (
<View key = { i }>
<CommentJsx data = { comment }/>
{
subs.map((sub, j) => {
return (
<View
key = { j }
style = { styles.sub }>
<CommentJsx
data = { sub }/>
</View>
)
})
}
</View>
);
})
}
</View>
</View>
<View>
{
state.descendants.map((thread, i) => {
const comment = thread[0];
const subs = thread.slice(1);
return (
<View key = { i }>
<CommentJsx data = { comment }/>
{
subs.map((sub, j) => {
return (
<View
key = { j }
style = { styles.sub }>
<CommentJsx
data = { sub }/>
</View>
)
})
}
</View>
);
})
}
</View>
</View>
: <></>
}
</ScrollView>
<View style = { styles.commentForm }>
<Image
@ -292,7 +295,6 @@ const styles = {
fontWeight: "bold",
},
container: {
display: "flex",
flexDirection: "row",
flexShrink: 1,
marginTop: 10,
@ -304,7 +306,7 @@ const styles = {
marginRight: 20,
width: 50,
height: 50,
borderRadius: "100%"
borderRadius: 25,
},
contentContainer: {
flexShrink: 1
@ -312,24 +314,23 @@ const styles = {
parentPost: {
borderBottomWidth: 1,
borderBottomColor: "#CCC",
marginBottom: 10
marginBottom: 10,
},
sub: {
marginLeft: SCREEN_WIDTH / 8
marginLeft: SCREEN_WIDTH / 8,
},
commentActions: {
display: "flex",
flexDirection: "row",
alignItems: "center",
},
actionText: {
fontSize: 13,
color: "#666",
paddingRight: 10
paddingRight: 10,
},
heart: {
width: 15,
height: 15
height: 15,
},
commentForm: {
@ -341,17 +342,17 @@ const styles = {
borderTopColor: "#CCC",
paddingTop: 10,
paddingBottom: 10
paddingBottom: 10,
},
commentInput: {
borderWidth: 0,
padding: 10,
flexGrow: 3,
marginRight: 20
marginRight: 20,
},
submitContainer: {
marginLeft: "auto",
marginRight: 20
marginRight: 20,
},
commentSubmit: {
width: 30,

View File

@ -1,5 +1,9 @@
import React from "react";
import { View, Dimensions, Image } from "react-native";
import {
View,
Dimensions,
Image,
} from "react-native";
import GridPostJsx from "src/components/posts/grid-post";
@ -54,10 +58,6 @@ const styles = {
gridRow: {
padding: 0,
margin: 0,
listStyle: "none",
display: "flex",
flexDirection: "row"
}
};

View File

@ -77,7 +77,6 @@ const PagedGridJSX = (props) => {
const styles = {
buttonContainer: {
display: "flex",
justifyContent: "center",
alignItems: "center"
},

View File

@ -87,7 +87,6 @@ const PostActionBarJsx = (props) => {
const SCREEN_WIDTH = Dimensions.get("window").width;
const styles = {
flexContainer: {
display: "flex",
flexDirection: "row",
padding: SCREEN_WIDTH / 40
},