Primary group class not available on usercard and user page

Contribute Feature

AI-generated summary

The discussion revolves around customizing the appearance of a specific user group, DevTeam, on a Discourse forum. dax initially attempted to create a customization but encountered issues when the group was not a primary group. After changing the group to primary, dax was able to find the group ID and update the CSS code. However, the customization only works on topic pages and not on user cards and user main pages. dax provided the CSS code used for both the working and non-working customizations. riking has recategorized the issue as a feature request, suggesting it may be worth fixing.

1

Hi,
I want to create a customization for a group of users, DevTeam. It’s not a Primary group and users have different TL.
How can I do that?

It’s something like this:

I used Css to customize admins and mods group:

.username.staff a {
    background: #C30303;
    padding: 3px 6px;
    line-height: 1;
    border-radius: 2px;
    display: inline-block;
    color: #FFF;
}

.username.staff {
    max-width: initial !important;
}

.username.moderator .fa.fa-shield {
    display: none;
}

.username.staff::after, .user-main .fa.fa-shield::before, #user-card .fa.fa-shield::before {
    content: 'SupportTeam';
    margin-left: 5px;
    color: #FFF;
    background: #F68416;
    padding: 0 6px;
    border-radius: 2px;
    display: inline-block;
    
}

.extra-info .badge-wrapper .badge-category-parent {
    padding: 3px 6px;
    width: auto;
}

.extra-info .badge-wrapper .badge-category-parent:before {
    content: '';
}

.user-main .fa.fa-shield::before, #user-card .fa.fa-shield::before {
    font-size: 14px;
    padding: 5px 9px;
    position: absolute;
    width: 70px;
    margin-top: -20px;
}

 #user-card .fa.fa-shield::before {
    margin-left: 0;
    font-size: 11px;
    width: 55px;
}

but how to proceed now?

Where I found the group id?

How to show badges in the message list?
Bug when discobot assigns the name in the certificate
Display a banned icon on user avatar when suspended
2

I change the custom group in a primary group.
Now I can see the id group-DevTeam

And this is the code now:

    .username.DevTeam a {
    background: #C30303;
    padding: 3px 6px;
    line-height: 1;
    border-radius: 2px;
    display: inline-block;
    color: #FFF;
}

.username.DevTeam {
    max-width: initial !important;
}

.username.DevTeam .fa.fa-shield {
    display: none;
}

.username.DevTeam::after, .user-main .fa.fa-shield::before, #user-card .fa.fa-shield::before {
    content: 'DevTeam';
    margin-left: 5px;
    color: #FFF;
    background: #F68416;
    padding: 0 6px;
    border-radius: 2px;
    display: inline-block;
    
}


.extra-info .badge-wrapper .badge-category-parent {
    padding: 3px 6px;
    width: auto;
}

.extra-info .badge-wrapper .badge-category-parent:before {
    content: '';
}

.user-main .fa.fa-shield::before, #user-card .fa.fa-shield::before {
    font-size: 14px;
    padding: 5px 9px;
    position: absolute;
    width: 70px;
    margin-top: -20px;
}

 #user-card .fa.fa-shield::before {
    margin-left: 0;
    font-size: 11px;
    width: 55px;
}

It works only on topic but not in user-card and user-main.

The first code I quote works perfectly with staff members.
What’s wrong now?

Thanks in advance.

1 curtida
Is it possible to add a colored badge background to a user title?
3

Recategorized as feature request, this may be worth fixing

1 curtida