UI: minor tweaks to new message participants list (#6328)

* Icon for button
* Display name when editing on mobile
* Always display name on mobile when less/or 4 participants involved
This commit is contained in:
Joffrey JAFFEUX
2018-08-29 10:07:49 +02:00
committed by GitHub
parent 720726ea68
commit ad34bdca09
3 changed files with 25 additions and 11 deletions

View File

@ -142,13 +142,24 @@ export default createWidget("private-message-map", {
); );
} }
const result = [h("div.participants", participants)]; let hideNamesClass = "";
if (
!this.state.isEditing &&
this.site.mobileView &&
Ember.makeArray(participants[0]).length > 4
) {
hideNamesClass = ".hide-names";
}
const result = [h(`div.participants${hideNamesClass}`, participants)];
const controls = [ const controls = [
this.attach("button", { this.attach("button", {
action: "toggleEditing", action: "toggleEditing",
label: "private_message_info.edit", label: "private_message_info.edit",
className: "btn" icon: "user",
iconRight: true,
className: "btn add-remove-participant-btn"
}) })
]; ];

View File

@ -346,6 +346,13 @@ aside.quote {
align-items: center; align-items: center;
margin-bottom: 0.5em; margin-bottom: 0.5em;
&.hide-names .user {
.username,
.group-name {
display: none;
}
}
.user { .user {
border: 1px solid $primary-low; border: 1px solid $primary-low;
border-radius: 0.25em; border-radius: 0.25em;
@ -373,10 +380,6 @@ aside.quote {
.username, .username,
.group-name { .group-name {
margin-right: 0.25em; margin-right: 0.25em;
@include breakpoint(mobile) {
display: none;
}
} }
&:last-child { &:last-child {
@ -392,11 +395,11 @@ aside.quote {
border-radius: 0 0.25em 0.25em 0; border-radius: 0 0.25em 0.25em 0;
} }
} }
}
.edit-participants-btn { .add-remove-participant-btn {
margin: 0.125em 0 0.125em 0; .d-icon {
align-self: flex-start; margin-left: 0.25em;
border-radius: 0.25em;
} }
} }
} }

View File

@ -1130,7 +1130,7 @@ en:
private_message_info: private_message_info:
title: "Message" title: "Message"
invite: "Invite Others..." invite: "Invite Others..."
edit: "Add or remove participants..." edit: "Add or remove"
leave_message: "Do you really want to leave this message?" leave_message: "Do you really want to leave this message?"
remove_allowed_user: "Do you really want to remove {{name}} from this message?" remove_allowed_user: "Do you really want to remove {{name}} from this message?"
remove_allowed_group: "Do you really want to remove {{name}} from this message?" remove_allowed_group: "Do you really want to remove {{name}} from this message?"