Using book cover sizes to prevent layout shifting

[anna-ayn]

Closes #9739

feature

Technical

• Added width and height methods to the Image class in openlibrary/core/models.py to retrieve image dimensions.
• Modified the OLCarousel.vue component to include a cover-container div and set default cover image dimensions. Also added responsive styles for different screen sizes.
• Updated the createActiveShowcaseItem function in ShowcaseItem.js to accept a desiredHeight parameter and set image dimensions dynamically based on the aspect ratio.
• Adjusted the book.less and listLists.less styles to set fixed dimensions for cover images, ensuring consistent layout across different components.
• Modified the search-result-item.less to remove the .bookcover class and ensure consistent image sizing.
• Updated index.less to remove the max-width constraint on images within the content body.
• Updated the book_cover.html template to calculate and set the height of the cover image dynamically based on its aspect ratio.
• Adjusted the lists/home.html template to calculate and set the height of the cover image dynamically based on its aspect ratio.

Testing

1. Navigate to pages where book covers are displayed.
2. Verified that the book covers load with the correct dimensions.
3. Ensured that the layout remains stable and does not shift when the images are loaded.
4. Tested the changes on various devices and screen sizes to confirm responsiveness.

Screenshot

We have make videos demonstrating the changes and comparing with the real website of OpenLibrary;
https://drive.google.com/file/d/1RrzodyWAFDAS--mk5Y222Hjk95FYgMla/view?usp=sharing
https://drive.google.com/file/d/1BF7YWPcys6Ny2EuJ9ahkiIexsC1JjmCH/view?usp=sharing
https://drive.google.com/file/d/1UU0nRT32Oa0Bu_27FD6cN8tQES-QUqpQ/view?usp=sharing
https://drive.google.com/file/d/1qe68bcZtBNh2cbOEbi93z4s2u9XHgDtD/view?usp=sharing
https://drive.google.com/file/d/1rOheT5PNJi6iveGhcGpb589YsG9uEqXb/view?usp=drive_link

Stakeholders

@cdrini

[anna-ayn]

Hi @RayBB and @cdrini,

We have completed the modifications to standardize the sizes of book covers and prevent layout shifting in various sections of the site.

We would greatly appreciate your review and feedback on these changes. Thank you!