uui-card-user status badge overlaps avatar due to incorrect bottom positioning

[Deba22]

Which exact UI Library version are you using? For example: 1.0.1 - don't just write v1.

v1.17.2

Bug summary

In uui-card-user v1.17.2, the slot[name='tag'] CSS uses bottom positioning instead of top, causing the status badge (e.g. "Disabled") to render at the bottom of the card and overlap the user avatar in the Umbraco CMS backoffice Users grid view.

Specifics

@umbraco-ui/uui-card-user v1.17.2
Umbraco CMS v17.2.2

Steps to reproduce

2. Open Umbraco CMS v17.2.2 backoffice
3. Navigate to Users section
4. Create a user and disable them
5. View the Users grid — the Disabled badge overlaps the avatar

Expected result / actual result

The status badge should appear in the top-right corner of the card, as it did in v1.17.1

The status badge appears at the bottom of the card, overlapping the avatar

Root cause

In src/components/card-user/card-user.element.ts:

css
slot[name='tag'] {
position: absolute;
bottom: var(--uui-size-space-4); ← should be top
right: var(--uui-size-space-4);
}

Proposed fix

Change bottom to top in the slot[name='tag'] CSS block.

[Deba22]

Hi, I've identified the root cause and have a fix ready. The tag slot CSS in card-user.element.ts uses bottom instead of top which was introduced in v1.17.2.

I've tested the fix locally using Storybook and confirmed the badge renders correctly in the top-right corner.

Happy to create a PR if the team is okay with it.