Top bar transparency and shadow #2
I suggest to watch this in “Full screen presentation View (top right corner), with black background”
The goal of this study is to adjust shadow and show different levels of top bar transparency.
I started with shadow first, so top bar is the one on master branch (panel-alpha-value: 0.8)
Adjusting shadow vertical shift
2px of vertical shift seems too much, but 1px is the minimum
1px blur makes the shadow look unreal, better 2px
First picture is too much, while in the last one the shadow is barely visible, so with this high transparency, box-shadow: 0 1px 2px 2px rgba(0, 0, 0, 0.9); looks best to me
Darker panel version
Full solid, panel-alpha-value: 0 and transparency of the shadow from 0.9 to 0.3, otherwise it’s indistinguishable from the dark top bar.
There’s a weird brighter line (noted by Stefan) just below the panel border, which is reduced adjusting spread radius. I can’t see it anymore with spread radius 1px, but the shadow as well is barely visible, so I’d go for box-shadow: 0 1px 2px 2px rgba(0,0,0,0.3)
Now I start adding transparency progressively until alpha:0.8 which is the value we are using now.