Suggested description page styling tweaks

[RMacfarlane]

Found while testing #1152

• While the page is loading, the text "Loading..." is displayed at the very top of the page with no padding. It would be nice to have a top margin for this, or possibly make it more central
• The comment editor seems to have lost its padding between the text area and buttons:

[Ashniu123]

Can I try this?

[RMacfarlane]

@Adam13531 Yes! The second bullet point has already been fixed. The code that adds the "Loading..." text is here:

vscode-pull-request-github/preview-src/app.tsx

Line 22 in d8088a6

return pr ? children(pr) : 'Loading...';

and the stylesheet is preview-src/index.css

[Adam13531]

@Adam13531 Yes!

I think you may have tagged the wrong person. @Ashniu123, see the last response.

[Ashniu123]

Should I just put an margin-top like

<div margin-top="10px">Loading...</div>

? Or Add use the "title" class ?

[JeffreyCA]

It would be helpful to post some screenshots so we can visually compare the two

[marcuslyons]

Would something like this work, or is this too far?

Before - no spacing:

After - centered:

[RishabhKothaari]

@queerviolet
if this is still open and available? I would like to take it. I have centered the "Loading..." text and increased the font size so that it is more visible.

[Ashniu123]

@rishab-pdx if your PR is ready then by all means... Go ahead! :D

Edit: I'd recommend to not increase the font-size unnecessarily as people generally set their font sizes to suite them and overriding it would be bad UX.

[RishabhKothaari]

@Ashniu123 that makes sense. Here is the final view.

Let me know what you think?