main ← pento:feature/show-granted-badges
opened 06:28AM - 23 Oct 24 UTC
## ✨ What's This?
Based on [this feature request](https://meta.discourse.org/…t/wishlist-visual-cue-for-user-got-a-badge-for-this-post/282923/1), this PR adds a visual cue to the post header when the user was granted a badge for that post.
You can customise the appearance of these badges (or hide some of them entirely!) by adding custom theme CSS. For example:
```css
.topic-meta-data .user-badge-button-first-onebox {
display: none;
}
.topic-meta-data .user-badge-button-first-onebox {
animation: blinker 1s step-start infinite;
}
@keyframes blinker {
50% {
opacity: 0;
}
}
```
There's also a global option to turn this feature off, and each individual badge has an option to decide if it should be included in the post header or not.
## 📺 Screenshots
### Frontend
<img width="813" alt="" src="https://github.com/user-attachments/assets/b2acc5c4-ea13-40cf-8205-f6773f55b884">
### Global Setting
<img width="548" alt="" src="https://github.com/user-attachments/assets/b9e33da0-b6cd-4111-acbc-35d86383e519">
### Per-Badge Setting
<img width="359" alt="" src="https://github.com/user-attachments/assets/45563fc2-eb3e-4487-a17b-5b560536f1d2">
https://github.com/user-attachments/assets/165d985c-2365-47bc-8fab-ec591b8810eb
## 👑 Testing
Badges should only ever show on a post when all of these conditions are true:
- The badge was granted to the post author.
- The badge was granted for that post.
- The badge is enabled.
- The badge can be shown on the public badge page.
- The badge allows showing the post that granted this badge on the badge page.
- The badge allows being displayed in the post header.
Most of the testing should be ensuring that these conditions can't be avoided, and that there are no other conditions to add.
It'd also be helpful to test badge customisation with theme CSS, to ensure it can't be accidentally made to look weird. Looking weird on purpose is totally fine, though! 😄
