FIX: Move granted badges to the end of the post header. (#30095)

This commit is contained in:
Gary Pendergast 2024-12-05 09:22:03 +11:00 committed by GitHub
parent 111a922a69
commit bb2e9645f2
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
2 changed files with 42 additions and 36 deletions

View File

@ -141,29 +141,6 @@ export default createWidget("poster-name", {
}
}
if (attrs.badgesGranted?.length) {
const badges = [];
attrs.badgesGranted.forEach((badge) => {
// Alter the badge description to show that the badge was granted for this post.
badge.description = i18n("post.badge_granted_tooltip", {
username: attrs.username,
badge_name: badge.name,
});
const badgeIcon = new RenderGlimmer(
this,
`span.user-badge-button-${badge.slug}`,
hbs`<UserBadge @badge={{@data.badge}} @user={{@data.user}} @showName={{false}} />`,
{
badge,
user: attrs.user,
}
);
badges.push(badgeIcon);
});
nameContents.push(h("span.user-badge-buttons", badges));
}
const afterNameContents =
applyDecorators(this, "after-name", attrs, this.state) || [];
@ -173,10 +150,7 @@ export default createWidget("poster-name", {
h("span", { className: classNames.join(" ") }, nameContents),
];
if (!this.settings.showNameAndGroup) {
return contents;
}
if (this.settings.showNameAndGroup) {
if (
name &&
this.siteSettings.display_name_on_posts &&
@ -197,6 +171,32 @@ export default createWidget("poster-name", {
if (this.siteSettings.enable_user_status) {
this.addUserStatus(contents, attrs);
}
}
if (attrs.badgesGranted?.length) {
const badges = [];
attrs.badgesGranted.forEach((badge) => {
// Alter the badge description to show that the badge was granted for this post.
badge.description = i18n("post.badge_granted_tooltip", {
username: attrs.username,
badge_name: badge.name,
});
const badgeIcon = new RenderGlimmer(
this,
`span.user-badge-button-${badge.slug}`,
hbs`<UserBadge @badge={{@data.badge}} @user={{@data.user}} @showName={{false}} />`,
{
badge,
user: attrs.user,
}
);
badges.push(badgeIcon);
});
contents.push(h("span.user-badge-buttons", badges));
}
return contents;
},

View File

@ -257,10 +257,15 @@
.names {
margin-right: auto;
.first {
flex-shrink: 0;
}
}
.user-badge-buttons {
margin-left: 15px;
display: flex;
flex-shrink: 0;
a {
background: none;
@ -278,8 +283,9 @@
align-items: center;
}
.user-status-message {
.user-status-message-wrap {
display: flex;
flex-shrink: 0;
img.emoji {
width: 1em;