disabled buttons - The disabled buttons in OOJS UI are difficult to read. They should probably adopt mediawiki-ui's disabled style.

This is #CCC in the mediawiki.ui but M31 and T88483 say that it should be #DDD. There is a patch that fixes this is OOjs UI. @violetto, is #DDD a recent change? Should I fix it in mediawiki.ui too?

If it's not #DDD in mw.ui, we should change it @Prtksxna. I can't recall if it was a recent change, I just realized it wasn't #DDD a while ago.

In T88449#1035507, @violetto wrote:

If it's not #DDD in mw.ui, we should change it @Prtksxna. I can't recall if it was a recent change, I just realized it wasn't #DDD a while ago.

Fixed - https://gerrit.wikimedia.org/r/#/c/190996/

Saw the changes, they look great.

@Prtksxna: This bug is currently blocking adoption of OOjs UI on mobile. Anything we can do to help this along?

Is this bug now "MW-UI button designs are out of sync with OOjs UI and need to be updated"?

In T88449#1064591, @Jdforrester-WMF wrote:

Is this bug now "MW-UI button designs are out of sync with OOjs UI and need to be updated"?

I thought of it more as "MW-UI is evil, let's move OOjs UI's MW theme into MW and make possible to use OOjs UI instead".

@Jdforrester-WMF There are 4 issues identified in the bug description. I think the 3rd one may be fixed now. The first 2 are open questions that need to be answered by design (@Prtksxna). The fourth issue probably needs to be addressed on the OOjs side.

@Jdforrester-WMF Regarding the 1st issue (constructive, destructive, progressive buttons), it looks like the OOjs UI buttons are not in line with the final design specs from May: M31. In this case, it looks like OOjs UI may want to adopt the styles from MediaWiki UI.

This bug is holding up https://gerrit.wikimedia.org/r/#/c/192473/. Looking for some feedback from @Jdforrester-WMF and/or @Prtksxna about the best way to resolve the conflicting button styles.

@kaldari I am working towards solving these inconsistencies. some of the buttons are being used in VE currently* which can be avoided by fixing interface issues. I might need some help before I submit the patch. if you are free, let me know. we can have a quick discussion.

*so removing them is not an option

In T88449#1066714, @kaldari wrote:

@Jdforrester-WMF There are 4 issues identified in the bug description. I think the 3rd one may be fixed now. The first 2 are open questions that need to be answered by design (@Prtksxna). The fourth issue probably needs to be addressed on the OOjs side.

I think @violetto might be the right person to answer the question. I am only taking care of the implementation. There are places where the design specification is being updated, and I haven't updated either mw.ui (the less files) or the MediaWiki Theme of OOjs UI so that efforts aren't duplicated.

If there is a particular implementation detail you want resolved I am happy to get that done.

(Updated the description to say the third item is fixed, per Kaldari.)

constructive, destructive, progressive buttons - Which styles do we want to use?

Like @Nirzar mentioned, ButtonWidget (progressive)‎, ButtonWidget (constructive)‎, and ButtonWidget (destructive)‎ are currently being used by VE in a few ways. These don't exist within mw.UI. Nirzar and I are working towards solving this one.

frameless constructive, destructive, progressive buttons - Which styles do we want to use?

We've already started work on making this consistent with mw.UI. If you can help @Nirzar & I submit the patch, it'll be super.

standalone icon buttons - much smaller in OOJS UI, we probably need two different size options, as mobile needs larger icons.

This is not up to spec with mw.UI but we're working towards that early this week.

Had a good meeting with May and Nirzar. Here are some notes from the meeting:

• The styles for constructive, destructive, and progressive buttons now seem to be in sync, so we don't have to worry about that
• The colors for frameless buttons are wrong in both OOjs UI and MediaWiki UI. The colors should be: #347bff (blue), #00af89 (green), #d11d13 (red), #555 (regular grey), #ccc (disabled grey)
• The specs for icon buttons are still being finalized, so we should just avoid mixing OOjs and MediaWiki UI icon buttons in the same interface for now.

I'm going to go ahead and submit some patches for fixing the frameless button colors.

Change 193987 had a related patch set uploaded (by Kaldari):
Text color for quiet buttons should not be lightened

https://gerrit.wikimedia.org/r/193987

Change 194028 had a related patch set uploaded (by Kaldari):
Syncing some button styles with MediaWiki UI

https://gerrit.wikimedia.org/r/194028

I've committed changes to both MediaWiki UI and OOjs UI to bring them more into sync:
https://gerrit.wikimedia.org/r/193987
https://gerrit.wikimedia.org/r/194028

The remaining issues are:

• Button sizes still differ - For now we have agreed to reduce the size of MediaWiki UI buttons to match the size of OOjs UI buttons and to explicitly declare a line-height of 1.5 for both. Currently OOjs UI buttons have a declared line-height of 1.9em and MediaWiki UI buttons have no declared line-height. This will necessitate padding changes to both versions.
• Icon sizes still differ - The specs for this are still being worked on by design.

Change 193987 merged by jenkins-bot:
Text color for quiet buttons should not be lightened

https://gerrit.wikimedia.org/r/193987

Change 194155 had a related patch set uploaded (by Kaldari):
Syncing some button styles with MediaWiki UI

https://gerrit.wikimedia.org/r/194155

Change 194028 abandoned by Kaldari:
Syncing some button styles with MediaWiki UI

Reason:
In favor of change If22fdb558dc0310da70092fdc861d56eac241ee7

https://gerrit.wikimedia.org/r/194028

Really we need a stop gap solution until OOJS UI is used more widely otherwise we are just irresponsibly creating even more inconsistencies between our projects. @Ricordisamoa I must say I find your comment somewhat rude (not sure if it was meant that way). Mediawiki ui despite its obvious shortcomings, is hardly evil, it helped a bunch of teams design more consistently (at one point we had about 6 different types of design for the same buttons). It was a learning experience and it was a cheap way to do this whilst everyone bickered about which language to use and OOJS UI was still in its infancy (when mobile began OOJS ui was just beginning to be built).

Now OOJSUI is more mature and the accepted solution we have a new problem which is porting over large codebases to use it. This is a big undertaking - in some teams this will require a huge rewrite. In mobile we have considerations for example on the client side code we ship to users.

I've talked in the past with @TrevorParscal about having a lighter version of OOJS UI - e.g. just covering the elements in mediawiki ui - buttons, icons, inputs, anchors and programmatically create the widgets without needing to care about the stylesheet. I wonder if this is the way forward now?

Change 194182 had a related patch set uploaded (by Kaldari):
Making MediaWiki UI buttons match size of OOjs UI buttons

https://gerrit.wikimedia.org/r/194182

@Jdlrobson I was just saying, my comment was simply a rough view of the status quo from the outside and was not by any means meant to insult MW-UI.

Change 194182 abandoned by Kaldari:
Making MediaWiki UI buttons match size of OOjs UI buttons

Reason:
This makes mobile buttons too small for touch guidelines

https://gerrit.wikimedia.org/r/194182

Thanks for the clarification @Ricordisamoa and sorry for wrongfully assuming. It's frustrating from the inside too I assure you and I hope we can resolve all this :-).

Change 194465 had a related patch set uploaded (by Prtksxna):
mw.ui: button: Update focus state

https://gerrit.wikimedia.org/r/194465

Change 194155 merged by jenkins-bot:
Syncing some button styles with MediaWiki UI

https://gerrit.wikimedia.org/r/194155

Change 194465 merged by jenkins-bot:
mw.ui: button: Update focus state

https://gerrit.wikimedia.org/r/194465

Change 194753 had a related patch set uploaded (by Trevor Parscal):
Button styles between OOJS and MW

https://gerrit.wikimedia.org/r/194753

Change 194753 merged by jenkins-bot:
Button styles between OOJS and MW

https://gerrit.wikimedia.org/r/194753

Resolved?

@Jdforrester-WMF might T145493: Some buttons in mobile interface don't indicate clickable target with pointer be related to this ?