Explicitly set height on rust logo <img> element in docs

[jakst]

The layout of the left side menu in docs reflows when navigating between pages because of missing height on the element of rust logo.

Setting height='100' tells the browser to reserve that vertical space, leading to a less janky experience.

[rust-highfive]

Thanks for the pull request, and welcome! The Rust team is excited to review your changes, and you should hear from @GuillaumeGomez (or someone else) soon.

If any changes to this PR are deemed necessary, please add them as extra commits. This ensures that the reviewer can see what has changed since they last reviewed the code. Due to the way GitHub handles out-of-date commits, this should also make it reasonably obvious what issues have or haven't been addressed. Large or tricky changes may require several passes of review and changes.

Please see the contribution instructions for more information.

[GuillaumeGomez]

height and width attribute on the dom element forces the image resize. We don't want that but instead to change it's max-height and max-width.

[jakst]

That is already not the case, because the img-element already has width='100', so right now you get the worst of both world where the img is forced to 100x100, without the browser knowing about the height on the first render pass and therefore needing to reflow the sidebar vertically when it has finished loading the image.

[jakst]

I realise we are talking about different things. I thought you meant for scaling up, but it is clear to me that we now break the scaling down scenario. Will take another look.

[jakst]

I have fixed the scaling down issues. Will you take another look @GuillaumeGomez ?

[GuillaumeGomez]

I'm not sure it fixes all issues considering you kept the width. If the image has a higher height than width, it'll be an issue as well. :) A bit more requires to be done in here.

[jakst]

Good input, although the image does not have a higher height than width at the moment, it's 1:1. I'm thinking it would be reasonable to alter the style if the logo is changed to some other ratio. padding-bottom: 50% only works for an image with a 1:1 ratio anyway, so this is not a general solution.

I can not spend any more time on this unfortunately. In my opinion, loss of adaptiveness to any aspect ratio (which affects nobody at this time) is a reasonable tradeoff to reduce layout reflow (which affects everyone right now). If you do not agree I think we should close this PR, otherwise - aim to merge it as it is now.

[GuillaumeGomez]

I'll push on your branch then. I have done this in the past on some personal project so I just need to get the CSS fix but you weren't far from it.

[jakst]

Feel free to do so. I will be sure to study your solution :)

[GuillaumeGomez]

Thanks for starting it in any case. I'll try to do it tomorrow.

[GuillaumeGomez]

And done!

@jakst Does it seem good to you?

[jakst]

Works well on desktop, but needs adjustment for @media (max-width: 700px).

[GuillaumeGomez]

Fixed it for mobile as well. Good catch!

[jakst]

Looking good to me now! 👌

[GuillaumeGomez]

r? @QuietMisdreavus

[Mark-Simulacrum]

Visiting for triage -- @QuietMisdreavus this looks like it's waiting on a review from you; will you get a chance to make that review happen soon?

[GuillaumeGomez]

I'll switch reviewers, @QuietMisdreavus is focused on docs.rs for the moment.

r? @Manishearth

[Manishearth]

@bors r+

[bors]

📌 Commit 9db0fd7 has been approved by Manishearth

[bors]

⌛ Testing commit 9db0fd7 with merge a5000c5...

[bors]

☀️ Test successful - checks-travis, status-appveyor
Approved by: Manishearth
Pushing a5000c5 to master...