From b15def84bccfbd39a277d8c7d2f5df2b9630944e Mon Sep 17 00:00:00 2001 From: Matthew Hodgson Date: Sun, 8 Nov 2015 12:48:23 +0000 Subject: [PATCH] fix spacing of the layout to match latest designs --- src/skins/vector/css/molecules/EventTile.css | 4 ++-- src/skins/vector/css/molecules/MessageComposer.css | 2 +- src/skins/vector/css/molecules/RoomHeader.css | 5 +++-- src/skins/vector/css/organisms/RoomView.css | 12 ++++++------ src/skins/vector/css/pages/MatrixChat.css | 4 ++-- src/skins/vector/views/atoms/RoomAvatar.js | 4 ++-- src/skins/vector/views/organisms/RoomView.js | 1 + 7 files changed, 17 insertions(+), 15 deletions(-) diff --git a/src/skins/vector/css/molecules/EventTile.css b/src/skins/vector/css/molecules/EventTile.css index eb59711e8..a17acd97a 100644 --- a/src/skins/vector/css/molecules/EventTile.css +++ b/src/skins/vector/css/molecules/EventTile.css @@ -18,13 +18,13 @@ limitations under the License. max-width: 100%; clear: both; margin-top: 24px; - margin-left: 56px; + margin-left: 65px; } .mx_EventTile_avatar { padding-left: 18px; padding-right: 12px; - margin-left: -64px; + margin-left: -73px; margin-top: -4px; float: left; } diff --git a/src/skins/vector/css/molecules/MessageComposer.css b/src/skins/vector/css/molecules/MessageComposer.css index 44e122762..b145fd517 100644 --- a/src/skins/vector/css/molecules/MessageComposer.css +++ b/src/skins/vector/css/molecules/MessageComposer.css @@ -32,7 +32,7 @@ limitations under the License. .mx_MessageComposer .mx_MessageComposer_avatar { display: table-cell; padding-left: 10px; - padding-right: 20px; + padding-right: 29px; height: 70px; } diff --git a/src/skins/vector/css/molecules/RoomHeader.css b/src/skins/vector/css/molecules/RoomHeader.css index 2eeda2417..e86bab2e1 100644 --- a/src/skins/vector/css/molecules/RoomHeader.css +++ b/src/skins/vector/css/molecules/RoomHeader.css @@ -33,6 +33,7 @@ limitations under the License. .mx_RoomHeader_leftRow { height: 48px; margin-top: 18px; + margin-left: -2px; -webkit-box-ordinal-group: 1; -moz-box-ordinal-group: 1; @@ -103,7 +104,7 @@ limitations under the License. color: #454545; font-weight: 800; font-size: 24px; - padding-left: 8px; + padding-left: 19px; padding-right: 16px; text-overflow: ellipsis; } @@ -153,7 +154,7 @@ limitations under the License. max-height: 38px; color: #454545; font-weight: 300; - padding-left: 8px; + padding-left: 19px; padding-right: 16px; overflow: hidden; text-overflow: ellipsis; diff --git a/src/skins/vector/css/organisms/RoomView.css b/src/skins/vector/css/organisms/RoomView.css index d564b0862..11baad469 100644 --- a/src/skins/vector/css/organisms/RoomView.css +++ b/src/skins/vector/css/organisms/RoomView.css @@ -129,7 +129,7 @@ limitations under the License. clear: both; margin-top: 32px; margin-bottom: 8px; - margin-left: 54px; + margin-left: 63px; padding-bottom: 6px; border-bottom: 1px solid #eee; } @@ -169,7 +169,7 @@ limitations under the License. .mx_RoomView_statusAreaBox_line { border-top: 1px solid #eee; - margin-left: 54px; + margin-left: 63px; height: 1px; } @@ -187,14 +187,14 @@ limitations under the License. .mx_RoomView_typingBar { margin-top: 10px; - margin-left: 54px; + margin-left: 63px; color: #4a4a4a; opacity: 0.5; } .mx_RoomView_typingImage { display: inline; - margin-left: -38px; + margin-left: -47px; margin-top: -4px; float: left; } @@ -214,7 +214,7 @@ limitations under the License. .mx_RoomView_uploadProgressOuter { height: 4px; - margin-left: 54px; + margin-left: 63px; margin-top: -1px; } @@ -225,7 +225,7 @@ limitations under the License. .mx_RoomView_uploadFilename { margin-top: 5px; - margin-left: 56px; + margin-left: 65px; opacity: 0.5; color: #4a4a4a; } diff --git a/src/skins/vector/css/pages/MatrixChat.css b/src/skins/vector/css/pages/MatrixChat.css index f649aa245..cceade1da 100644 --- a/src/skins/vector/css/pages/MatrixChat.css +++ b/src/skins/vector/css/pages/MatrixChat.css @@ -87,8 +87,8 @@ limitations under the License. -webkit-order: 2; order: 2; - padding-left: 12px; - padding-right: 12px; + padding-left: 25px; + padding-right: 22px; background-color: #fff; -webkit-flex: 1; diff --git a/src/skins/vector/views/atoms/RoomAvatar.js b/src/skins/vector/views/atoms/RoomAvatar.js index a1d87f7fa..f076be476 100644 --- a/src/skins/vector/views/atoms/RoomAvatar.js +++ b/src/skins/vector/views/atoms/RoomAvatar.js @@ -43,8 +43,8 @@ module.exports = React.createClass({ render: function() { var style = { - maxWidth: this.props.width, - maxHeight: this.props.height, + width: this.props.width, + weight: this.props.height, }; return (