Style changes to use config-colors and AppButtons

1 files changed, 25 insertions, 60 deletions

diff --git a/app/components/SupportStyles.js b/app/components/SupportStyles.js
index f0b0df5c18..fce2594783 100644
--- a/app/components/SupportStyles.js
+++ b/app/components/SupportStyles.js
@@ -1,14 +1,16 @@
 import { createViewStyles, createTextStyles } from '../lib/styles';
+import { colors } from '../config';
 
 export default Object.assign(createViewStyles({
   support:{
-    backgroundColor: '#192E45',
+    backgroundColor: colors.darkBlue,
     height: '100%',
   },
   support__container:{
     display: 'flex',
     flexDirection: 'column',
     height: '100%',
+    paddingBottom: 24,
   },
   support__header:{
     flex: 0,
@@ -16,10 +18,10 @@ export default Object.assign(createViewStyles({
     paddingBottom: 12,
     paddingLeft: 24,
     paddingRight: 24,
-    overflow: 'visible',
-    position: 'relative' /* anchor for close button */
   },
   support__close:{
+    paddingLeft: 12,
+    paddingTop: 24,
     flexDirection: 'row',
     alignItems: 'center',
     justifyContent: 'flex-start',
@@ -75,71 +77,43 @@ export default Object.assign(createViewStyles({
     flex: 0,
   },
   support__form_view_logs:{
-    backgroundColor: 'rgba(41,71,115,1)',
-    color: 'rgba(255,255,255,0.8)',
-    paddingTop: 7,
-    paddingLeft: 12,
-    paddingRight: 12,
-    paddingBottom: 9,
-    borderRadius: 4,
-    justifyContent: 'space-between',
-    alignItems: 'center',
-    flexDirection: 'row',
-    flex: 1,
+    backgroundColor: colors.blue,
+    color: colors.white80,
   },
   support__form_edit_logs:{
-    backgroundColor: 'rgba(41,71,115,1)',
-    color: 'rgba(255,255,255,0.8)',
-    paddingTop: 7,
-    paddingLeft: 12,
-    paddingRight: 12,
-    paddingBottom: 9,
-    borderRadius: 4,
-    justifyContent: 'center',
-    alignItems: 'center',
-    flexDirection: 'row',
-    flex: 1,
+    backgroundColor: colors.blue,
+    color: colors.white80,
   },
   support__form_send:{
-    backgroundColor: 'rgba(63,173,77,1)',
-    color: 'rgba(255,255,255,0.8)',
-    paddingTop: 7,
-    paddingLeft: 12,
-    paddingRight: 12,
-    paddingBottom: 9,
-    borderRadius: 4,
+    backgroundColor: 'rgba(63,173,77,0.8)',
     marginTop: 16,
-    justifyContent: 'space-between',
-    alignItems: 'center',
-    flex: 1,
+  },
+  support__form_send_hover:{
+    backgroundColor: colors.green,
   },
   support__status_icon:{
     textAlign: 'center',
     marginBottom: 32,
   },
   support__open_icon:{
-    color: 'rgba(255,255,255,0.8)',
+    color: colors.white80,
     marginLeft: 8,
     width: 16,
     height: 16,
-    flexGrow: 0,
-    flexShrink: 0,
-    flexBasis: 'auto',
-    alignItems: 'flex-end',
   },
 }), createTextStyles({
   support__close_title:{
     fontFamily: 'Open Sans',
     fontSize: 13,
     fontWeight: '600',
-    color: 'rgba(255, 255, 255, 0.6)',
+    color: colors.white60,
   },
   support__title:{
     fontFamily: 'DINPro',
     fontSize: 32,
     fontWeight: '900',
     lineHeight: 40,
-    color: '#FFFFFF',
+    color: colors.white,
     marginBottom: 16,
   },
   support__subtitle:{
@@ -147,7 +121,7 @@ export default Object.assign(createViewStyles({
     fontSize: 13,
     fontWeight: '600',
     overflow: 'visible',
-    color: 'rgba(255,255,255,0.8)',
+    color: colors.white80,
     lineHeight: 20,
     letterSpacing: -0.2,
   },
@@ -163,8 +137,8 @@ export default Object.assign(createViewStyles({
     fontSize: 13,
     fontWeight: '600',
     lineHeight: 26,
-    color: '#294D73',
-    backgroundColor: '#fff',
+    color: colors.blue,
+    backgroundColor: colors.white,
   },
   support__form_message:{
     paddingTop: 10,
@@ -174,13 +148,13 @@ export default Object.assign(createViewStyles({
     fontFamily: 'Open Sans',
     fontSize: 13,
     fontWeight: '600',
-    color: '#294D73',
-    backgroundColor: '#fff',
+    color: colors.blue,
+    backgroundColor: colors.white,
     flex: 1,
   },
   support__sent_email:{
     fontWeight: '900',
-    color: 'white',
+    color: colors.white,
   },
   support__status_security__secure:{
     fontFamily: 'Open Sans',
@@ -188,7 +162,7 @@ export default Object.assign(createViewStyles({
     fontWeight: '800',
     lineHeight: 22,
     marginBottom: 4,
-    color: '#44AD4D',
+    color: colors.green,
   },
   support__send_status:{
     fontFamily: 'DINPro',
@@ -197,22 +171,13 @@ export default Object.assign(createViewStyles({
     maxHeight: 'calc(1.16em * 2)',
     overflow: 'visible',
     letterSpacing: -0.9,
-    color: '#FFFFFF',
+    color: colors.white,
     marginBottom: 4,
   },
-  support__button_label:{
-    fontFamily: 'DINPro',
-    fontSize: 20,
-    fontWeight: '900',
-    lineHeight: 26,
-    justifyContent: 'center',
-    alignItems: 'center',
-  },
   support__no_email_warning: {
     fontFamily: 'Open Sans',
     fontSize: 13,
     lineHeight: 16,
-
-    color: 'rgba(255,255,255,0.8)',
+    color: colors.white80,
   },
 }));