fix(wallet-address): simply display generated address for now. add advanced settings later

app/routes/wallet/components/Wallet.js

@@ -40,16 +40,14 @@ class Wallet extends Component {
         <section className={styles.header}>
           <section className={styles.walletInfo}>
             <ReactSVG path='../resources/zap_2.svg' />
-            <h1>{info.data.identity_pubkey}</h1>
-            <section className={styles.addressContainer}>
-              <span className={`${styles.addressButton} ${styles.newAddress}`}>New wallet address</span>
-              <div className={styles.addressOptions}>
-                <span className={`${styles.addressButton} ${styles.p2wkh}`}>p2wkh</span>
-                <span className={`${styles.addressButton} ${styles.np2wkh}`}>np2wkh</span>
-                <span className={`${styles.addressButton} ${styles.p2pkh}`}>p2pkh</span>
-              </div>
-              <div className={styles.address}>{address}</div>
-            </section>
+            <h1 data-hint='Node identity public key' className='hint--top'>{info.data.identity_pubkey}</h1>
+            <h4 className={`${styles.address} hint--top`} data-hint='Wallet address'>
+              <input
+                type='text'
+                value={address}
+                readOnly
+              />
+            </h4>
           </section>
         </section>
         <section className={styles.walletData}>

app/routes/wallet/components/Wallet.scss

@@ -11,7 +11,7 @@
 	text-align: center;
 
 	.walletInfo {
-		width: 50%;
+		width: 75%;
 		margin: 0 auto;
 	}
 
@@ -22,47 +22,26 @@
 	}
 
 	h1 {
+		font-size: 20px;
 		margin: 20px 0;
-		font-weight: 200;
+		font-weight: bold;
 		color: $black;
-		text-align: left;
+		text-align: center;
 	}
 
-	.addressContainer {
-		text-align: left;
-		margin-top: 30px;
-
-		.addressButton {
-			display: inline-block;
-			border: 1px solid $main;
-			border-radius: 7px;
-			font-size: 10px;
-			cursor: pointer;
-			padding: 10px;
-			color: $main;
-			transition: all 0.25s;
-			
-			&:hover {
-				color: $white;
-				background: $main;
-			}
-		}
-
-		.addressOptions {
-			display: inline-block;
-			margin-left: 30px;
-
-			span {
-				margin: 0 5px;
-			}
-		}
+	.address {
+		text-align: center;
+		margin-top: 10px;
 
-		.address {
-			padding: 10px;
-			background: $darkgrey;
+		input[type=text] {
+			width: 50%;
 			text-align: center;
+			font-size: 14px;
+			font-weight: 200;
 			border-radius: 7px;
-			margin-top: 10px;
+			background: $lightgrey;
+			border: 1px solid $main;
+			padding: 10px;
 		}
 	}
 }