implement latest skin

skins/base/css/molecules/MemberTile.css

@@ -30,7 +30,7 @@ limitations under the License.
 }
 
 .mx_MemberTile_avatar img {
-    border-radius: 16px;    
+    border-radius: 20px;    
     background-color: #dbdbdb;
 }
 

skins/base/css/molecules/MessageComposer.css

@@ -19,9 +19,9 @@ limitations under the License.
     height: 50px;
     vertical-align: middle;
     margin: auto;
-    border-top: 1px solid #d8d8d8;
-    border-left: 1px solid #d8d8d8;
-    border-right: 1px solid #d8d8d8;
+    background-color: #fff;
+    border-radius: 25px;
+    border: 1px solid #e1e1e1;
 }
 
 .mx_MessageComposer_row {
@@ -32,32 +32,44 @@ limitations under the License.
 
 .mx_MessageComposer .mx_MessageComposer_avatar {
     display: table-cell;
-    padding-left: 12px;
-    padding-right: 12px;
-    padding-top: 3px;
-    padding-bottom: 3px;
-    vertical-align: middle;
-    width: 32px;
-    height: 32px;
+    padding-left: 5px;
+    padding-right: 10px;
+    height: 50px;
+}
+
+.mx_MessageComposer .mx_MessageComposer_avatar img {
+    margin-top: 5px;
+    border-radius: 20px;
+    background-color: #bdbdbd;
 }
 
 .mx_MessageComposer_input {
     display: table-cell;
     width: 100%;
-    padding-right: 1em;
     vertical-align: middle;
+    height: 50px;
 }
 
 .mx_MessageComposer_input textarea {
     font-size: 15px;
     width: 100%;
     height: 1em;
+    padding-top: 0.7em;
+    padding-bottom: 0.7em;
     border: 0px;
     resize: none;
     outline: none;
-    padding-top: 0.7em;
-    padding-bottom: 0.7em;
     -webkit-box-shadow: none;
     -moz-box-shadow: none;
     box-shadow: none;    
-}
+}
+
+.mx_MessageComposer_upload {
+    display: table-cell;
+    vertical-align: middle;
+    padding-right: 15px;
+}
+
+.mx_MessageComposer_upload img {
+    margin-top: 5px;
+}

skins/base/css/molecules/MessageTile.css

@@ -31,7 +31,7 @@ limitations under the License.
 
 .mx_MessageTile_avatar img {
     background-color: #dbdbdb;
-    border-radius: 16px;
+    border-radius: 20px;
     border: 0px;
 }
 

skins/base/css/molecules/RoomHeader.css

@@ -20,42 +20,85 @@ limitations under the License.
 .mx_RoomHeader_wrapper {
     max-width: 720px;
     margin: auto;
-    height: 50px;
+    height: 86px;
+    margin-top: 18px;
+
+    display: -webkit-box;
+    display: -moz-box;
+    display: -ms-flexbox;
+    display: -webkit-flex;
+    display: flex;    
 }
 
 .mx_RoomHeader_leftRow {
     display: table-row;
     margin-left: 12px;
-    height: 50px;
-    float: left;
+    height: 48px;
+
+    -webkit-box-ordinal-group: 1;
+    -moz-box-ordinal-group: 1;
+    -ms-flex-order: 1;
+    -webkit-order: 1;
+    order: 1;
 }
 
 .mx_RoomHeader_rightRow {
     display: table-row;
-    height: 50px;
-    margin-right: -26px;
-    float: right;
+    height: 48px;
+    background-color: #fff;
+    border-radius: 48px;
+    border: 1px solid #e1e1e1;
+
+    -webkit-box-ordinal-group: 2;
+    -moz-box-ordinal-group: 2;
+    -ms-flex-order: 2;
+    -webkit-order: 2;
+    order: 2;
+
+    -webkit-flex: 0 0 200px;
+    flex: 0 0 200px;    
+}
+
+.mx_RoomHeader_info {
+    display: table-cell;
+    height: 48px;
+    vertical-align: middle;
 }
 
 .mx_RoomHeader_name {
-    display: table-cell;
     vertical-align: middle;
-    height: 50px;
+    height: 28px;
+    color: #80cef4;
     font-weight: 400;
-    font-size: 20px;
+    font-size: 18px;
     padding-left: 16px;
     padding-right: 16px;
 }
 
+.mx_RoomHeader_topic {
+    vertical-align: bottom;
+    float: left;
+    max-height: 38px;
+    color: #80cef4;    
+    padding-left: 16px;
+    padding-right: 16px;
+    overflow: scroll;
+}
+
 .mx_RoomHeader_avatar {
     display: table-cell;
     height: 50px;
     vertical-align: middle;
 }
 
+.mx_RoomHeader_avatar img {
+	border-radius: 24px;
+}
+
 .mx_RoomHeader_button {
-    height: 50px;
+    height: 48px;
     display: table-cell;
     vertical-align: middle;
-    padding-right: 16px;    
+    padding-left: 8px;
+    padding-right: 8px;
 }

skins/base/css/molecules/RoomTile.css

@@ -34,7 +34,7 @@ limitations under the License.
 }
 
 .mx_RoomTile_avatar img {
-    border-radius: 16px;
+    border-radius: 20px;
     background-color: #dbdbdb;
 }
 
@@ -47,15 +47,14 @@ limitations under the License.
 
 .mx_RoomTile_badge {    
     float: right;
-    background-color: #d8d8d8;
-    color: #747474;
+    background-color: #80cef4;
+    color: #fff;
     border-radius: 10px;
     font-weight: 400;
     font-size: 14px;
-    line-height: 22px;
-    width: 34px;
-    height: 20px;
-    vertical-align: top;
+    line-height: 28px;
+    width: 26px;
+    height: 26px;
     text-align: center;
 }