Icon only ULS button has incorrect spacing
Open, Needs TriagePublic
Actions

Assigned To

None

Authored By

	bwang
	Jun 30 2026, 5:17 PM

Project Tags

Referenced Files

	F91276821: Screenshot 2026-06-30 at 12.15.00 PM.png
	Jun 30 2026, 5:17 PM

	F91276648: Screenshot 2026-06-30 at 12.13.14 PM.png
	Jun 30 2026, 5:17 PM

Subscribers

Description

Background

Language button is an icon only button on talk pages, and doesnt have the correct button padding. There is also missing spacing between the adjacent add topic button

Screenshot 2026-06-30 at 12.13.14 PM.png (370×156 px, 12 KB)

Go to https://test.wikipedia.org/w/index.php?title=Talk:ApiTestEdit2&action=edit&redlink=1 to see the bug

The button should be similar to the user links button, and be consistent with codex styles

Screenshot 2026-06-30 at 12.15.00 PM.png (208×148 px, 9 KB)

User story

As a user I expect buttons to be consistent across the UI

Acceptance criteria

ULS buttons are consistent with codex styles (i.e. roughly 6px horizontal padding)
ULS button shouldnt rely on hardcoded CSS

Rollback plan

this shouldnt require codex changes, it should just be a single revertable patch

Related Objects

Mentioned Here: T403816: Personal settings dropdown button has lost horizontal padding

Event Timeline

bwang created this task.Jun 30 2026, 5:17 PM

Restricted Application added a subscriber: Aklapper. · View Herald TranscriptJun 30 2026, 5:17 PM

I think this code is actually in the Vector skin, not in ULS.

In T430719#12074469, @Nikerabbit wrote:

I think this code is actually in the Vector skin, not in ULS.

Yes, agreed. This came up previously in T403816.

Note: the solution for that task could be improved by making the horizontal padding exactly match that of Codex Buttons, which subtract the width of the border from the desired padding (that gives us the exact horizontal spacing as designed). So instead of:

padding: 0 @spacing-35;

@media ( max-width: @max-width-breakpoint-tablet ) {
    padding: 0 @spacing-75;
}

we should do this (we can bikeshed which variable to use, see https://doc.wikimedia.org/codex/latest/design-tokens/spacing.html):

padding: 0 @spacing-horizontal-button-icon-only;

@media ( max-width: @max-width-breakpoint-tablet ) {
    padding: 0 @spacing-horizontal-button;
}

Nikerabbit edited projects, added: Vector 2022; removed: Language and Product Localization.Jul 7 2026, 5:58 AM

Nikerabbit moved this task from Backlog to Appearance and design on the UniversalLanguageSelector board.

Icon only ULS button has incorrect spacingOpen, Needs TriagePublicActions