lipstick for hangup button and typing notifs
This commit is contained in:
parent
0a3cddbd89
commit
dcecdc8260
6 changed files with 45 additions and 8 deletions
|
@ -55,6 +55,8 @@ limitations under the License.
|
||||||
|
|
||||||
.mx_MemberInfo_field {
|
.mx_MemberInfo_field {
|
||||||
padding: 6px;
|
padding: 6px;
|
||||||
|
overflow: hidden;
|
||||||
|
text-overflow: ellipsis;
|
||||||
}
|
}
|
||||||
|
|
||||||
.mx_MemberInfo_button {
|
.mx_MemberInfo_button {
|
||||||
|
|
|
@ -43,6 +43,26 @@ limitations under the License.
|
||||||
width: 100%;
|
width: 100%;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.mx_RoomHeader_hangupButton {
|
||||||
|
height: 48px;
|
||||||
|
margin-top: 18px;
|
||||||
|
background-color: #80cef4;
|
||||||
|
border-radius: 48px;
|
||||||
|
margin-right: 8px;
|
||||||
|
color: #fff;
|
||||||
|
line-height: 48px;
|
||||||
|
text-align: center;
|
||||||
|
|
||||||
|
-webkit-box-ordinal-group: 2;
|
||||||
|
-moz-box-ordinal-group: 2;
|
||||||
|
-ms-flex-order: 2;
|
||||||
|
-webkit-order: 2;
|
||||||
|
order: 2;
|
||||||
|
|
||||||
|
-webkit-flex: 0 0 90px;
|
||||||
|
flex: 0 0 90px;
|
||||||
|
}
|
||||||
|
|
||||||
.mx_RoomHeader_rightRow {
|
.mx_RoomHeader_rightRow {
|
||||||
height: 48px;
|
height: 48px;
|
||||||
margin-top: 18px;
|
margin-top: 18px;
|
||||||
|
@ -50,11 +70,11 @@ limitations under the License.
|
||||||
border-radius: 48px;
|
border-radius: 48px;
|
||||||
border: 1px solid #a9dbf4;
|
border: 1px solid #a9dbf4;
|
||||||
|
|
||||||
-webkit-box-ordinal-group: 2;
|
-webkit-box-ordinal-group: 3;
|
||||||
-moz-box-ordinal-group: 2;
|
-moz-box-ordinal-group: 3;
|
||||||
-ms-flex-order: 2;
|
-ms-flex-order: 3;
|
||||||
-webkit-order: 2;
|
-webkit-order: 3;
|
||||||
order: 2;
|
order: 3;
|
||||||
|
|
||||||
-webkit-flex: 0 0 200px;
|
-webkit-flex: 0 0 200px;
|
||||||
flex: 0 0 200px;
|
flex: 0 0 200px;
|
||||||
|
|
|
@ -105,6 +105,20 @@ limitations under the License.
|
||||||
border-top: 1px solid #a8dbf3;
|
border-top: 1px solid #a8dbf3;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.mx_RoomView_typingBar {
|
||||||
|
margin-top: 17px;
|
||||||
|
margin-left: 56px;
|
||||||
|
color: #818794;
|
||||||
|
}
|
||||||
|
|
||||||
|
.mx_RoomView_typingBar img {
|
||||||
|
padding-left: 12px;
|
||||||
|
padding-right: 12px;
|
||||||
|
margin-left: -64px;
|
||||||
|
margin-top: -7px;
|
||||||
|
float: left;
|
||||||
|
}
|
||||||
|
|
||||||
.mx_RoomView .mx_MessageComposer {
|
.mx_RoomView .mx_MessageComposer {
|
||||||
-webkit-box-ordinal-group: 5;
|
-webkit-box-ordinal-group: 5;
|
||||||
-moz-box-ordinal-group: 5;
|
-moz-box-ordinal-group: 5;
|
||||||
|
|
BIN
skins/base/img/typing.png
Normal file
BIN
skins/base/img/typing.png
Normal file
Binary file not shown.
After Width: | Height: | Size: 236 B |
|
@ -44,8 +44,8 @@ module.exports = React.createClass({
|
||||||
case "ringback":
|
case "ringback":
|
||||||
case "connected":
|
case "connected":
|
||||||
callButtons = (
|
callButtons = (
|
||||||
<div className="mx_RoomHeader_button" onClick={this.onHangupClick}>
|
<div className="mx_RoomHeader_hangupButton" onClick={this.onHangupClick}>
|
||||||
BYEBYE
|
End call
|
||||||
</div>
|
</div>
|
||||||
);
|
);
|
||||||
break;
|
break;
|
||||||
|
@ -66,6 +66,7 @@ module.exports = React.createClass({
|
||||||
{ topic }
|
{ topic }
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
{callButtons}
|
||||||
<div className="mx_RoomHeader_rightRow">
|
<div className="mx_RoomHeader_rightRow">
|
||||||
<div className="mx_RoomHeader_button">
|
<div className="mx_RoomHeader_button">
|
||||||
<img src="img/settings.png" width="32" height="32"/>
|
<img src="img/settings.png" width="32" height="32"/>
|
||||||
|
@ -73,7 +74,6 @@ module.exports = React.createClass({
|
||||||
<div className="mx_RoomHeader_button">
|
<div className="mx_RoomHeader_button">
|
||||||
<img src="img/search.png" width="32" height="32"/>
|
<img src="img/search.png" width="32" height="32"/>
|
||||||
</div>
|
</div>
|
||||||
{callButtons}
|
|
||||||
<div className="mx_RoomHeader_button" onClick={this.onVideoClick}>
|
<div className="mx_RoomHeader_button" onClick={this.onVideoClick}>
|
||||||
<img src="img/video.png" width="32" height="32"/>
|
<img src="img/video.png" width="32" height="32"/>
|
||||||
</div>
|
</div>
|
||||||
|
|
|
@ -97,6 +97,7 @@ module.exports = React.createClass({
|
||||||
if (typingString) {
|
if (typingString) {
|
||||||
statusBar = (
|
statusBar = (
|
||||||
<div className="mx_RoomView_typingBar">
|
<div className="mx_RoomView_typingBar">
|
||||||
|
<img src="img/typing.png" width="40" height="40" alt=""/>
|
||||||
{typingString}
|
{typingString}
|
||||||
</div>
|
</div>
|
||||||
);
|
);
|
||||||
|
|
Loading…
Reference in a new issue