Opened 8 years ago
Closed 8 years ago
#3855 closed defect (bug) (fixed)
Centering Meetup Organizer's badge
| Reported by: | nukaga | Owned by: | coffee2code |
|---|---|---|---|
| Priority: | normal | Milestone: | |
| Component: | Profiles | Keywords: | needs-patch |
| Cc: |
Description
The icon of the Meetup Organizer's badge is pointing to the right. I want to make it in the middle.
Attachments (1)
Change History (6)
#2
@
8 years ago
- Component General → Profiles
The circle is a box-shadow/border around the dashicon character, using CSS therefor causes the circle to shift with it.
It looks like most of the badges are not 100% centered, which if that's the case should be fixed upstream in dashicons by centering them in the canvas or something I think?
#3
in reply to: ↑ 1
@
8 years ago
If it were me, I would do it like this.
div#item-header #user-badges li div.dashicons:before{
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%,-50%);
}
#5
@
8 years ago
- Resolution → fixed
- Status accepted → closed
Fixed in [14546-dotorg].
A left: 1px style was being applied to the dashicons. I removed it by default, since most badges were better centered without it. I explicitly re-added the style to a handful of badge dashicons that need it: themes, plugins, design, support, and WordCamp organizer. Also, the hosting badge didn't need the 2px top style applied it.
![(please configure the [header_logo] section in trac.ini)](/chrome/site/your_project_logo.png)
This is solved by adding the following CSS.
.badge.item.dashicons.badge-organizer.dashicons-nametag { left: 0px; }