From 23b7dfd137f7c1778fb81d2b8600e7afedc90610 Mon Sep 17 00:00:00 2001
From: Barry Gitarts <bgitarts@gmail.com>
Date: Mon, 9 Jul 2018 14:47:20 -0400
Subject: [PATCH] add WelcomeContent to welcome page

---
 app/components/ens/welcome.js | 39 ++++++++++++++++++++++++++++++++---
 1 file changed, 36 insertions(+), 3 deletions(-)

diff --git a/app/components/ens/welcome.js b/app/components/ens/welcome.js
index 0146049..8466bc8 100644
--- a/app/components/ens/welcome.js
+++ b/app/components/ens/welcome.js
@@ -3,7 +3,7 @@ import classNames from 'classnames';
 import { withStyles } from '@material-ui/core/styles';
 import Typography from '@material-ui/core/Typography';
 import Button from '@material-ui/core/Button';
-import StatusCards from '../../ui/icons/svg/intro_cards.svg'
+import StatusCards from '../../ui/icons/svg/intro_cards.svg';
 
 const styles = theme => ({
   button: {
@@ -13,17 +13,50 @@ const styles = theme => ({
   }
 });
 
-const buttonText = { color: '#4360df', margin: '0 20px', fontWeight: 300 }
+const textStyle = { textAlign: 'center' };
+const sectionTitleStyle = { margin: '10px 0px 10px 0px' };
+const subTextStyle = { color: '#939ba1' };
+const buttonText = { color: '#4360df', margin: '0 20px', fontWeight: 300 };
+
+const WelcomeContent = () => (
+  <div style={{ marginTop: '20px', textAlign: 'center' }}>
+    <div>
+      <Typography variant="title" style={sectionTitleStyle}>
+        Secure
+      </Typography>
+      <Typography variant="subheading" style={subTextStyle}>
+        Search for vacant names in domains
.stateofus.eth and .eth
+      </Typography>
+    </div>
+    <div>
+      <Typography variant="title" style={sectionTitleStyle}>
+        Decentralized
+      </Typography>
+      <Typography variant="subheading" style={subTextStyle}>
+        Search for vacant names in domains
.stateofus.eth and .eth
+      </Typography>
+    </div>
+    <div>
+      <Typography variant="title" style={sectionTitleStyle}>
+        Amazing
+      </Typography>
+      <Typography variant="subheading" style={subTextStyle}>
+        Search for vacant names in domains
.stateofus.eth and .eth
+      </Typography>
+    </div>
+  </div>
+);
 
 const Welcome = ({ classes }) => (
   <div style={{ display: 'flex', flexDirection: 'column', alignItems: 'center' }}>
     <img src={StatusCards} />
-    <Typography variant="title" style={{ textAlign: 'center' }}>
+    <Typography variant="title" style={textStyle}>
       Get a human-readable name instead of long addresses
     </Typography>
     <Button size="large" className={classNames(classes.button)}>
       <div style={buttonText}>Let's Go</div>
     </Button>
+    <WelcomeContent />
   </div>
 );