| Jdlrobson | |
| Aug 26 2016, 5:39 PM |
| F5777352: snapshots_1_Wed_Feb_22_2017_154539_GMT-0600_CST.png | |
| Feb 22 2017, 10:06 PM |
| F5777405: snapshots_1_Wed_Feb_22_2017.png | |
| Feb 22 2017, 10:06 PM |
| F5777359: snapshots_1_Wed_Feb_22_2017_155621_GMT-0600_CST.png | |
| Feb 22 2017, 10:06 PM |
| F5578026: T144036 on Opera 43 Windows 10.jpg | |
| Feb 9 2017, 10:34 PM |
| F5578021: T144036 on Edge 14.14393 Windows 10.jpg | |
| Feb 9 2017, 10:34 PM |
| F5578005: T144036 on Opera 42 Android 6.0.1 Samsung-SM-J120A.png | |
| Feb 9 2017, 10:34 PM |
| F5578011: T144036 on Android Browser Android 6.0.1 Samsung-SM-J120A.png | |
| Feb 9 2017, 10:34 PM |
| F4571905: Screenshot_2016-10-07-13-50-35.png | |
| Oct 7 2016, 11:57 AM |
The clock icon appear blurry on the following devices:
Previously fixed
Previously reported:
Note well the orientation of the chevron on the right. Edit: It's pointing DOWN!!1
| Status | Subtype | Assigned | Task | ||
|---|---|---|---|---|---|
| Resolved | ovasileva | T141002 Align elements in article footer on beta | |||
| Invalid | None | T144036 Icons appear blurred in new footer on Opera Mini and Edge |
Change 306963 had a related patch set uploaded (by Jdlrobson):
Use more widely supported 2d transform for chevron rotate
Change 306970 had a related patch set uploaded (by Jdlrobson):
Hide chevron in last modified bar for non-js users
The chevron is pointing down due to use of the CSS rule rotateZ(-90deg)
ANDROID: Fixed
Using vendor prefixed rotate will fix this for Android 2.3 browser (see patch).
IE:
I can replicate this but can't debug as developer tools crash my emulator every time I try to load them. I suspect this is an issue with the new implementation of mw-ui-icon-small however and IE10 - https://thatemil.com/blog/2015/03/15/sizing-svg-background-images-in-internet-explorer/ - should we investigate this separately in another task?
Opera Mini: WONTFIX.
I can't test Opera Mini but I'm pretty sure it doesn't support any css transforms. Thus only possibility is hiding it (I've submitted a follow up to do that if that's an option) - but if we do that I'd rather do that as part of a big Opera Mini specific overhaul (we have many other problems with that browser).
@jhobs can you test https://gerrit.wikimedia.org/r/#/c/306963? The code looks good, but I am not able to test due to my local MediaWiki installation. Thanks!
Change 306963 merged by jenkins-bot:
Use more widely supported 2d transform for chevron rotate
I can't tell on the resolution for Opera Mini compressed, but the icon looks clipped in Opera Mini compressed. Does its resolution look right to you in the screenshot I took several minutes ago?
It didn't seem to matter whether images were set to Low or High compression.
For a frame of reference here's what I was just seeing Safari on an iPhone 5c iOS 9.3.
with all these bugs. should we just hide the icons for low grade browsers?
i didn't know the icons would cause so many tasks :(
Change 306970 merged by jenkins-bot:
Hide chevron in last modified bar for non-js users
Be careful not to be blinded by your own solution – this happens to me… a lot…
The simplest solution that supports the largest variety of browsers is to create a new icon for a chevron pointing to the right in LTR, which is then flipped automatically in RTL. For sure, rotating a pre-existing icon saves a little bandwidth but has an increased maintenance cost, which is something we very rarely take into account.
@phuedx we purposely rotate the toggle chevron to avoid this bandwidth issue (this is not an issue in Opera Mini as when we don't load JS the toggle icon doesn't show)
I'm wary of adding an additional icon to top loaded css and reducing first paint for this issue alone. It doesn't seem like a critical UI element imo.
Out of curiosity, what's the size of a optimised (svgoed), compressed SVG and PNG? How many additional bytes of compressed CSS would we deliver to the browser?
@dr0ptp4kt Can we resolve this? Otherwise it needs to be carried over to Reading-Web-Sprint-80-V-for-Vandalism
I believe it needs to be brought into sprint 80 as the sprint's well underway.
@Nirzar, was the intent to have both the chevron and the clock icon suppressed, or just the chevron? Presently in Opera Mini with compression I only see the chevron suppressed on en.m.wikipedia.beta.wmflabs.org in the beta channel.
As it is, in Opera Mini with compression turned on the clock icon is clipped, which isn't I think what's intended.
If the clock icon was supposed to be suppressed, then this task should be carried into sprint 80 and a follow on patch should be submitted for as much on this same task.
If the clock icon wasn't supposed to be suppressed, then I believe either (a) this task should be Resolved and a new task created to fix the clipped icon, or (b) this task should not be resolved until the clipped icon is fixed.
So firstly I made a mistake - this would introduce 4 new icons - 2 new icons because of the additional need to support RTL and both of these 2 icons would need variants for when the article is fresh and when it is not.
To answer your question I created a flipped version of the arrow and I ran it through the svg optimiser.
The css file was 7050 bytes before, but with the 2 new new icons it was 10174 bytes so that's 3124 bytes - 1562 per icon. No idea if that matters after gzipping but certainly complicates the code base (3 assets would need updating on any change to that icon).
Please respond to https://phabricator.wikimedia.org/T144036#2592541 to provide guidance.
@Jdlrobson confused. what is the solution that is being discussed? it's not in task description or hard to find in comments. the task description states the problem?
going out on a limb I'm guessing we are talking about removing both clock and chevron from Opera mini. and it seems chevron doesn't have big problem?
Here are possible solution for opera mini. I'm okay with any of these in order of preference
Just to note: these are extra affordances added and they don't take away any core funtionality. we can put this under graceful degradation.
Up to you @dr0ptp4kt for evaluative the effort. if removing is the simplest solution, lets do that.
@Nirzar sorry for confusion.
The issue is in Opera Mini we currently hide the chevron but the clock icon is a little blurred. Adam wants to know whether we should hide the clock as well or leave it as is or explore fixing it.
It sounds from your reply that the ideal would be we work out what blurs this icon and if that's not hide it.
@dr0ptp4kt @MBinder_WMF we should probably estimate this card. Resolving the unblurriness will be tricky, hiding will be messy.
@Jdlrobson yeah but again, if it's too much trouble and time to do 1st preferences, feel free to do 2 or 3 on that list. as i said they are extra affordances.
Reproduced on Samsung-SM-J120A Android 6.0.1 on Opera 42
Also reproduced on the web with Edge 14.14393 Windows 10
The clock icon still looks disabled in all environments.
Sorry, I'm a little late to the party on this one, but it appears there are a number of issues covered in this ticket.
Blurry icons in the footer - Appears to be fixed, right?
Blurry Language icon - Appears to the fixed.
Image clipping - I was able to reproduce this only with the Android 2.3 - Opera Mobile 11.50 and Android 4.0 - Opera Mobile 11.50. I did not see clipping on any other android/browser combination. Image below. Should this be a separate ticket?
Grayed icons - I am unclear on whether this is a bug. Are they supposed to be lighter in color?
I tried a number of android versions and opera mobile browsers.
Clipping on Android 2.3 and 4.0
Language Icon looks ok
Footer icons looks ok
Opera Mini on Android 4 looks fine if you have Extreme data savings disabled. I think this is fine, except for the Android 2 problems. Android 2 is right now a 0.36% though, so I'd say we can live with those clippings.
