Page MenuHomePhabricator

Duplicate, native +/- buttons on all NumberInputWidgets in Firefox
Closed, DuplicatePublic

Description

In the most recent Firefox 66 and 67, all NumberInputWidgets on the demo page show two sets of +/- and up/down buttons. The bigger +/- buttons on both sides are from OOUI. Additionally, the inner input field shows two tiny up/down buttons on the right. These are native from Firefox.

Clicking these different buttons seems to work fine with no conflict. It just looks odd.

Something like this seems to fix it:

input[type=number] {
    -moz-appearance: textfield;
}

Event Timeline

We already have:

.oo-ui-textInputWidget input {
    -moz-appearance: textfield;
}

But it's getting overridden by:

.oo-ui-textInputWidget .oo-ui-inputWidget-input {
    -webkit-appearance: none;
    ...
}