Theme Flarum + Verified icon for Admin

ram0ng1

Based on AdminTech Forum colors

#0e7975

Verified Icon Badge id: 1.
Replace the .Badge--group--1 to your verified Badge id.

Code:

r4nchy

ram0ng1 how to just configure the verified icon, and not the theme ?

ram0ng1

r4nchy

@media (min-width:768px) {
    
.PostUser-badges.badges .item-group1 {  /*HIDE ADMIN BADGE*/
	display: none;
 }
	.PostUser-badges {
		position: unset;
		margin-left: -42px;
		margin-top: -3px;
		float: none;
		margin-right: -4px;
		width: 64px;
	}
	.PostUser-badges .Badge {
		margin-left: -10px;
		position: relative;
		margin-top: -4px;
		pointer-events: auto;
	}
	.Badge--group--[ID] {
		background-color: transparent !important;
		background-size: cover !important;
		background-image: url(https://i.imgur.com/Jzyks75.png) !important;
		width: 16px;
		height: 16px;
		color: transparent !important;
		border-radius: unset !important;
		box-shadow: none;
	}
}

r4nchy

it works for profile page and usercard but it won't show up in discussions,

ram0ng1

r4nchy
You need to set the group ID in .Badge--group--[ID]. in my case, I set this to 4, which would look like this:

	.Badge--group--4 {
		background-color: transparent !important;
		background-size: cover !important;
		background-image: url(https://i.imgur.com/Jzyks75.png) !important;
		width: 16px;
		height: 16px;
		color: transparent !important;
		border-radius: unset !important;
		box-shadow: none;
	}

r4nchy

ram0ng1 yes I did exactly that and this is how it looks

ram0ng1

r4nchy I just tested here at Flarum and it seems to be working.

r4nchy

ok I found the error, on third line
.PostUser-badges.badges should be .PostUser-badges .badges
😀

YouBasic

Why this is changing my forum theme?
https://gyazo.com/df22b8eb57d15b16f01e911f603eed9c

How to solve this?
And by saying ID, How do I get the ID of a group?

EDIT: NVM SOLVED.