♻️ Add lisk logo for v2 layout and icon for choose avatar step

LiskHQ · Jan 3, 2019 · 61a0a4c · 61a0a4c
1 parent fd233d6
commit 61a0a4c
Show file tree

Hide file tree

Showing 6 changed files with 25 additions and 5 deletions.
diff --git a/src/assets/images/icons-v2/avatar.svg b/src/assets/images/icons-v2/avatar.svg
diff --git a/src/assets/images/lisk-logo-v2.svg b/src/assets/images/lisk-logo-v2.svg
diff --git a/src/components/headerV2/headerV2.css b/src/components/headerV2/headerV2.css
@@ -11,15 +11,15 @@
   flex-direction: row;
   height: 100px;
   justify-content: space-between;
-  padding: 33px 40px;
+  padding: 21px 32px;
   position: absolute;
   top: 0;
   width: 100%;
 }
 
 .logo {
-  height: 32px;
-  width: 27px;
+  height: 56px;
+  width: 56px;
 
   & > img {
     display: block;

diff --git a/src/components/headerV2/headerV2.js b/src/components/headerV2/headerV2.js
@@ -2,7 +2,7 @@ import React from 'react';
 import { Link } from 'react-router-dom';
 import { translate } from 'react-i18next';
 import { SecondaryButtonV2 } from '../toolbox/buttons/button';
-import logo from '../../assets/images/Lisk-Logo.svg';
+import logo from '../../assets/images/lisk-logo-v2.svg';
 import routes from '../../constants/routes';
 import styles from './headerV2.css';
 

diff --git a/src/components/registerV2/chooseAvatar.js b/src/components/registerV2/chooseAvatar.js
@@ -9,6 +9,7 @@ import { FontIcon } from '../fontIcon';
 import { PrimaryButtonV2, SecondaryButtonV2 } from '../toolbox/buttons/button';
 import AccountVisual from '../accountVisual';
 import styles from './registerV2.css';
+import avatar from '../../assets/images/icons-v2/avatar.svg';
 
 class ChooseAvatar extends React.Component {
   constructor() {
@@ -40,7 +41,10 @@ class ChooseAvatar extends React.Component {
     return (
       <React.Fragment>
         <div className={`${styles.titleHolder} ${grid['col-xs-10']}`}>
-          <h1>{t('Choose your Avatar')}</h1>
+          <h1>
+            <img src={avatar} />
+            {t('Choose your Avatar')}
+          </h1>
           <p>{
             t('Each Avatar is a visual representation of the address, making it unique.')
           }</p>

diff --git a/src/components/registerV2/registerV2.css b/src/components/registerV2/registerV2.css
@@ -42,11 +42,17 @@
   text-align: center;
 
   & > h1 {
+    display: flex;
     font-size: 24px;
     font-weight: 600;
+    justify-content: center;
     letter-spacing: 0.1px;
     line-height: 50px;
     margin: 0;
+
+    & > img {
+      margin-right: 16px;
+    }
   }
 
   & > p {