From 2381c0e0f461304265279155176fa655e2eb97b4 Mon Sep 17 00:00:00 2001
From: Alexander Tseung <alextsg@gmail.com>
Date: Thu, 10 May 2018 16:51:26 -0700
Subject: Add new unlock screen design

---
 .../components/text-field/text-field.component.js  | 54 ++++++++++++++++++++++
 1 file changed, 54 insertions(+)
 create mode 100644 ui/app/components/text-field/text-field.component.js

(limited to 'ui/app/components/text-field/text-field.component.js')

diff --git a/ui/app/components/text-field/text-field.component.js b/ui/app/components/text-field/text-field.component.js
new file mode 100644
index 000000000..4a02f76d8
--- /dev/null
+++ b/ui/app/components/text-field/text-field.component.js
@@ -0,0 +1,54 @@
+import React from 'react'
+import PropTypes from 'prop-types'
+import { withStyles } from 'material-ui/styles'
+import { default as MaterialTextField } from 'material-ui/TextField'
+
+const styles = {
+  cssLabel: {
+    '&$cssFocused': {
+      color: '#aeaeae',
+    },
+    fontWeight: '400',
+    color: '#aeaeae',
+  },
+  cssFocused: {},
+  cssUnderline: {
+    '&:after': {
+      backgroundColor: '#f7861c',
+    },
+  },
+}
+
+const TextField = props => {
+  const { error, classes, ...textFieldProps } = props
+
+  return (
+    <MaterialTextField
+      error={Boolean(error)}
+      helperText={error}
+      InputLabelProps={{
+        FormLabelClasses: {
+          root: classes.cssLabel,
+          focused: classes.cssFocused,
+        },
+      }}
+      InputProps={{
+        classes: {
+          underline: classes.cssUnderline,
+        },
+      }}
+      {...textFieldProps}
+    />
+  )
+}
+
+TextField.defaultProps = {
+  error: null,
+}
+
+TextField.propTypes = {
+  error: PropTypes.string,
+  classes: PropTypes.object,
+}
+
+export default withStyles(styles)(TextField)
-- 
cgit 


From 0bcfbc15446b01b3b87233715cd3ead42d2730e4 Mon Sep 17 00:00:00 2001
From: Alexander Tseung <alextsg@gmail.com>
Date: Sat, 12 May 2018 20:53:40 -0700
Subject: Add error message when passwords don't match in first time flow.
 Change input field styling in first time flow

---
 ui/app/components/text-field/text-field.component.js | 5 +++++
 1 file changed, 5 insertions(+)

(limited to 'ui/app/components/text-field/text-field.component.js')

diff --git a/ui/app/components/text-field/text-field.component.js b/ui/app/components/text-field/text-field.component.js
index 4a02f76d8..6fd3b82b4 100644
--- a/ui/app/components/text-field/text-field.component.js
+++ b/ui/app/components/text-field/text-field.component.js
@@ -8,6 +8,9 @@ const styles = {
     '&$cssFocused': {
       color: '#aeaeae',
     },
+    '&$cssError': {
+      color: '#aeaeae',
+    },
     fontWeight: '400',
     color: '#aeaeae',
   },
@@ -17,6 +20,7 @@ const styles = {
       backgroundColor: '#f7861c',
     },
   },
+  cssError: {},
 }
 
 const TextField = props => {
@@ -30,6 +34,7 @@ const TextField = props => {
         FormLabelClasses: {
           root: classes.cssLabel,
           focused: classes.cssFocused,
+          error: classes.cssError,
         },
       }}
       InputProps={{
-- 
cgit