forked from matrix/element-web
dodgy fudge to put the edit button alongside the read receipts. in future I think we should turn it into a chevron next to the timestamp
This commit is contained in:
parent
d66006893a
commit
6e3afcde53
|
@ -91,9 +91,9 @@ limitations under the License.
|
||||||
.mx_EventTile_msgOption {
|
.mx_EventTile_msgOption {
|
||||||
float: right;
|
float: right;
|
||||||
text-align: right;
|
text-align: right;
|
||||||
margin-right: 10px;
|
|
||||||
z-index: 1;
|
z-index: 1;
|
||||||
position: relative;
|
position: relative;
|
||||||
|
width: 100px;
|
||||||
}
|
}
|
||||||
|
|
||||||
.mx_MessageTimestamp {
|
.mx_MessageTimestamp {
|
||||||
|
@ -111,10 +111,9 @@ limitations under the License.
|
||||||
}
|
}
|
||||||
|
|
||||||
.mx_EventTile_editButton {
|
.mx_EventTile_editButton {
|
||||||
display: block;
|
position: absolute;
|
||||||
|
display: inline-block;
|
||||||
visibility: hidden;
|
visibility: hidden;
|
||||||
margin-left: auto;
|
|
||||||
margin-right: 0px;
|
|
||||||
}
|
}
|
||||||
|
|
||||||
.mx_EventTile:hover .mx_EventTile_editButton {
|
.mx_EventTile:hover .mx_EventTile_editButton {
|
||||||
|
|
|
@ -172,15 +172,22 @@ module.exports = React.createClass({
|
||||||
if (remainder > 0) {
|
if (remainder > 0) {
|
||||||
remText = <span className="mx_EventTile_readAvatarRemainder"
|
remText = <span className="mx_EventTile_readAvatarRemainder"
|
||||||
onClick={this.toggleAllReadAvatars}
|
onClick={this.toggleAllReadAvatars}
|
||||||
style={ {left: left} }>+{ remainder }
|
style={{ left: left }}>{ remainder }+
|
||||||
</span>;
|
</span>;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
var editButton = (
|
||||||
|
<input style={{ left: left+15 }}
|
||||||
|
type="image" src="img/edit.png" alt="Edit" width="14" height="14"
|
||||||
|
className="mx_EventTile_editButton" onClick={this.onEditClicked} />
|
||||||
|
);
|
||||||
|
|
||||||
return <span className="mx_EventTile_readAvatars" ref={this.collectReadAvatarNode}>
|
return <span className="mx_EventTile_readAvatars" ref={this.collectReadAvatarNode}>
|
||||||
{remText}
|
{ editButton }
|
||||||
<Velociraptor transition={reorderTransitionOpts}>
|
{ remText }
|
||||||
{avatars}
|
<Velociraptor transition={ reorderTransitionOpts }>
|
||||||
|
{ avatars }
|
||||||
</Velociraptor>
|
</Velociraptor>
|
||||||
</span>;
|
</span>;
|
||||||
},
|
},
|
||||||
|
@ -217,12 +224,6 @@ module.exports = React.createClass({
|
||||||
menu: this.state.menu,
|
menu: this.state.menu,
|
||||||
});
|
});
|
||||||
var timestamp = <MessageTimestamp ts={this.props.mxEvent.getTs()} />
|
var timestamp = <MessageTimestamp ts={this.props.mxEvent.getTs()} />
|
||||||
var editButton = (
|
|
||||||
<input
|
|
||||||
type="image" src="img/edit.png" alt="Edit" width="14" height="14"
|
|
||||||
className="mx_EventTile_editButton" onClick={this.onEditClicked}
|
|
||||||
/>
|
|
||||||
);
|
|
||||||
|
|
||||||
var aux = null;
|
var aux = null;
|
||||||
if (msgtype === 'm.image') aux = "sent an image";
|
if (msgtype === 'm.image') aux = "sent an image";
|
||||||
|
@ -247,7 +248,6 @@ module.exports = React.createClass({
|
||||||
return (
|
return (
|
||||||
<div className={classes}>
|
<div className={classes}>
|
||||||
<div className="mx_EventTile_msgOption">
|
<div className="mx_EventTile_msgOption">
|
||||||
{ editButton }
|
|
||||||
{ timestamp }
|
{ timestamp }
|
||||||
{ readAvatars }
|
{ readAvatars }
|
||||||
</div>
|
</div>
|
||||||
|
|
Loading…
Reference in New Issue