chipx86 got a fish trophy!
Fix the initial presentation of the issue status bar on load.
Review Request #9119 — Created Aug. 4, 2017 and submitted
The issue status bar was rendering a bit strangely on load in recent
versions of Chrome. When the JavaScript began rendering the bar, it
would apply a CSS class to control the styling, which transitioned the
background and the border. Since there was no default border, the
browser would choose the default color (black) to transition from,
making it look a bit weird.Since there was no border originally, there would also be a 2px change
in the height after render, causing further work to render the page.On top of this, the only content loaded by default in the bar was the
"Show all issues," which would just appear off to the right of the bar
by itself without any other content or border.Now, we start the bar off with a 2px transparent border to fix the
initial height and the transitions, but we also have the visibility
turned off so that no content shows up until it's time to render. This
reserves the space for the bar but keeps it clean until the JavaScript
takes over, and overall improves the look when loading.
Loaded the page. Saw that the space was reserved for the issue bars, but
that no content was shown. Also saw that when the bars loaded, they didn't
have the weird transition glitches with the border.