User profile pictures are too big

[ed]

The user profile pictures on the user profile nodes are too big.

e.g.
​https://transitionnetwork.org/people/tina-clarke

Please investigate and restrain them into a suitable maximum size

NB: Ed is keeping a number of small UI-ish tickets back for Ben to do in a lump when we've built up enough so don't do anything yet.

[jim]

FWIW, this CSS will make any 'too big' image in the content area fit the available space nicely:

#main-content img {
  max-width: 100%;
  height: auto;
}

[ed]

if it is that quick can you roll it out jim? (sorry ben!)

[jim]

​I've just committed the change to the scss, but not yet compiled to CSS or pushed to the server.

Ed, Ben, do you want me to do that? I'd prefer this was tested first really since it will affect EVERY image in the content area -- though if they're less than the width available nothing should happen.

Let me know.

[jim]

FYI I've now recompiled the SASS on my machine from the latest changes... It wouldn' compile and there is a lot of broken scss fragments. I've therefore removed the 'v1' and v2' scss files as they're not being used.

After a cleanup it now compiles. I've also set Compass to be in Production mode so it doesn't output all those comments and debugging. Ben, please remember to pull before you do anything else.

This will arrive in STG for us to have a look at soon.

[ed]

Great - let me know when to check on STG please

[ed]

I'm looking on STG. I'm also having a brainwave (rather late one) and have removed the Transition Nearby block from the 'people/*' pages - which now makes the profile pics look fine.

So my initial bug is fixed by removing the block from the people pages.

*Ahem*

I can't see any examples of pictures looking too big or too small now - SO

I approve this...

[jim]

This fix is also on PROD, and tested by going to ​https://www.transitionnetwork.org/people/tina-clarke and then setting page width narrower... image gracefully scaled rather than overlapping.

Marking fixed.

[ed]

ta