Update TweetBig.js

moving styles out of constructor

Author: davidLeonardi

twitter-example/components/TweetBig.js

@@ -5,71 +5,6 @@ const propTypes = {
 };
 
 class TweetBig extends React.Component {
-  constructor(props) {
-    super(props);
-    this.styles = StyleSheet.create({
-      retweetContainer: {
-        margin: 10,
-        paddingTop: 8,
-        flexDirection: 'row',
-        borderTopWidth: 1,
-        borderColor: '#DAE6F0',
-      },
-      rtBold: {
-        fontSize: 14,
-        marginRight: 3,
-        fontWeight: '600',
-      },
-      rtText: {
-        fontSize: 14,
-        fontWeight: '400',
-        color: '#748999',
-      },
-
-      tweetContainer: {
-        backgroundColor: 'white',
-        borderBottomWidth: 1,
-        borderColor: '#DAE6F0',
-        paddingTop: 4,
-      },
-      avatar: {
-        backgroundColor: 'gray',
-        width: 50,
-        height: 50,
-        marginLeft: 10,
-        borderRadius: 4,
-      },
-      userContainer: {
-        flexDirection: 'row',
-        alignItems: 'center',
-        flex: 1,
-      },
-      textContainer: {
-        flex: 1,
-        padding: 10,
-        flexDirection: 'column',
-      },
-      username: {
-        fontSize: 13,
-        color: '#8999a5',
-        marginTop: 2,
-      },
-      name: {
-        fontWeight: '600',
-        fontSize: 15,
-      },
-      text: {
-        marginTop: 5,
-        fontSize: 17,
-        fontWeight: '300',
-      },
-      rightContainer: {
-        flex: 1,
-        padding: 10,
-      },
-    });
-  }
-
   render() {
     const {
       text,
@@ -99,6 +34,67 @@ class TweetBig extends React.Component {
   }
 }
 
+const styles = StyleSheet.create({
+  retweetContainer: {
+    margin: 10,
+    paddingTop: 8,
+    flexDirection: 'row',
+    borderTopWidth: 1,
+    borderColor: '#DAE6F0',
+  },
+  rtBold: {
+    fontSize: 14,
+    marginRight: 3,
+    fontWeight: '600',
+  },
+  rtText: {
+    fontSize: 14,
+    fontWeight: '400',
+    color: '#748999',
+  },
+    tweetContainer: {
+    backgroundColor: 'white',
+    borderBottomWidth: 1,
+    borderColor: '#DAE6F0',
+    paddingTop: 4,
+  },
+    avatar: {
+    backgroundColor: 'gray',
+    width: 50,
+    height: 50,
+    marginLeft: 10,
+    borderRadius: 4,
+  },
+  userContainer: {
+    flexDirection: 'row',
+    alignItems: 'center',
+    flex: 1,
+  },
+  textContainer: {
+    flex: 1,
+    padding: 10,
+    flexDirection: 'column',
+  },
+  username: {
+    fontSize: 13,
+    color: '#8999a5',
+    marginTop: 2,
+  },
+  name: {
+    fontWeight: '600',
+    fontSize: 15,
+  },
+  text: {
+    marginTop: 5,
+    fontSize: 17,
+    fontWeight: '300',
+  },
+  rightContainer: {
+    flex: 1,
+    padding: 10,
+  },
+});
+
 TweetBig.propTypes = propTypes;
 
 export default TweetBig;