ui - redesign - app header + accounts selection

3 files changed, 76 insertions, 15 deletions

diff --git a/ui/app/css/fonts.css b/ui/app/css/fonts.css
index dd1a755fb..b528cb9ab 100644
--- a/ui/app/css/fonts.css
+++ b/ui/app/css/fonts.css
@@ -1,2 +1,46 @@
 @import url(https://fonts.googleapis.com/css?family=Roboto:300,500);
-@import url(https://maxcdn.bootstrapcdn.com/font-awesome/4.4.0/css/font-awesome.min.css);
\ No newline at end of file
+@import url(https://maxcdn.bootstrapcdn.com/font-awesome/4.4.0/css/font-awesome.min.css);
+
+@font-face {
+  font-family: 'Transat Standard';
+  src: url('/fonts/Transat Standard/transat_standard-webfont.eot');
+  src: url('/fonts/Transat Standard/transat_standard-webfont.eot?#iefix') format('embedded-opentype'),
+       url('/fonts/Transat Standard/transat_standard-webfont.woff') format('woff'),
+       url('/fonts/Transat Standard/transat_standard-webfont.ttf') format('truetype'),
+       url('/fonts/Transat Standard/transat_standard-webfont.svg#ywftsvg') format('svg');
+  font-weight: normal;
+  font-style: normal;
+}
+
+@font-face {
+  font-family: 'Transat Black';
+  src: url('/fonts/Transat Black/transat_black-webfont.eot');
+  src: url('/fonts/Transat Black/transat_black-webfont.eot?#iefix') format('embedded-opentype'),
+       url('/fonts/Transat Black/transat_black-webfont.woff') format('woff'),
+       url('/fonts/Transat Black/transat_black-webfont.ttf') format('truetype'),
+       url('/fonts/Transat Black/transat_black-webfont.svg#ywftsvg') format('svg');
+  font-weight: normal;
+  font-style: normal;
+}
+
+@font-face {
+  font-family: 'Transat Medium';
+  src: url('/fonts/Transat Medium/transat_medium-webfont.eot');
+  src: url('/fonts/Transat Medium/transat_medium-webfont.eot?#iefix') format('embedded-opentype'),
+       url('/fonts/Transat Medium/transat_medium-webfont.woff') format('woff'),
+       url('/fonts/Transat Medium/transat_medium-webfont.ttf') format('truetype'),
+       url('/fonts/Transat Medium/transat_medium-webfont.svg#ywftsvg') format('svg');
+  font-weight: normal;
+  font-style: normal;
+}
+
+@font-face {
+  font-family: 'Transat Light';
+  src: url('/fonts/Transat Light/transat_light-webfont.eot');
+  src: url('/fonts/Transat Light/transat_light-webfont.eot?#iefix') format('embedded-opentype'),
+       url('/fonts/Transat Light/transat_light-webfont.woff') format('woff'),
+       url('/fonts/Transat Light/transat_light-webfont.ttf') format('truetype'),
+       url('/fonts/Transat Light/transat_light-webfont.svg#ywftsvg') format('svg');
+  font-weight: normal;
+  font-style: normal;
+}
diff --git a/ui/app/css/index.css b/ui/app/css/index.css
index 4871a650f..cde130dfe 100644
--- a/ui/app/css/index.css
+++ b/ui/app/css/index.css
@@ -14,8 +14,7 @@ application specific styles
 }
 
 html, body {
-  /*font-family: 'Open Sans', Arial, sans-serif;*/
-  font-family: 'Roboto', 'Noto', sans-serif;
+  font-family: 'Transat Standard', Arial;
   color: #4D4D4D;
   font-weight: 300;
   line-height: 1.4em;
@@ -98,23 +97,25 @@ button.btn-thin {
 }
 
 .app-header {
-  padding-top: 20px;
+  padding: 6px 8px;
 }
 
 .app-header h1 {
-  font-size: 2em;
-  font-weight: 300;
-  height: 42px;
+  font-family: 'Transat Medium';
+  text-transform: uppercase;
+  color: #AEAEAE;
 }
 
 h2.page-subtitle {
+  font-family: 'Transat Light';
+  text-transform: uppercase;
+  color: #AEAEAE;
   font-size: 1em;
-  font-weight: 500;
-  height: 24px;
-  color: #F3C83E;
+  margin: 12px;
 }
 
 .app-primary {
+  background: #F7F7F7;
 }
 
 .app-footer {
@@ -238,11 +239,19 @@ app sections
 /* accounts */
 
 .accounts-section {
-  margin: 0 20px;
+  margin: 0 0px;
 }
 
-.current-domain-panel {
-  border: 1px solid #B7B7B7;
+.accounts-section .horizontal-line {
+  margin: 0px 18px;
+}
+
+.accounts-list-option {
+  height: 120px;
+}
+
+.accounts-list-option .identicon-wrapper {
+  width: 100px;
 }
 
 .unconftx-link {
@@ -289,8 +298,7 @@ app sections
 /* accounts screen */
 
 .identity-section {
-  border: 2px solid #4D4D4D;
-  margin: 0;
+
 }
 
 .identity-section .identity-panel {
diff --git a/ui/app/css/lib.css b/ui/app/css/lib.css
index b6b26402b..6223a8c06 100644
--- a/ui/app/css/lib.css
+++ b/ui/app/css/lib.css
@@ -141,3 +141,12 @@
 .send-screen section input {
   width: 100%;
 }
+
+hr.horizontal-line {
+  display: block;
+  height: 1px;
+  border: 0;
+  border-top: 1px solid #ccc;
+  margin: 1em 0;
+  padding: 0;
+}
\ No newline at end of file