Fix notifications warning layout

For some reason, Chrome doesn't seem to make the central div in the
notifications warning wide enough, so it ends up wrapping. Fix this by making
the central div expand across the available space, instead of letting the
container for the close button do it.

Fixes https://github.com/vector-im/vector-web/issues/1687
This commit is contained in:
Richard van der Hoff 2016-08-01 10:31:58 +01:00
parent fd53f10fbd
commit 3860488bb5
2 changed files with 6 additions and 5 deletions

View file

@ -35,7 +35,7 @@ module.exports = React.createClass({
return (
<div className="mx_MatrixToolbar">
<img className="mx_MatrixToolbar_warning" src="img/warning.svg" width="24" height="23" alt="/!\"/>
<div>
<div className="mx_MatrixToolbar_content">
You are not receiving desktop notifications. <a className="mx_MatrixToolbar_link" onClick={ this.onClick }>Enable them now</a>
</div>
<div className="mx_MatrixToolbar_close"><img src="img/cancel.svg" width="18" height="18" onClick={ this.hideToolbar } /></div>
@ -43,4 +43,3 @@ module.exports = React.createClass({
);
}
});

View file

@ -33,6 +33,11 @@ limitations under the License.
margin-top: -2px;
}
.mx_MatrixToolbar_content {
-webkit-flex: 1;
flex: 1;
}
.mx_MatrixToolbar_link
{
color: #fff ! important;
@ -41,10 +46,7 @@ limitations under the License.
}
.mx_MatrixToolbar_close {
-webkit-flex: 1;
flex: 1;
cursor: pointer;
text-align: right;
}
.mx_MatrixToolbar_close img {