Project

General

Profile

Actions

Bug #19531

closed

CV: Cover Image - uploading xl image bug

Added by Sara Cannon 10 months ago. Updated 10 months ago.

Status:
Resolved
Priority name:
Normal
Assignee:
Category name:
CV
Target version:
Start date:
2024-01-16
Due date:
% Done:

0%

Estimated time:
Deployment actions:

Description

When uploading a cover image, I tested a large image that is with a vertical orientation. It expanded out of the modal and covered the buttons creating a situation where you are forced to exit the modal because the buttons were covered.


Files


Related issues

Related to CUNY Academic Commons - Bug #19550: A few issues/questions around CV editorAssignedJeremy Felt2024-01-18

Actions
Actions #1

Updated by Boone Gorges 10 months ago

  • Assignee changed from Boone Gorges to Jeremy Felt
  • Target version set to 2.3.1

Thanks for the report!

Actions #2

Updated by Raymond Hoh 10 months ago

  • Related to Bug #19550: A few issues/questions around CV editor added
Actions #3

Updated by Raymond Hoh 10 months ago

I've added some changes to the cover image modal to detect the size of the cover image preview when it is displayed: https://github.com/cuny-academic-commons/cac/commit/ceebc4601a82d676ddb4a509845d17ce03e84bcc

If the cover image preview height is larger than 50% of the viewport minus 100px (to account for the caption and button height), then the cover image preview will be scrollable. See attached GIF.

This is available for testing on cdev, but isn't live on production yet. Would like Jeremy's thoughts on the technique I used before doing so.

Actions #4

Updated by Colin McDonald 10 months ago

Thanks Ray, adding a few watchers here, and we'll look for Jeremy's thoughts on this.

Actions #5

Updated by scott voth 10 months ago

I am experiencing I think a similar issue - I added a cover image that is very large. It looks great, but I am unable to change it or add image credits, I think because I can't scroll down far enough to do so. See - https://commons.gc.cuny.edu/members/scottvoth/

Actions #6

Updated by Raymond Hoh 10 months ago

Scott, I've added a fix for this on cdev. Can you test your cover image there and see if you are able to add a caption?

Actions #7

Updated by Jeremy Felt 10 months ago

Thanks everyone! I've just pushed a different approach to 2.3.x in https://github.com/cuny-academic-commons/cac/commit/088c526b698b53370613af27aff2b7e61009b4f1

This replaces the img tag that we were using and uses background-image instead. background-size: cover then keeps it contained in an aspect ratio similar to what is used on the front-end. For most images the preview should be relatively close, though things will appear different the further they get from the 16/5 ratio that we apply.

Actions #8

Updated by Raymond Hoh 10 months ago

This replaces the img tag that we were using and uses background-image instead. background-size: cover then keeps it contained in an aspect ratio similar to what is used on the front-end.

That works way better than what I was doing. Thanks Jeremy! For those that want to test, these changes are available for testing on cdev.

Actions #9

Updated by scott voth 10 months ago

I tested on cdev and it is working great! Thanks.

Actions #10

Updated by Boone Gorges 10 months ago

  • Status changed from New to Staged for Production Release
Actions #11

Updated by Boone Gorges 10 months ago

  • Status changed from Staged for Production Release to Resolved
Actions

Also available in: Atom PDF