diff --git a/.gitignore b/.gitignore
index 13466ce8..a28ca6b1 100644
--- a/.gitignore
+++ b/.gitignore
@@ -1,3 +1,8 @@
node_modules
vector/bundle.*
lib
+bundle.css
+.DS_Store
+key.pem
+cert.pem
+build
diff --git a/src/skins/vector/css/common.css b/src/skins/vector/css/common.css
index aff9666e..381eb2cb 100644
--- a/src/skins/vector/css/common.css
+++ b/src/skins/vector/css/common.css
@@ -22,7 +22,7 @@ html {
}
body {
- font-family: 'Lato', Helvetica, Arial, Sans-Serif;
+ font-family: 'Myriad Pro', Helvetica, Arial, Sans-Serif;
font-size: 16px;
color: #454545;
border: 0px;
@@ -34,7 +34,7 @@ div.error {
}
h2 {
- color: #80cef4;
+ color: #454545;
font-weight: 400;
font-size: 20px;
margin-top: 16px;
@@ -44,7 +44,7 @@ h2 {
a:hover,
a:link,
a:visited {
- color: #80CEF4;
+ color: #76cfa6;
}
.mx_ContextualMenu_background {
@@ -149,7 +149,7 @@ a:visited {
font-weight: 400;
font-size: 16px;
color: #fff;
- background-color: #80cef4;
+ background-color: #76cfa6;
margin-left: 8px;
margin-right: 8px;
padding-left: 1em;
diff --git a/src/skins/vector/css/hide.css b/src/skins/vector/css/hide.css
index fbc2db20..df437e97 100644
--- a/src/skins/vector/css/hide.css
+++ b/src/skins/vector/css/hide.css
@@ -1,6 +1,6 @@
.mx_RoomDropTarget,
-.mx_RoomList_favourites_label,
-.mx_RoomList_archive_label,
+.mx_RoomList_favouritesLabel,
+.mx_RoomList_archiveLabel,
.mx_RoomHeader_search,
.mx_RoomSettings_encrypt,
.mx_CreateRoom_encrypt,
diff --git a/src/skins/vector/css/molecules/EventTile.css b/src/skins/vector/css/molecules/EventTile.css
index 1cd2fa46..a9a5260c 100644
--- a/src/skins/vector/css/molecules/EventTile.css
+++ b/src/skins/vector/css/molecules/EventTile.css
@@ -22,10 +22,10 @@ limitations under the License.
}
.mx_EventTile_avatar {
- padding-left: 12px;
+ padding-left: 18px;
padding-right: 12px;
margin-left: -64px;
- margin-top: -7px;
+ margin-top: -4px;
float: left;
}
@@ -48,9 +48,8 @@ limitations under the License.
}
.mx_EventTile .mx_MessageTimestamp {
- color: #454545;
- opacity: 0.5;
- font-size: 14px;
+ color: #acacac;
+ font-size: 12px;
float: right;
}
diff --git a/src/skins/vector/css/molecules/MImageTile.css b/src/skins/vector/css/molecules/MImageTile.css
index 10e5b50b..94f1c919 100644
--- a/src/skins/vector/css/molecules/MImageTile.css
+++ b/src/skins/vector/css/molecules/MImageTile.css
@@ -23,12 +23,12 @@ limitations under the License.
}
.mx_MImageTile_download {
- color: #80cef4;
+ color: #76cfa6;
cursor: pointer;
}
.mx_MImageTile_download a {
- color: #80cef4;
+ color: #76cfa6;
text-decoration: none;
}
diff --git a/src/skins/vector/css/molecules/MemberTile.css b/src/skins/vector/css/molecules/MemberTile.css
index faae142a..ca752541 100644
--- a/src/skins/vector/css/molecules/MemberTile.css
+++ b/src/skins/vector/css/molecules/MemberTile.css
@@ -27,8 +27,8 @@ limitations under the License.
padding-top: 3px;
padding-bottom: 3px;
vertical-align: middle;
- width: 40px;
- height: 40px;
+ width: 36px;
+ height: 36px;
position: relative;
}
@@ -60,8 +60,8 @@ limitations under the License.
.mx_MemberTile_power {
position: absolute;
- width: 48px;
- height: 48px;
+ width: 44px;
+ height: 44px;
left: 10px;
top: -1px;
}
diff --git a/src/skins/vector/css/molecules/MessageComposer.css b/src/skins/vector/css/molecules/MessageComposer.css
index af4934ee..e7f6919c 100644
--- a/src/skins/vector/css/molecules/MessageComposer.css
+++ b/src/skins/vector/css/molecules/MessageComposer.css
@@ -15,30 +15,29 @@ limitations under the License.
*/
.mx_MessageComposer_wrapper {
- max-width: 720px;
- height: 50px;
+ max-width: 960px;
+ height: 70px;
vertical-align: middle;
margin: auto;
background-color: #fff;
- border-radius: 25px;
- border: 1px solid #a9dbf4;
+ border-top: 2px solid #e1dddd;
}
.mx_MessageComposer_row {
display: table-row;
width: 100%;
- height: 50px;
+ height: 70px;
}
.mx_MessageComposer .mx_MessageComposer_avatar {
display: table-cell;
- padding-left: 5px;
- padding-right: 10px;
- height: 50px;
+ padding-left: 10px;
+ padding-right: 20px;
+ height: 70px;
}
.mx_MessageComposer .mx_MessageComposer_avatar img {
- margin-top: 5px;
+ margin-top: 18px;
border-radius: 20px;
background-color: #dbdbdb;
}
@@ -47,7 +46,7 @@ limitations under the License.
display: table-cell;
width: 100%;
vertical-align: middle;
- height: 50px;
+ height: 70px;
}
.mx_MessageComposer_input textarea {
@@ -64,12 +63,16 @@ limitations under the License.
box-shadow: none;
/* needed for FF */
- font-family: 'Lato', Helvetica, Arial, Sans-Serif;
+ font-family: 'Myriad Pro', Helvetica, Arial, Sans-Serif;
}
/* hack for FF as vertical alignment of custom placeholder text is broken */
.mx_MessageComposer_input textarea::-moz-placeholder {
line-height: 100%;
+ color: #76cfa6;
+}
+.mx_MessageComposer_input textarea::-webkit-input-placeholder {
+ color: #76cfa6;
}
.mx_MessageComposer_upload {
diff --git a/src/skins/vector/css/molecules/RoomHeader.css b/src/skins/vector/css/molecules/RoomHeader.css
index f7adb618..6ae067a0 100644
--- a/src/skins/vector/css/molecules/RoomHeader.css
+++ b/src/skins/vector/css/molecules/RoomHeader.css
@@ -18,10 +18,10 @@ limitations under the License.
}
.mx_RoomHeader_wrapper {
- max-width: 720px;
+ max-width: 960px;
margin: auto;
height: 88px;
- border-bottom: 1px solid #a8dbf3;
+ border-bottom: 1px solid #eeeeee;
display: -webkit-box;
display: -moz-box;
@@ -47,7 +47,7 @@ limitations under the License.
.mx_RoomHeader_textButton {
height: 48px;
margin-top: 18px;
- background-color: #80cef4;
+ background-color: #76cfa6;
border-radius: 48px;
margin-right: 8px;
color: #fff;
@@ -92,7 +92,7 @@ limitations under the License.
.mx_RoomHeader_simpleHeader {
line-height: 88px;
- color: #80cef4;
+ color: #76cfa6;
font-weight: 400;
font-size: 20px;
overflow: hidden;
@@ -102,8 +102,8 @@ limitations under the License.
.mx_RoomHeader_name {
vertical-align: middle;
height: 28px;
- color: #80cef4;
- font-weight: 400;
+ color: #454545;
+ font-weight: 800;
font-size: 20px;
padding-left: 16px;
padding-right: 16px;
@@ -133,7 +133,7 @@ limitations under the License.
vertical-align: bottom;
float: left;
max-height: 38px;
- color: #70b5d7;
+ color: #454545;
font-weight: 300;
padding-left: 16px;
padding-right: 16px;
diff --git a/src/skins/vector/css/molecules/RoomSettings.css b/src/skins/vector/css/molecules/RoomSettings.css
index 3a66f0e9..a669c5b2 100644
--- a/src/skins/vector/css/molecules/RoomSettings.css
+++ b/src/skins/vector/css/molecules/RoomSettings.css
@@ -61,7 +61,7 @@ limitations under the License.
font-weight: 400;
font-size: 16px;
color: #fff;
- background-color: #80cef4;
+ background-color: #76cfa6;
width: auto;
margin: auto;
padding: 6px;
diff --git a/src/skins/vector/css/molecules/RoomTile.css b/src/skins/vector/css/molecules/RoomTile.css
index 511fc94f..cc933226 100644
--- a/src/skins/vector/css/molecules/RoomTile.css
+++ b/src/skins/vector/css/molecules/RoomTile.css
@@ -17,18 +17,19 @@ limitations under the License.
.mx_RoomTile {
cursor: pointer;
display: table-row;
- color: #818794;
+ font-size: 14px;
}
.mx_RoomTile_avatar {
display: table-cell;
- padding-right: 10px;
+ background: #eaf5f0;
+ padding-right: 8px;
padding-top: 3px;
padding-bottom: 3px;
- padding-left: 10px;
+ padding-left: 18px;
vertical-align: middle;
- width: 36px;
- height: 36px;
+ width: 24px;
+ height: 24px;
position: relative;
}
@@ -43,6 +44,8 @@ limitations under the License.
overflow: hidden;
text-overflow: ellipsis;
padding-right: 16px;
+ color: #454545;
+ opacity: 0.8;
}
.collapsed .mx_RoomTile_name {
@@ -63,7 +66,7 @@ limitations under the License.
}
.mx_RoomTile_badge {
- background-color: #80cef4;
+ background-color: #76cfa6;
color: #fff;
border-radius: 26px;
font-weight: 400;
@@ -75,6 +78,7 @@ limitations under the License.
}
*/
+/*
.mx_RoomTile_badge {
background-color: #ff0064;
border: 3px solid #fff;
@@ -85,20 +89,37 @@ limitations under the License.
right: 9px;
bottom: 3px;
}
+*/
+
+.mx_RoomTile_highlight .mx_RoomTile_sidebadge,
+.mx_RoomTile_unread .mx_RoomTile_sidebadge {
+ background-color: #76cfa6;
+ width: 4px;
+ position: absolute;
+ left: 0px;
+}
.mx_RoomTile_unread,
.mx_RoomTile_highlight,
.mx_RoomTile_invited
{
font-weight: bold;
- color: #000;
}
.mx_RoomTile_selected {
- background-color: #f3f8fa;
- color: #80cef4;
font-weight: bold;
}
+.mx_RoomTile.mx_RoomTile_selected {
+ background: url('img/selected.png');
+ background-repeat: no-repeat;
+ background-position: right center;
+}
+
+.mx_RoomTile_arrow {
+ position: absolute;
+ right: 0px;
+}
+
.mx_RoomTile:hover {
}
diff --git a/src/skins/vector/css/organisms/CreateRoom.css b/src/skins/vector/css/organisms/CreateRoom.css
index d6b1765c..578c79e6 100644
--- a/src/skins/vector/css/organisms/CreateRoom.css
+++ b/src/skins/vector/css/organisms/CreateRoom.css
@@ -15,7 +15,7 @@ limitations under the License.
*/
.mx_CreateRoom {
- width: 720px;
+ width: 960px;
margin-left: auto;
margin-right: auto;
color: #4a4a4a;
diff --git a/src/skins/vector/css/organisms/LeftPanel.css b/src/skins/vector/css/organisms/LeftPanel.css
index 0e7e077e..67f00c35 100644
--- a/src/skins/vector/css/organisms/LeftPanel.css
+++ b/src/skins/vector/css/organisms/LeftPanel.css
@@ -53,17 +53,20 @@ limitations under the License.
-webkit-order: 3;
order: 3;
- -webkit-flex: 0 0 170px;
- flex: 0 0 170px;
-
- border-top: 1px solid #f3f8fa;
+ -webkit-flex: 0 0 126px;
+ flex: 0 0 126px;
}
.mx_LeftPanel .mx_BottomLeftMenu .mx_RoomTile {
- color: #378bb4;
+ color: #454545;
}
.mx_LeftPanel .mx_BottomLeftMenu .mx_BottomLeftMenu_options {
margin-top: 12px;
width: 100%;
+}
+
+.mx_LeftPanel .mx_BottomLeftMenu img {
+ border-radius: 0px;
+ background-color: transparent;
}
\ No newline at end of file
diff --git a/src/skins/vector/css/organisms/MemberList.css b/src/skins/vector/css/organisms/MemberList.css
index aab0def4..7320a127 100644
--- a/src/skins/vector/css/organisms/MemberList.css
+++ b/src/skins/vector/css/organisms/MemberList.css
@@ -16,8 +16,6 @@ limitations under the License.
.mx_MemberList {
height: 100%;
- margin-bottom: 100px;
- padding: 8px;
-webkit-flex: 1;
flex: 1;
@@ -39,10 +37,7 @@ limitations under the License.
}
.mx_MemberList_border {
- border: 1px solid #a9dbf4;
overflow-y: auto;
- border-radius: 8px;
- background-color: #fff;
order: 1;
-webkit-flex: 1 1 0;
diff --git a/src/skins/vector/css/organisms/RoomDirectory.css b/src/skins/vector/css/organisms/RoomDirectory.css
index 21985a25..f53f0556 100644
--- a/src/skins/vector/css/organisms/RoomDirectory.css
+++ b/src/skins/vector/css/organisms/RoomDirectory.css
@@ -15,7 +15,7 @@ limitations under the License.
*/
.mx_RoomDirectory {
- width: 720px;
+ width: 960px;
margin-left: auto;
margin-right: auto;
margin-bottom: 12px;
diff --git a/src/skins/vector/css/organisms/RoomList.css b/src/skins/vector/css/organisms/RoomList.css
index 21cb7812..89181b82 100644
--- a/src/skins/vector/css/organisms/RoomList.css
+++ b/src/skins/vector/css/organisms/RoomList.css
@@ -15,6 +15,7 @@ limitations under the License.
*/
.mx_RoomList {
+ padding-top: 24px;
}
.mx_RoomList_recents {
@@ -24,8 +25,15 @@ limitations under the License.
width: 100%;
}
+.mx_RoomList_recentsLabel img {
+ margin-left: 8px;
+}
+
.mx_RoomList h2 {
- padding-left: 16px;
- padding-right: 16px;
- padding-bottom: 10px;
-}
\ No newline at end of file
+ text-transform: uppercase;
+ color: #3d3b39;
+ font-weight: 600;
+ font-size: 14px;
+ padding-left: 12px;
+ padding-right: 12px;
+}
diff --git a/src/skins/vector/css/organisms/RoomView.css b/src/skins/vector/css/organisms/RoomView.css
index 2aab203a..8ca00803 100644
--- a/src/skins/vector/css/organisms/RoomView.css
+++ b/src/skins/vector/css/organisms/RoomView.css
@@ -42,7 +42,7 @@ limitations under the License.
.mx_RoomView_fileDropTarget {
min-width: 0px;
- max-width: 720px;
+ max-width: 960px;
width: 100%;
font-size: 20px;
text-align: center;
@@ -61,7 +61,7 @@ limitations under the License.
border-top-right-radius: 10px;
background-color: rgba(255, 255, 255, 0.9);
- border: 2px dashed #80cef4;
+ border: 2px dashed #76cfa6;
border-bottom: none;
position: absolute;
top: 88px;
@@ -84,12 +84,12 @@ limitations under the License.
order: 2;
min-width: 0px;
- max-width: 720px;
+ max-width: 960px;
width: 100%;
margin: auto;
overflow: auto;
- border-bottom: 1px solid #a8dbf3;
+ border-bottom: 1px solid #eee;
-webkit-flex: 0 0 auto;
flex: 0 0 auto;
@@ -111,7 +111,7 @@ limitations under the License.
}
.mx_RoomView_messageListWrapper {
- max-width: 720px;
+ max-width: 960px;
margin: auto;
}
@@ -129,8 +129,9 @@ limitations under the License.
clear: both;
margin-top: 32px;
margin-bottom: 8px;
+ margin-left: 54px;
padding-bottom: 6px;
- border-bottom: 1px solid #a8dbf3;
+ border-bottom: 1px solid #eee;
}
.mx_RoomView_invitePrompt {
@@ -141,7 +142,7 @@ limitations under the License.
order: 2;
min-width: 0px;
- max-width: 720px;
+ max-width: 960px;
width: 100%;
margin: auto;
@@ -157,14 +158,19 @@ limitations under the License.
order: 4;
width: 100%;
- -webkit-flex: 0 0 58px;
- flex: 0 0 58px;
+ -webkit-flex: 0 0 36px;
+ flex: 0 0 36px;
}
.mx_RoomView_statusAreaBox {
- max-width: 720px;
+ max-width: 960px;
margin: auto;
- border-top: 1px solid #a8dbf3;
+}
+
+.mx_RoomView_statusAreaBox_line {
+ border-top: 1px solid #eee;
+ margin-left: 54px;
+ height: 1px;
}
.mx_RoomView_unreadMessagesBar {
@@ -205,8 +211,8 @@ limitations under the License.
order: 5;
width: 100%;
- -webkit-flex: 0 0 63px;
- flex: 0 0 63px;
+ -webkit-flex: 0 0 70px;
+ flex: 0 0 70px;
margin-right: 2px;
}
@@ -217,7 +223,7 @@ limitations under the License.
}
.mx_RoomView_uploadProgressInner {
- background-color: #80cef4;
+ background-color: #76cfa6;
height: 4px;
}
diff --git a/src/skins/vector/css/organisms/UserSettings.css b/src/skins/vector/css/organisms/UserSettings.css
index b69399b7..2b0aca3d 100644
--- a/src/skins/vector/css/organisms/UserSettings.css
+++ b/src/skins/vector/css/organisms/UserSettings.css
@@ -15,7 +15,7 @@ limitations under the License.
*/
.mx_UserSettings {
- width: 720px;
+ width: 960px;
margin-left: auto;
margin-right: auto;
}
diff --git a/src/skins/vector/css/pages/MatrixChat.css b/src/skins/vector/css/pages/MatrixChat.css
index 6fa0415a..f649aa24 100644
--- a/src/skins/vector/css/pages/MatrixChat.css
+++ b/src/skins/vector/css/pages/MatrixChat.css
@@ -69,6 +69,8 @@ limitations under the License.
-webkit-order: 1;
order: 1;
+ background-color: #eaf5f0;
+
-webkit-flex: 0 0 230px;
flex: 0 0 230px;
}
@@ -87,7 +89,7 @@ limitations under the License.
padding-left: 12px;
padding-right: 12px;
- background-color: #f3f8fa;
+ background-color: #fff;
-webkit-flex: 1;
flex: 1;
@@ -114,7 +116,6 @@ limitations under the License.
-webkit-order: 3;
order: 3;
- background-color: #f3f8fa;
-webkit-flex: 0 0 230px;
flex: 0 0 230px;
}
diff --git a/src/skins/vector/fonts/MyriadPro-Bold.woff b/src/skins/vector/fonts/MyriadPro-Bold.woff
new file mode 100644
index 00000000..f30c591f
Binary files /dev/null and b/src/skins/vector/fonts/MyriadPro-Bold.woff differ
diff --git a/src/skins/vector/fonts/MyriadPro-BoldIt.woff b/src/skins/vector/fonts/MyriadPro-BoldIt.woff
new file mode 100644
index 00000000..db605a6c
Binary files /dev/null and b/src/skins/vector/fonts/MyriadPro-BoldIt.woff differ
diff --git a/src/skins/vector/fonts/MyriadPro-It.woff b/src/skins/vector/fonts/MyriadPro-It.woff
new file mode 100644
index 00000000..9a133bcd
Binary files /dev/null and b/src/skins/vector/fonts/MyriadPro-It.woff differ
diff --git a/src/skins/vector/fonts/MyriadPro-Regular.woff b/src/skins/vector/fonts/MyriadPro-Regular.woff
new file mode 100644
index 00000000..5a95583f
Binary files /dev/null and b/src/skins/vector/fonts/MyriadPro-Regular.woff differ
diff --git a/src/skins/vector/fonts/MyriadPro-SemiBold.woff b/src/skins/vector/fonts/MyriadPro-SemiBold.woff
new file mode 100644
index 00000000..2a80f65d
Binary files /dev/null and b/src/skins/vector/fonts/MyriadPro-SemiBold.woff differ
diff --git a/src/skins/vector/fonts/MyriadPro.css b/src/skins/vector/fonts/MyriadPro.css
new file mode 100644
index 00000000..833e6828
--- /dev/null
+++ b/src/skins/vector/fonts/MyriadPro.css
@@ -0,0 +1,20 @@
+@font-face {
+ font-family: 'Myriad Pro';
+ font-style: normal;
+ font-weight: normal;
+ src: local('Myriad Pro'), local('MyriadPro'), url(MyriadPro-Regular.woff) format('woff');
+}
+
+@font-face {
+ font-family: 'Myriad Pro';
+ font-style: normal;
+ font-weight: 600;
+ src: local('Myriad Pro SemiBold'), local('MyriadPro-SemiBold'), url(MyriadPro-SemiBold.woff) format('woff');
+}
+
+@font-face {
+ font-family: 'Myriad Pro';
+ font-style: normal;
+ font-weight: bold;
+ src: local('Myriad Pro Bold'), local('MyriadPro-Bold'), url(MyriadPro-Bold.woff) format('woff');
+}
diff --git a/src/skins/vector/img/create-big.png b/src/skins/vector/img/create-big.png
index 247b0030..b7307a11 100644
Binary files a/src/skins/vector/img/create-big.png and b/src/skins/vector/img/create-big.png differ
diff --git a/src/skins/vector/img/directory-big.png b/src/skins/vector/img/directory-big.png
index bbcb16a4..03cab69c 100644
Binary files a/src/skins/vector/img/directory-big.png and b/src/skins/vector/img/directory-big.png differ
diff --git a/src/skins/vector/img/selected.png b/src/skins/vector/img/selected.png
new file mode 100644
index 00000000..8931cba7
Binary files /dev/null and b/src/skins/vector/img/selected.png differ
diff --git a/src/skins/vector/img/settings-big.png b/src/skins/vector/img/settings-big.png
index 3be13bc7..cb2e0a62 100644
Binary files a/src/skins/vector/img/settings-big.png and b/src/skins/vector/img/settings-big.png differ
diff --git a/src/skins/vector/views/atoms/RoomAvatar.js b/src/skins/vector/views/atoms/RoomAvatar.js
index 39b995a7..4416a6b8 100644
--- a/src/skins/vector/views/atoms/RoomAvatar.js
+++ b/src/skins/vector/views/atoms/RoomAvatar.js
@@ -34,7 +34,7 @@ module.exports = React.createClass({
},
getFallbackAvatar: function() {
- var images = [ '80cef4', '50e2c2', 'f4c371' ];
+ var images = [ '76cfa6', '50e2c2', 'f4c371' ];
var total = 0;
for (var i = 0; i < this.props.room.roomId.length; ++i) {
total += this.props.room.roomId.charCodeAt(i);
diff --git a/src/skins/vector/views/molecules/BottomLeftMenuTile.js b/src/skins/vector/views/molecules/BottomLeftMenuTile.js
index 2644769c..8c28058d 100644
--- a/src/skins/vector/views/molecules/BottomLeftMenuTile.js
+++ b/src/skins/vector/views/molecules/BottomLeftMenuTile.js
@@ -48,7 +48,7 @@ module.exports = React.createClass({
return (
<div className="mx_RoomTile" onMouseEnter={this.onMouseEnter} onMouseLeave={this.onMouseLeave} onClick={this.props.onClick}>
<div className="mx_RoomTile_avatar">
- <img src={ this.props.img } width="36" height="36"/>
+ <img src={ this.props.img } width="24" height="24"/>
</div>
{ label }
</div>
diff --git a/src/skins/vector/views/molecules/EventTile.js b/src/skins/vector/views/molecules/EventTile.js
index 534af3c7..a086ad00 100644
--- a/src/skins/vector/views/molecules/EventTile.js
+++ b/src/skins/vector/views/molecules/EventTile.js
@@ -110,7 +110,7 @@ module.exports = React.createClass({
if (this.props.mxEvent.sender) {
avatar = (
<div className="mx_EventTile_avatar">
- <MemberAvatar member={this.props.mxEvent.sender} />
+ <MemberAvatar member={this.props.mxEvent.sender} width="24" height="24" />
</div>
);
}
diff --git a/src/skins/vector/views/molecules/MemberTile.js b/src/skins/vector/views/molecules/MemberTile.js
index 4c34fcb7..845d2a97 100644
--- a/src/skins/vector/views/molecules/MemberTile.js
+++ b/src/skins/vector/views/molecules/MemberTile.js
@@ -121,7 +121,7 @@ module.exports = React.createClass({
var power;
if (this.props.member && this.props.member.powerLevelNorm > 0) {
var img = "img/p/p" + Math.floor(20 * this.props.member.powerLevelNorm / 100) + ".png";
- power = <img src={ img } className="mx_MemberTile_power" width="48" height="48" alt=""/>;
+ power = <img src={ img } className="mx_MemberTile_power" width="44" height="44" alt=""/>;
}
var presenceClass = "mx_MemberTile_offline";
var mainClassName = "mx_MemberTile ";
@@ -177,7 +177,7 @@ module.exports = React.createClass({
return (
<div className={mainClassName} title={ this.getPowerLabel() } onClick={ this.onClick } onMouseEnter={ this.mouseEnter } onMouseLeave={ this.mouseLeave }>
<div className="mx_MemberTile_avatar">
- <MemberAvatar member={this.props.member} />
+ <MemberAvatar member={this.props.member} width="36" height="36" />
{ power }
</div>
{ nameEl }
diff --git a/src/skins/vector/views/molecules/MessageComposer.js b/src/skins/vector/views/molecules/MessageComposer.js
index c94cade5..67a0b18a 100644
--- a/src/skins/vector/views/molecules/MessageComposer.js
+++ b/src/skins/vector/views/molecules/MessageComposer.js
@@ -49,10 +49,10 @@ module.exports = React.createClass({
<div className="mx_MessageComposer_wrapper">
<div className="mx_MessageComposer_row">
<div className="mx_MessageComposer_avatar">
- <MemberAvatar member={me} />
+ <MemberAvatar member={me} width="24" height="24" />
</div>
<div className="mx_MessageComposer_input">
- <textarea ref="textarea" onKeyDown={this.onKeyDown} placeholder="Type a message" />
+ <textarea ref="textarea" onKeyDown={this.onKeyDown} placeholder="Type a message..." />
</div>
<div className="mx_MessageComposer_upload" onClick={this.onUploadClick}>
<img src="img/upload.png" width="32" height="32"/>
diff --git a/src/skins/vector/views/molecules/RoomTile.js b/src/skins/vector/views/molecules/RoomTile.js
index 39e7b43c..9b38bc57 100644
--- a/src/skins/vector/views/molecules/RoomTile.js
+++ b/src/skins/vector/views/molecules/RoomTile.js
@@ -84,7 +84,7 @@ module.exports = React.createClass({
return (
<div className={classes} onClick={this.onClick} onMouseEnter={this.onMouseEnter} onMouseLeave={this.onMouseLeave}>
<div className="mx_RoomTile_avatar">
- <RoomAvatar room={this.props.room} />
+ <RoomAvatar room={this.props.room} width="24" height="24" />
{ badge }
</div>
{ label }
diff --git a/src/skins/vector/views/organisms/LeftPanel.js b/src/skins/vector/views/organisms/LeftPanel.js
index a57f7a0a..90bcb9cd 100644
--- a/src/skins/vector/views/organisms/LeftPanel.js
+++ b/src/skins/vector/views/organisms/LeftPanel.js
@@ -40,7 +40,7 @@ module.exports = React.createClass({
classes += " collapsed";
}
else {
- collapseButton = <img className="mx_LeftPanel_hideButton" onClick={ this.onHideClick } src="img/hide.png" width="12" height="20" alt="<"/>
+ //collapseButton = <img className="mx_LeftPanel_hideButton" onClick={ this.onHideClick } src="img/hide.png" width="12" height="20" alt="<"/>
}
return (
diff --git a/src/skins/vector/views/organisms/MemberList.js b/src/skins/vector/views/organisms/MemberList.js
index 08f4e45c..62414002 100644
--- a/src/skins/vector/views/organisms/MemberList.js
+++ b/src/skins/vector/views/organisms/MemberList.js
@@ -103,7 +103,7 @@ module.exports = React.createClass({
} else {
return (
<div className={ classes } onClick={ this.onClickInvite } >
- <div className="mx_MemberTile_avatar"><img src="img/create-big.png" width="40" height="40" alt=""/></div>
+ <div className="mx_MemberTile_avatar"><img src="img/create-big.png" width="36" height="36" alt=""/></div>
<div className="mx_MemberTile_name">
<EditableText ref="invite" label="Invite" placeHolder="@user:domain.com" initialValue="" onValueChanged={this.onPopulateInvite}/>
</div>
@@ -127,12 +127,8 @@ module.exports = React.createClass({
}
return (
<div className="mx_MemberList">
- <div className="mx_MemberList_chevron">
- <img src="img/chevron.png" width="24" height="13"/>
- </div>
<div className="mx_MemberList_border">
<div>
- <h2>Members</h2>
<div className="mx_MemberList_wrapper">
{this.makeMemberTiles('join')}
</div>
diff --git a/src/skins/vector/views/organisms/RoomList.js b/src/skins/vector/views/organisms/RoomList.js
index dd8840e5..1532dfca 100644
--- a/src/skins/vector/views/organisms/RoomList.js
+++ b/src/skins/vector/views/organisms/RoomList.js
@@ -42,21 +42,21 @@ module.exports = React.createClass({
}
var recentsLabel = this.props.collapsed ?
- <img style={{cursor: 'pointer'}} onClick={ this.onShowClick } src="img/menu.png" width="27" height="20" alt=">"/> :
- "Recents";
+ <img style={{cursor: 'pointer'}} onClick={ this.onShowClick } src="img/menu.png" width="20" alt=">"/> :
+ "Recent";
return (
<div className="mx_RoomList" onScroll={this._repositionTooltip}>
{callElement}
- <h2 className="mx_RoomList_favourites_label">Favourites</h2>
+ <h2 className="mx_RoomList_favouritesLabel">Favourites</h2>
<RoomDropTarget text="Drop here to favourite"/>
- <h2 className="mx_RoomList_recents_label">{ recentsLabel }</h2>
+ <h2 className="mx_RoomList_recentsLabel">{ recentsLabel }</h2>
<div className="mx_RoomList_recents">
{this.makeRoomTiles()}
</div>
- <h2 className="mx_RoomList_archive_label">Archive</h2>
+ <h2 className="mx_RoomList_archiveLabel">Archive</h2>
<RoomDropTarget text="Drop here to archive"/>
</div>
);
diff --git a/src/skins/vector/views/organisms/RoomView.js b/src/skins/vector/views/organisms/RoomView.js
index f62eb3c3..391cef6f 100644
--- a/src/skins/vector/views/organisms/RoomView.js
+++ b/src/skins/vector/views/organisms/RoomView.js
@@ -238,6 +238,7 @@ module.exports = React.createClass({
</div>
<div className="mx_RoomView_statusArea">
<div className="mx_RoomView_statusAreaBox">
+ <div className="mx_RoomView_statusAreaBox_line"></div>
{statusBar}
</div>
</div>
diff --git a/vector/index.html b/vector/index.html
index 2985994b..d893523e 100644
--- a/vector/index.html
+++ b/vector/index.html
@@ -3,7 +3,7 @@
<head>
<meta charset="utf-8">
<title>Vector</title>
- <link href='fonts/Lato.css' rel='stylesheet' type='text/css'>
+ <link href='fonts/MyriadPro.css' rel='stylesheet' type='text/css'>
<link rel="apple-touch-icon" sizes="57x57" href="/icons/apple-touch-icon-57x57.png">
<link rel="apple-touch-icon" sizes="60x60" href="/icons/apple-touch-icon-60x60.png">
<link rel="apple-touch-icon" sizes="72x72" href="/icons/apple-touch-icon-72x72.png">