PrivateCoffee/element-web
4
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions 3

colored inviter name and layout

Browse source
This commit is contained in:
Bruno Windels 2019-04-17 10:22:35 +02:00
parent eeaa7143ac
commit 8a371080d7
2 changed files with 19 additions and 11 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

9
res/css/views/rooms/_RoomPreviewBar.scss
View file

@ -100,15 +100,22 @@ limitations under the License.
flex-direction: column; flex-direction: column;
&>* { &>* {
margin: 10px; margin: 5px 0 20px 0;
} }
} }
.mx_RoomPreviewBar_actions { .mx_RoomPreviewBar_actions {
flex-direction: column-reverse; flex-direction: column-reverse;
.mx_AccessibleButton {
padding: 7px 50px;//extra wide
}
&>* { &>* {
margin-top: 12px; margin-top: 12px;
} }
} }
} }
.mx_RoomPreviewBar_inviter {
font-weight: 600;
}

19
src/components/views/rooms/RoomPreviewBar.js
View file

@ -24,6 +24,7 @@ import MatrixClientPeg from '../../../MatrixClientPeg';
import dis from '../../../dispatcher'; import dis from '../../../dispatcher';
import classNames from 'classnames'; import classNames from 'classnames';
import { _t } from '../../../languageHandler'; import { _t } from '../../../languageHandler';
import {getUserNameColorClass} from '../../../utils/FormattingUtils';
const MessageCase = Object.freeze({ const MessageCase = Object.freeze({
NotLoggedIn: "NotLoggedIn", NotLoggedIn: "NotLoggedIn",
@ -316,21 +317,21 @@ module.exports = React.createClass({
case MessageCase.Invite: { case MessageCase.Invite: {
const inviteMember = this._getInviteMember(); const inviteMember = this._getInviteMember();
let avatar; let avatar;
let memberName; let inviterElement;
if (inviteMember) { if (inviteMember) {
const MemberAvatar = sdk.getComponent("views.avatars.MemberAvatar"); const MemberAvatar = sdk.getComponent("views.avatars.MemberAvatar");
avatar = (<MemberAvatar member={inviteMember} />); avatar = (<MemberAvatar member={inviteMember} viewUserOnClick={true} />);
memberName = inviteMember.name; const colorClass = getUserNameColorClass(inviteMember.userId);
inviterElement = (<span className={`mx_RoomPreviewBar_inviter ${colorClass}`}>{inviteMember.name}</span>);
} else { } else {
memberName = this.props.inviterName; inviterElement = this.props.inviterName;
} }
if (this.props.canPreview) {
title = <span>{avatar}{_t("<userName/> invited you to this room", {}, {userName: name => <strong>{memberName}</strong>})}</span>;
} else {
title = _t("Do you want to join this room?"); title = _t("Do you want to join this room?");
subTitle = <span>{avatar}{_t("<userName/> invited you", {}, {userName: name => <strong>{memberName}</strong>})}</span>; subTitle = [
} avatar,
_t("<userName/> invited you", {}, {userName: () => inviterElement}),
];
primaryActionLabel = _t("Accept"); primaryActionLabel = _t("Accept");
primaryActionHandler = this.props.onJoinClick; primaryActionHandler = this.props.onJoinClick;