Page MenuHomePhabricator

Spike: Re-evaluate use of transforms in MobileFrontend
Closed, DeclinedPublicSpike

Description

In MobileFrontend we use the icon "arrow" in multiple places

  1. Points upwards in expanded sections
  2. Points downwards for collapsed sections
  3. In footer it points right for LTR languages
  4. Arrows pointing left and right in the ImageOverlay (but supplied by a new icon see T145479)

The arrow has 2 variants - gray and invert as in the footer the toggle takes different colors depending on the background colour of the last modified bar (whether it is fresh or not)

Using a transform as noted in T102154 lacks support in IE8 and Opera Mini. Because of this @bmansurov has proposed we rethink it.

We have several options to consider

  1. We could keep the status quo
  2. We could keep the status quo but formalise it in some way e.g. a modifier for mw-ui-icon that flips the icon in certain cases e.g. mw-ui-icon-flip
  3. Introduce new icons for the rotated states (this would mean 4 icons and any variants rather than 1)

3a) We could load these via JS to avoid impact to first paint.

  1. (insert your proposal here)

See also: T145479

Event Timeline

Restricted Application added a subscriber: Aklapper. · View Herald TranscriptAug 31 2016, 5:32 PM
Jdlrobson updated the task description. (Show Details)Sep 13 2016, 1:28 AM
Jdlrobson updated the task description. (Show Details)
jhobs triaged this task as Normal priority.Nov 14 2016, 6:18 PM
Restricted Application added a project: UI-Standardization. · View Herald TranscriptFeb 8 2017, 7:30 PM

We should talk about this, but it's more a technical decision than a design.

Jdlrobson added a subscriber: Nirzar.

My bad https://phabricator.wikimedia.org/T144411#3384626 is not quite right - this is a decision decision because...

..We don't load JS in IE8 or Opera Mini. Thus the only feature that is impacted by our current usage of transform is the footer (all the other features use JS).

The arrow is non-essential from my perspective.
The footer doesn't look broken without the arrow and is still functional:

@Nirzar do you think we should decline this task ?

Nirzar added a comment.Jul 6 2017, 6:50 PM

What about the arrows in sections? do we hide them on Opera Mini and IE8?

@Nirzar yup. toggling will not work on these browsers.

alexhollender added a subscriber: alexhollender.

@Jdlrobson is this task still relevant? If so, I'm wondering if it's a design task or more of an engineering task with potential design input?

Restricted Application changed the subtype of this task from "Task" to "Spike". · View Herald TranscriptJun 18 2019, 9:01 PM
Jdlrobson closed this task as Declined.Jul 8 2019, 5:53 PM
Jdlrobson added a subscriber: Volker_E.

Talking to @Volker_E we've been trending towards CSS filters here. Opera Mini is the only browser we should care about here and support is 1.42%. We don't run JS in that browser so it's not relevant so let's decline.