mirrors/element-web
1
0
Fork 0
mirror of https://github.com/element-hq/element-web synced 2024-11-23 17:56:01 +03:00
Code Issues Projects Releases Packages Wiki Activity

Add display name tooltip to the facepile avatars

Browse source
This commit is contained in:
Michael Telatynski 2021-03-26 00:05:05 +00:00
parent 1b22cc8f6d
commit 09601f1071
2 changed files with 8 additions and 5 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

6
res/css/views/elements/_FacePile.scss
View file

@ -20,10 +20,8 @@ limitations under the License.
flex-direction: row-reverse;
vertical-align: middle;
.mx_BaseAvatar {
& + .mx_BaseAvatar {
margin-right: -10px;
}
> span + span {
margin-right: -8px;
}
.mx_BaseAvatar_image {

7
src/components/views/elements/FacePile.tsx
View file

@ -20,6 +20,7 @@ import { Room } from "matrix-js-sdk/src/models/room";
import MemberAvatar from "../avatars/MemberAvatar";
import { _t } from "../../../languageHandler";
import DMRoomMap from "../../../utils/DMRoomMap";
import TextWithTooltip from "../elements/TextWithTooltip";
const DEFAULT_NUM_FACES = 5;
@ -38,7 +39,11 @@ const FacePile = ({ room, numShown = DEFAULT_NUM_FACES }: IProps) => {
return <div className="mx_FacePile">
<div className="mx_FacePile_faces">
{ shownMembers.map(member => <MemberAvatar key={member.userId} member={member} width={28} height={28} />) }
{ shownMembers.map(member => {
return <TextWithTooltip key={member.userId} tooltip={member.name}>
<MemberAvatar member={member} width={28} height={28} />
</TextWithTooltip>;
}) }
</div>
<span>
{ _t("%(count)s people you know have already joined", { count: knownMembers.length }) }