HomePhabricator

FloatableElement, PopupWidget: Do positioning from the right in RTL

Authored by Catrope on Feb 13 2017, 5:49 PM.

Description

FloatableElement, PopupWidget: Do positioning from the right in RTL

We were always doing positioning from the left, even in RTL. While this
made the math a bit easier in some places, it meant that some features
never worked and were impossible to make work, such as aligning a
PopupButtonWidget's popup with the button's icon in RTL.

FloatableElement:

  • Use right: Npx; instead of left: Npx; for positioning in RTL
  • Ensure position: absolute; is set, we were relying on classes mixing this in to set it themselves

PopupWidget:

  • Use right: 0; instead of left: 0; to position inline (non-overlay) popups in RTL. This aligns the right edges (correct) rather than the left edges (wrong) of the popup and the reference element.
  • Use margin-right instead of margin-left to shift the popup relative to its anchor in RTL.
    • Updating the computations for this was relatively easy: implement force-left/force-right in terms of backwards/forwards instead of the other way around, and multiply overlap adjustments by -1.

PopupButtonWidget:

  • Use margin-right instead of margin-left to align the popup with the icon in RTL.

Bug: T157867
Change-Id: I7bea8bfdd40d5b0ccfcee39b7257e0a2ab5ca7c0

Details

Committed
CatropeFeb 14 2017, 9:27 PM
Parents
rGOJUb44f13091ecf: ClippableElement: Order matters (inexplicably)
Branches
Unknown
Tags
Unknown
References
refs/changes/31/337431/5
ChangeId
I7bea8bfdd40d5b0ccfcee39b7257e0a2ab5ca7c0