-
-
Notifications
You must be signed in to change notification settings - Fork 830
Conversation
#12267 made the avatar a couple of pixels out of alignment with the space icons. It just needed to be moved 2px to the right to match the 18px margin of the space icons (including the padding from the black border). Also change elements in the user menu to block elements so they don't generate extra vertical space in the user menu div, which was causing the hairline to be too far down.
res/css/structures/_SpacePanel.pcss
Outdated
span, | ||
img { |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Could you target a class name here so we're not relying on the specific elements used in the Compound Avatar implementation?
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
I can for the span, but the image only has an autogenerated class name. Unsure whether adding one just for this or just using the element type is the lesser evil. We could also match everything, which might actually be better?
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
From my brief testing it looked like setting display: block
only on the span was enough to fix the height, for what it's worth
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Huh, I retested and you're absolutely right.
#12267 made the avatar a couple of pixels out of alignment with the space icons. It just needed to be moved 2px to the right to match the 18px margin of the space icons (including the padding from the black border).
Also change elements in the user menu to block elements so they don't generate extra vertical space in the user menu div, which was causing the hairline to be too far down (unless anyone knows of a better way to avoid this extra height in the div: setting the hight of the div explicitly didn't work).
Checklist