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,8 +141,41 @@ export default createWidget("poster-name", {
}
}
const afterNameContents =
applyDecorators(this, "after-name", attrs, this.state) || [];
nameContents = nameContents.concat(afterNameContents);
const contents = [
h("span", { className: classNames.join(" ") }, nameContents),
];
if (this.settings.showNameAndGroup) {
if (
name &&
this.siteSettings.display_name_on_posts &&
sanitizeName(name) !== sanitizeName(username)
) {
contents.push(
h(
"span.second." + (nameFirst ? "username" : "full-name"),
[this.userLink(attrs, nameFirst ? username : name)].concat(
afterNameContents
)
)
);
}
this.buildTitleObject(attrs, contents);
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", {
@ -161,41 +194,8 @@ export default createWidget("poster-name", {
);
badges.push(badgeIcon);
});
nameContents.push(h("span.user-badge-buttons", badges));
}
const afterNameContents =
applyDecorators(this, "after-name", attrs, this.state) || [];
nameContents = nameContents.concat(afterNameContents);
const contents = [
h("span", { className: classNames.join(" ") }, nameContents),
];
if (!this.settings.showNameAndGroup) {
return contents;
}
if (
name &&
this.siteSettings.display_name_on_posts &&
sanitizeName(name) !== sanitizeName(username)
) {
contents.push(
h(
"span.second." + (nameFirst ? "username" : "full-name"),
[this.userLink(attrs, nameFirst ? username : name)].concat(
afterNameContents
)
)
);
}
this.buildTitleObject(attrs, contents);
if (this.siteSettings.enable_user_status) {
this.addUserStatus(contents, attrs);
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;