Fix box shadow of header elements

[MorrisJobke]

• unify shadow blur from 3px to 10px
• remove opacity of background of app labels
• for IE: use box-shadow as fallback (because the filter: drop-shadow is not supported)

Found while reviewing nextcloud/notifications#89

cc @nextcloud/designers

Before (opacity, bigger blur, no shadow on notifications in Safari):

After:

[codecov]

Codecov Report

Merging #7572 into master will increase coverage by <.01%.
The diff coverage is n/a.

@@             Coverage Diff              @@
##             master    #7572      +/-   ##
============================================
+ Coverage     51.16%   51.16%   +<.01%     
  Complexity    24883    24883              
============================================
  Files          1602     1602              
  Lines         94730    94730              
  Branches       1368     1368              
============================================
+ Hits          48470    48471       +1     
+ Misses        46260    46259       -1

Impacted Files	Coverage Δ	Complexity Δ
lib/private/Files/Cache/Propagator.php	96.2% <0%> (+1.26%)	16% <0%> (ø)	⬇️

[jancborchardt]

Good stuff, but why reduce it from 10px which we used basically everywhere to 3px? It looks a bit strange and more like a thick border than a slight shadow.

[MorrisJobke]

Good stuff, but why reduce it from 10px which we used basically everywhere to 3px? It looks a bit strange and more like a thick border than a slight shadow.

Because we use that in our newer filters ;) See the line I just changed, I thought that we move to that. Otherwise we need to touch a lot more occurrences.

[skjnldsv]

I disagree! The filter: drop-shadow is far better than the box-shadow as the arrow isn't included in the shadow generation. I'm against the removal of this.

What's up with safari anyway? it should supports filter? https://caniuse.com/#feat=css-filters 😕

[MorrisJobke]

Usually it does this, but somehow not for the notifications drop down. I will check tomorrow and adapt this pr then

[MorrisJobke]

Okay - I moved to the 10px and to the filter: drop-shadow. I also added fixes for IE 11, because this supports only box-shadow. I tested it and it works now 👍