colors

Author: alexeuler

Diff for: mobile/ReactNativeTutorial/.eslintrc.yml

@@ -37,6 +37,7 @@
     react-native/no-unused-styles: 2
     react-native/split-platform-components: 2
     react-native/no-inline-styles: 2
+    react-native/no-color-literals: 2
 
     react/jsx-filename-extension:
       - 1

Diff for: mobile/ReactNativeTutorial/app/bundles/comments/components/Add/AddStyle.js

@@ -1,8 +1,9 @@
 import { StyleSheet } from 'react-native';
+import * as colors from 'ReactNativeTutorial/app/styles/colors';
 
 const styles = StyleSheet.create({
   button: {
-    backgroundColor: '#4641B5',
+    backgroundColor: colors.ACTION_BUTTON,
     marginTop: 20,
   },
 });

Diff for: mobile/ReactNativeTutorial/app/bundles/comments/components/Index/Footer/FooterStyle.js

@@ -1,13 +1,14 @@
 import { StyleSheet } from 'react-native';
+import * as colors from 'ReactNativeTutorial/app/styles/colors';
 
 const styles = StyleSheet.create({
   container: {
     height: 70,
-    backgroundColor: '#EFEFF2',
+    backgroundColor: colors.TABBAR_BACKGROUND,
     alignItems: 'center',
     justifyContent: 'center',
     borderTopWidth: 1,
-    borderTopColor: '#D2D2D2',
+    borderTopColor: colors.BORDER,
   },
 });
 

Diff for: mobile/ReactNativeTutorial/app/bundles/comments/components/Index/List/Item/ItemStyle.js

@@ -1,12 +1,13 @@
 import { StyleSheet } from 'react-native';
+import * as colors from 'ReactNativeTutorial/app/styles/colors';
 
 const styles = StyleSheet.create({
   container: {
     minHeight: 80,
     marginVertical: 10,
     marginHorizontal: 20,
-    backgroundColor: '#F0F0F0',
-    shadowColor: '#000000',
+    backgroundColor: colors.ITEM_BACKGROUND,
+    shadowColor: colors.SHADOW,
     shadowRadius: 11,
     shadowOpacity: 0.25,
     shadowOffset: {
@@ -23,7 +24,7 @@ const styles = StyleSheet.create({
   body: {
     marginHorizontal: 10,
     marginBottom: 10,
-    color: '#555555',
+    color: colors.BODY_TEXT,
   },
 });
 

Diff for: mobile/ReactNativeTutorial/app/setup/Router/RouterStyle.js

@@ -1,8 +1,9 @@
 import { StyleSheet } from 'react-native';
+import * as colors from 'ReactNativeTutorial/app/styles/colors';
 
 const styles = StyleSheet.create({
   container: {
-    backgroundColor: '#F7F7F7',
+    backgroundColor: colors.BACKGROUND,
     paddingTop: 66,
   },
 });

Diff for: mobile/ReactNativeTutorial/app/styles/colors.js

@@ -0,0 +1,8 @@
+export const SHADOW = '#000000';
+export const BORDER = '#D2D2D2';
+export const ITEM_BACKGROUND = '#F0F0F0';
+export const BACKGROUND = '#F7F7F7';
+export const TABBAR_BACKGROUND = '#EFEFF2';
+export const HEADER_TEXT = '#000000';
+export const BODY_TEXT = '#555555';
+export const ACTION_BUTTON = '#4641B5';