Primary group class not available on usercard and user page

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?

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 Like

Recategorized as feature request, this may be worth fixing

1 Like