Change Details

=== Steps to reproduce Hover over a settings cog in a page preview panel, look at the gray area that appears === Hover area The gray area that appears when you hover should be: -square -equal 7px around icon on all sides {F17306976} === Placement The settings cog should have equal distance from the right and bottom of the page preview panel -27px from right -27px from bottom {F17306956} We'll use flexbox and more appropriate/consistent use of mw-ui-icon to resolve this: https://phabricator.wikimedia.org/T193058#4163023 === Testing We should make sure to test on both horizontal and vertical, RTL and LTR

=== Steps to reproduce Hover over a settings cog in a page preview panel, look at the gray area that appears === Hover area The gray area that appears when you hover should be: -square -equal 7px around icon on all sides {F17306976} === Placement The settings cog should have equal distance from the right and bottom of the page preview panel -27px from right -27px from bottom {F17306956} We'll: * remove `.mwe-popups .icon` rule * use flexbox * Use appropriate/consistent use of mw-ui-icon (label inside icon) See https://phabricator.wikimedia.org/T193058#4163023 for more details === Testing We should make sure to test on both horizontal and vertical, RTL and LTR

=== Steps to reproduce Hover over a settings cog in a page preview panel, look at the gray area that appears === Hover area The gray area that appears when you hover should be: -square -equal 7px around icon on all sides {F17306976} === Placement The settings cog should have equal distance from the right and bottom of the page preview panel -27px from right -27px from bottom {F17306956} We'll use flexbox and more appropriate/consistent use of mw-ui-icon to resolve this: * remove `.mwe-popups .icon` rule * use flexbox * Use appropriate/consistent use of mw-ui-icon (label inside icon) See https://phabricator.wikimedia.org/T193058#4163023 for more details === Testing We should make sure to test on both horizontal and vertical, RTL and LTR