guardian / guardian/dotcom-rendering

Immersives: Image height

Open
#9,566 0 comments 0 reactions 0 assignees View on GitHub
maintenance Team Candidate: Articles and Publishing
Dominant language
TypeScript
Stars
274
Forks
34
Avg merge
2d 22h
Merged PRs (30d)
121

Description

### Web

#### Mobile breakpoints
* height: 60vh (double check with Design and the [Figma designs](https://www.figma.com/file/xPr2tZZger7pszcO075tAQ/New-Formats---April-23?type=design&node-id=3029-40003&mode=design&t=VwkAJJWEb9Kc0pca-4))

#### From desktop
* Whatever image height (probably `calc(90vh - 48px)` as per [this design](https://www.figma.com/file/xPr2tZZger7pszcO075tAQ/New-Formats---April-23?type=design&node-id=2659-33167&mode=design&t=VwkAJJWEb9Kc0pca-4)) makes 3 lines of headline visible
* The bottom of the image should align with the baseline of the 2nd line of the headline text

Note: Please check with Design all the breakpoints

### Apps
Whatever it makes the bottom of the image appear roughly the same as Web. Check on device.

Contributor guide

Open the contributing guide

Assessment

This issue has not been assessed yet.

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.