Support the new memberlist in Diasambiguated profile
1. Use MemberInfo instead of RoomMember 2. CSS changes to reflect the new designmidhun/member-redesign-accessibility
parent
6eb51b34bf
commit
697d15a211
|
@ -21,8 +21,29 @@ Please see LICENSE files in the repository root for full details.
|
||||||
}
|
}
|
||||||
|
|
||||||
.mx_DisambiguatedProfile_mxid {
|
.mx_DisambiguatedProfile_mxid {
|
||||||
margin-inline-start: 5px;
|
|
||||||
color: $secondary-content;
|
color: $secondary-content;
|
||||||
font-size: var(--cpd-font-size-body-sm);
|
font-size: var(--cpd-font-size-body-sm);
|
||||||
|
margin-inline-start: 5px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
/** Disambiguated profile needs to have a different layout in the member tile */
|
||||||
|
.mx_MemberTileView .mx_DisambiguatedProfile {
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
|
||||||
|
.mx_DisambiguatedProfile_mxid {
|
||||||
|
margin-inline-start: 0;
|
||||||
|
font: var(--cpd-font-body-sm-regular);
|
||||||
|
}
|
||||||
|
|
||||||
|
span:not(.mx_DisambiguatedProfile_mxid) {
|
||||||
|
/**
|
||||||
|
In a member tile, this span element is a flex child and so
|
||||||
|
we need the following for text overflow to work.
|
||||||
|
**/
|
||||||
|
overflow: hidden;
|
||||||
|
text-overflow: ellipsis;
|
||||||
|
white-space: nowrap;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
|
@ -8,15 +8,21 @@ Please see LICENSE files in the repository root for full details.
|
||||||
*/
|
*/
|
||||||
|
|
||||||
import React from "react";
|
import React from "react";
|
||||||
import { RoomMember } from "matrix-js-sdk/src/matrix";
|
|
||||||
import classNames from "classnames";
|
import classNames from "classnames";
|
||||||
|
|
||||||
import { _t } from "../../../languageHandler";
|
import { _t } from "../../../languageHandler";
|
||||||
import { getUserNameColorClass } from "../../../utils/FormattingUtils";
|
import { getUserNameColorClass } from "../../../utils/FormattingUtils";
|
||||||
import UserIdentifier from "../../../customisations/UserIdentifier";
|
import UserIdentifier from "../../../customisations/UserIdentifier";
|
||||||
|
|
||||||
|
interface MemberInfo {
|
||||||
|
userId: string;
|
||||||
|
roomId: string;
|
||||||
|
rawDisplayName?: string;
|
||||||
|
disambiguate: boolean;
|
||||||
|
}
|
||||||
|
|
||||||
interface IProps {
|
interface IProps {
|
||||||
member?: RoomMember | null;
|
member?: MemberInfo | null;
|
||||||
fallbackName: string;
|
fallbackName: string;
|
||||||
onClick?(): void;
|
onClick?(): void;
|
||||||
colored?: boolean;
|
colored?: boolean;
|
||||||
|
|
Loading…
Reference in New Issue