diff --git a/.gitignore b/.gitignore index a28ca6b14..13466ce84 100644 --- a/.gitignore +++ b/.gitignore @@ -1,8 +1,3 @@ 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 381eb2cb7..aff9666e9 100644 --- a/src/skins/vector/css/common.css +++ b/src/skins/vector/css/common.css @@ -22,7 +22,7 @@ html { } body { - font-family: 'Myriad Pro', Helvetica, Arial, Sans-Serif; + font-family: 'Lato', Helvetica, Arial, Sans-Serif; font-size: 16px; color: #454545; border: 0px; @@ -34,7 +34,7 @@ div.error { } h2 { - color: #454545; + color: #80cef4; font-weight: 400; font-size: 20px; margin-top: 16px; @@ -44,7 +44,7 @@ h2 { a:hover, a:link, a:visited { - color: #76cfa6; + color: #80CEF4; } .mx_ContextualMenu_background { @@ -149,7 +149,7 @@ a:visited { font-weight: 400; font-size: 16px; color: #fff; - background-color: #76cfa6; + background-color: #80cef4; 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 df437e975..fbc2db207 100644 --- a/src/skins/vector/css/hide.css +++ b/src/skins/vector/css/hide.css @@ -1,6 +1,6 @@ .mx_RoomDropTarget, -.mx_RoomList_favouritesLabel, -.mx_RoomList_archiveLabel, +.mx_RoomList_favourites_label, +.mx_RoomList_archive_label, .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 a9a5260c3..1cd2fa465 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: 18px; + padding-left: 12px; padding-right: 12px; margin-left: -64px; - margin-top: -4px; + margin-top: -7px; float: left; } @@ -48,8 +48,9 @@ limitations under the License. } .mx_EventTile .mx_MessageTimestamp { - color: #acacac; - font-size: 12px; + color: #454545; + opacity: 0.5; + font-size: 14px; float: right; } diff --git a/src/skins/vector/css/molecules/MImageTile.css b/src/skins/vector/css/molecules/MImageTile.css index 94f1c9198..10e5b50b6 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: #76cfa6; + color: #80cef4; cursor: pointer; } .mx_MImageTile_download a { - color: #76cfa6; + color: #80cef4; text-decoration: none; } diff --git a/src/skins/vector/css/molecules/MemberTile.css b/src/skins/vector/css/molecules/MemberTile.css index ca7525415..faae142ab 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: 36px; - height: 36px; + width: 40px; + height: 40px; position: relative; } @@ -60,8 +60,8 @@ limitations under the License. .mx_MemberTile_power { position: absolute; - width: 44px; - height: 44px; + width: 48px; + height: 48px; left: 10px; top: -1px; } diff --git a/src/skins/vector/css/molecules/MessageComposer.css b/src/skins/vector/css/molecules/MessageComposer.css index e7f6919cf..af4934ee2 100644 --- a/src/skins/vector/css/molecules/MessageComposer.css +++ b/src/skins/vector/css/molecules/MessageComposer.css @@ -15,29 +15,30 @@ limitations under the License. */ .mx_MessageComposer_wrapper { - max-width: 960px; - height: 70px; + max-width: 720px; + height: 50px; vertical-align: middle; margin: auto; background-color: #fff; - border-top: 2px solid #e1dddd; + border-radius: 25px; + border: 1px solid #a9dbf4; } .mx_MessageComposer_row { display: table-row; width: 100%; - height: 70px; + height: 50px; } .mx_MessageComposer .mx_MessageComposer_avatar { display: table-cell; - padding-left: 10px; - padding-right: 20px; - height: 70px; + padding-left: 5px; + padding-right: 10px; + height: 50px; } .mx_MessageComposer .mx_MessageComposer_avatar img { - margin-top: 18px; + margin-top: 5px; border-radius: 20px; background-color: #dbdbdb; } @@ -46,7 +47,7 @@ limitations under the License. display: table-cell; width: 100%; vertical-align: middle; - height: 70px; + height: 50px; } .mx_MessageComposer_input textarea { @@ -63,16 +64,12 @@ limitations under the License. box-shadow: none; /* needed for FF */ - font-family: 'Myriad Pro', Helvetica, Arial, Sans-Serif; + font-family: 'Lato', 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 6ae067a0b..f7adb6189 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: 960px; + max-width: 720px; margin: auto; height: 88px; - border-bottom: 1px solid #eeeeee; + border-bottom: 1px solid #a8dbf3; display: -webkit-box; display: -moz-box; @@ -47,7 +47,7 @@ limitations under the License. .mx_RoomHeader_textButton { height: 48px; margin-top: 18px; - background-color: #76cfa6; + background-color: #80cef4; border-radius: 48px; margin-right: 8px; color: #fff; @@ -92,7 +92,7 @@ limitations under the License. .mx_RoomHeader_simpleHeader { line-height: 88px; - color: #76cfa6; + color: #80cef4; 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: #454545; - font-weight: 800; + color: #80cef4; + font-weight: 400; 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: #454545; + color: #70b5d7; 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 a669c5b2d..3a66f0e90 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: #76cfa6; + background-color: #80cef4; 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 cc933226d..511fc94fa 100644 --- a/src/skins/vector/css/molecules/RoomTile.css +++ b/src/skins/vector/css/molecules/RoomTile.css @@ -17,19 +17,18 @@ limitations under the License. .mx_RoomTile { cursor: pointer; display: table-row; - font-size: 14px; + color: #818794; } .mx_RoomTile_avatar { display: table-cell; - background: #eaf5f0; - padding-right: 8px; + padding-right: 10px; padding-top: 3px; padding-bottom: 3px; - padding-left: 18px; + padding-left: 10px; vertical-align: middle; - width: 24px; - height: 24px; + width: 36px; + height: 36px; position: relative; } @@ -44,8 +43,6 @@ limitations under the License. overflow: hidden; text-overflow: ellipsis; padding-right: 16px; - color: #454545; - opacity: 0.8; } .collapsed .mx_RoomTile_name { @@ -66,7 +63,7 @@ limitations under the License. } .mx_RoomTile_badge { - background-color: #76cfa6; + background-color: #80cef4; color: #fff; border-radius: 26px; font-weight: 400; @@ -78,7 +75,6 @@ limitations under the License. } */ -/* .mx_RoomTile_badge { background-color: #ff0064; border: 3px solid #fff; @@ -89,37 +85,20 @@ 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 578c79e6e..d6b1765c3 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: 960px; + width: 720px; 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 67f00c358..0e7e077e4 100644 --- a/src/skins/vector/css/organisms/LeftPanel.css +++ b/src/skins/vector/css/organisms/LeftPanel.css @@ -53,20 +53,17 @@ limitations under the License. -webkit-order: 3; order: 3; - -webkit-flex: 0 0 126px; - flex: 0 0 126px; + -webkit-flex: 0 0 170px; + flex: 0 0 170px; + + border-top: 1px solid #f3f8fa; } .mx_LeftPanel .mx_BottomLeftMenu .mx_RoomTile { - color: #454545; + color: #378bb4; } .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 7320a127f..aab0def49 100644 --- a/src/skins/vector/css/organisms/MemberList.css +++ b/src/skins/vector/css/organisms/MemberList.css @@ -16,6 +16,8 @@ limitations under the License. .mx_MemberList { height: 100%; + margin-bottom: 100px; + padding: 8px; -webkit-flex: 1; flex: 1; @@ -37,7 +39,10 @@ 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 f53f05565..21985a257 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: 960px; + width: 720px; 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 89181b829..21cb78122 100644 --- a/src/skins/vector/css/organisms/RoomList.css +++ b/src/skins/vector/css/organisms/RoomList.css @@ -15,7 +15,6 @@ limitations under the License. */ .mx_RoomList { - padding-top: 24px; } .mx_RoomList_recents { @@ -25,15 +24,8 @@ limitations under the License. width: 100%; } -.mx_RoomList_recentsLabel img { - margin-left: 8px; -} - .mx_RoomList h2 { - text-transform: uppercase; - color: #3d3b39; - font-weight: 600; - font-size: 14px; - padding-left: 12px; - padding-right: 12px; -} + padding-left: 16px; + padding-right: 16px; + padding-bottom: 10px; +} \ No newline at end of file diff --git a/src/skins/vector/css/organisms/RoomView.css b/src/skins/vector/css/organisms/RoomView.css index 8ca008036..2aab203a4 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: 960px; + max-width: 720px; 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 #76cfa6; + border: 2px dashed #80cef4; border-bottom: none; position: absolute; top: 88px; @@ -84,12 +84,12 @@ limitations under the License. order: 2; min-width: 0px; - max-width: 960px; + max-width: 720px; width: 100%; margin: auto; overflow: auto; - border-bottom: 1px solid #eee; + border-bottom: 1px solid #a8dbf3; -webkit-flex: 0 0 auto; flex: 0 0 auto; @@ -111,7 +111,7 @@ limitations under the License. } .mx_RoomView_messageListWrapper { - max-width: 960px; + max-width: 720px; margin: auto; } @@ -129,9 +129,8 @@ limitations under the License. clear: both; margin-top: 32px; margin-bottom: 8px; - margin-left: 54px; padding-bottom: 6px; - border-bottom: 1px solid #eee; + border-bottom: 1px solid #a8dbf3; } .mx_RoomView_invitePrompt { @@ -142,7 +141,7 @@ limitations under the License. order: 2; min-width: 0px; - max-width: 960px; + max-width: 720px; width: 100%; margin: auto; @@ -158,19 +157,14 @@ limitations under the License. order: 4; width: 100%; - -webkit-flex: 0 0 36px; - flex: 0 0 36px; + -webkit-flex: 0 0 58px; + flex: 0 0 58px; } .mx_RoomView_statusAreaBox { - max-width: 960px; + max-width: 720px; margin: auto; -} - -.mx_RoomView_statusAreaBox_line { - border-top: 1px solid #eee; - margin-left: 54px; - height: 1px; + border-top: 1px solid #a8dbf3; } .mx_RoomView_unreadMessagesBar { @@ -211,8 +205,8 @@ limitations under the License. order: 5; width: 100%; - -webkit-flex: 0 0 70px; - flex: 0 0 70px; + -webkit-flex: 0 0 63px; + flex: 0 0 63px; margin-right: 2px; } @@ -223,7 +217,7 @@ limitations under the License. } .mx_RoomView_uploadProgressInner { - background-color: #76cfa6; + background-color: #80cef4; height: 4px; } diff --git a/src/skins/vector/css/organisms/UserSettings.css b/src/skins/vector/css/organisms/UserSettings.css index 2b0aca3d0..b69399b72 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: 960px; + width: 720px; 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 f649aa245..6fa0415af 100644 --- a/src/skins/vector/css/pages/MatrixChat.css +++ b/src/skins/vector/css/pages/MatrixChat.css @@ -69,8 +69,6 @@ limitations under the License. -webkit-order: 1; order: 1; - background-color: #eaf5f0; - -webkit-flex: 0 0 230px; flex: 0 0 230px; } @@ -89,7 +87,7 @@ limitations under the License. padding-left: 12px; padding-right: 12px; - background-color: #fff; + background-color: #f3f8fa; -webkit-flex: 1; flex: 1; @@ -116,6 +114,7 @@ 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 deleted file mode 100644 index f30c591f9..000000000 Binary files a/src/skins/vector/fonts/MyriadPro-Bold.woff and /dev/null differ diff --git a/src/skins/vector/fonts/MyriadPro-BoldIt.woff b/src/skins/vector/fonts/MyriadPro-BoldIt.woff deleted file mode 100644 index db605a6c7..000000000 Binary files a/src/skins/vector/fonts/MyriadPro-BoldIt.woff and /dev/null differ diff --git a/src/skins/vector/fonts/MyriadPro-It.woff b/src/skins/vector/fonts/MyriadPro-It.woff deleted file mode 100644 index 9a133bcde..000000000 Binary files a/src/skins/vector/fonts/MyriadPro-It.woff and /dev/null differ diff --git a/src/skins/vector/fonts/MyriadPro-Regular.woff b/src/skins/vector/fonts/MyriadPro-Regular.woff deleted file mode 100644 index 5a95583f8..000000000 Binary files a/src/skins/vector/fonts/MyriadPro-Regular.woff and /dev/null differ diff --git a/src/skins/vector/fonts/MyriadPro-SemiBold.woff b/src/skins/vector/fonts/MyriadPro-SemiBold.woff deleted file mode 100644 index 2a80f65db..000000000 Binary files a/src/skins/vector/fonts/MyriadPro-SemiBold.woff and /dev/null differ diff --git a/src/skins/vector/fonts/MyriadPro.css b/src/skins/vector/fonts/MyriadPro.css deleted file mode 100644 index 833e68281..000000000 --- a/src/skins/vector/fonts/MyriadPro.css +++ /dev/null @@ -1,20 +0,0 @@ -@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 b7307a11c..247b0030c 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 03cab69c4..bbcb16a4b 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 deleted file mode 100644 index 8931cba75..000000000 Binary files a/src/skins/vector/img/selected.png and /dev/null differ diff --git a/src/skins/vector/img/settings-big.png b/src/skins/vector/img/settings-big.png index cb2e0a62d..3be13bc71 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 4416a6b8a..39b995a7a 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 = [ '76cfa6', '50e2c2', 'f4c371' ]; + var images = [ '80cef4', '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 8c28058d1..2644769cc 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 (
- +
{ label }
diff --git a/src/skins/vector/views/molecules/EventTile.js b/src/skins/vector/views/molecules/EventTile.js index a086ad00e..534af3c7c 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 = (
- +
); } diff --git a/src/skins/vector/views/molecules/MemberTile.js b/src/skins/vector/views/molecules/MemberTile.js index 845d2a975..4c34fcb7a 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 = ; + power = ; } var presenceClass = "mx_MemberTile_offline"; var mainClassName = "mx_MemberTile "; @@ -177,7 +177,7 @@ module.exports = React.createClass({ return (
- + { power }
{ nameEl } diff --git a/src/skins/vector/views/molecules/MessageComposer.js b/src/skins/vector/views/molecules/MessageComposer.js index 67a0b18a1..c94cade5f 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({
- +
-