Repository navigation
IE11 with white theming doesn't show black app icons #7408
Description
Safari ✅:
Edge ✅:
IE 11 ❌:
Also happens on stable12.
cc @nextcloud/designers @nextcloud/theming
@jancborchardt Could you have a look at this?
{{ message }}
Safari ✅:
Edge ✅:
IE 11 ❌:
Also happens on stable12.
cc @nextcloud/designers @nextcloud/theming
@jancborchardt Could you have a look at this?
Activity
MariusBluem commentedon Dec 6, 2017
The theming-icon looks a bit pixelated on Edge too :(
MorrisJobke commentedon Dec 6, 2017
That's due to the shitty resolution of the VM. This ticket is about the non-visible app icons on IE11.
juliusknorr commentedon Dec 11, 2017
I thought that was already fixed some time ago, let me check what's wrong there.
jancborchardt commentedon Dec 11, 2017
This is because
filteras we use is not compatible with IE11 as discussed in #5593, right? I checked around and saw this blog post which refers to this jQuery plugin to make it work for IE11 and IE 10: https://shekhardesigner.github.io/InvertImages/@juliushaertl but if you can make it work without JS I guess that’s preferable. (cc @pixelipo @skjnldsv cause you were also involved in the issue discussion I mentioned.)
skjnldsv commentedon Dec 12, 2017
Not fond of the jquery plugin.
We could use svg filters https://jsfiddle.net/g97e26pa/180/
MorrisJobke commentedon Dec 12, 2017
I would also use only a minimal approach - if we have sag filters that only apply to IE -> perfect.
pixelipo commentedon Dec 12, 2017
plugin mentioned by @jancborchardt does exactly that, @skjnldsv @MorrisJobke :) It applies SVG filter to SVG icons in IE, while "falling back" to default CSS3 filters for other browsers (Firefox, Chrome, Edge).
There's no way we can implement SVG filters selectively without JS. In addition, this solution doesn't mean that we have to apply filters directly inside SVG files (which would cause them to double in filesize and add some maintenance overhead).
pixelipo commentedon Dec 12, 2017
Code in that plugin is quite simple and less than 2 kB minimized. We could also work out our own, simplified method and add it straight into our JS code (so that we don't have to worry about source)
skjnldsv commentedon Dec 12, 2017
We could also directly add this in the app menu generator, and not use anything. We won't have svgs to maintains at all and we should be able to apply the filter with css too (without the filter css3)
pixelipo commentedon Dec 12, 2017
Yes, that's what I wrote in my previous comment, @skjnldsv ;)
But I'm worried that we might already have a similar problem with #7319 as well. Can anyone test Talk and Gallery apps in master on IE11?
skjnldsv commentedon Dec 12, 2017
🙈
Yup, it should probably also be an issue there
pixelipo commentedon Dec 20, 2017
I could add that code, but it would be blind, since I can't test on IE11...
skjnldsv commentedon Dec 20, 2017
@pixelipo time for a vm! 😆
pixelipo commentedon Dec 20, 2017
@skjnldsv no
MorrisJobke commentedon Jan 2, 2018
VMs can be downloaded from http://modern.ie 😉