Style the plain-text Mail editor

Style Contacts
Style Contact editor (buggy)
Change postcss config

UI/WebServerResources/scss/components/autoScrollList/autoScrollList.scss

@@ -10,7 +10,8 @@
 // avoid overspecifying
 // todo: create new classes and refactor templates markup
 // ----------------------------------------------------------------------------
-[id='messagesList'] {
+[id='messagesList'],
+[id='contactsList'] {
   border-top: 44px solid transparent;   // padding for the header.subheader,
   border-bottom: 2px solid transparent; //close to a hack
   z-index: 10;
@@ -41,12 +42,14 @@
 .sg {
   &-tile-content {
     @extend .md-tile-content;
-    .name  {
+    .name,
+    .contact-email {
       font-weight: $sg-font-light;
       margin-top: 0;
       margin-bottom: 0;
     }
-    .subject {
+    .subject,
+    .contact-name {
       font-weight: $sg-font-medium;
       // dirty fix for vs-repeat damages
       max-width: 75%;

UI/WebServerResources/scss/components/card/card.scss

@@ -7,6 +7,7 @@ md-card {
   box-sizing: border-box;
   display: flex;
   flex-direction: column;
+  background-color: sg-color($sogoPaper, 50);
 
   box-shadow: $card-box-shadow;
 

UI/WebServerResources/scss/components/input/input.scss

@@ -96,4 +96,21 @@ md-input-container .bgroup {
 }
 .bgroup b {
   left-margin: -1.25em;
-}
+}
+
+.PseudoField input {
+  flex: 1;
+  order: 2;
+  display: block;
+
+  background: none;
+  padding-top: $input-padding-top;
+  padding-bottom: 0;
+  border-width: 0 0 $input-border-width-default 0;
+  line-height: $input-line-height;
+  -ms-flex-preferred-size: $input-line-height; //IE fix
+
+  &:focus {
+    outline: none;
+  }
+}

UI/WebServerResources/scss/components/subheader/subheader.scss

@@ -6,11 +6,7 @@
     background-color: transparent;
     z-index: auto;
 }
-// WIdth for message list
-// ----------------------------------------------------------------------------
-[id = "messagesList"] .sg-md-subheader {
-  transform: translateY(-100%); // Compensate the container top-margin
-}
+
 .sg-md-subheader {
   font-size: $sg-font-size-2;
   font-weight: $sg-font-medium;

UI/WebServerResources/scss/components/toolbar/toolbar.scss

@@ -10,6 +10,7 @@ md-toolbar {
 }
 header {
   flex-direction: row;
+  flex-wrap: wrap;
   align-items: stretch;
   justify-content: space-between;
   display: flex;