ampproject / ampproject/amphtml

Text in a `2021-foreground` `amp-story-grid-layer` should not resize on vertical viewport change

Open
#36,258 2 comments 0 reactions 0 assignees View on GitHub
Type: Bug WG: stories
Dominant language
JavaScript
Stars
14.9k
Forks
4.1k
PR merge metrics
No merged PRs in 30d

Description

### Description

When adding text in a `2021-foreground` preset `amp-story-grid-layer`, the size grows as the viewport grows, while the grid layer itself doesn't. The layer's text size should be defined as a function of the layer height, not the viewport height.

This video makes it a bit clearer:

https://user-images.githubusercontent.com/4594196/136186959-b37e688d-b55a-4bc0-a47a-fdf209ee0bd7.mov

### Reproduction Steps

Add text to an `amp-story-grid-layer` with the `2021-foreground` preset, and resize the viewport to a size taller than the `69 / 116` layer aspect ratio. The text starts growing in size, but it shouldn't.

### Relevant Logs

_No response_

### Browser(s) Affected

_No response_

### OS(s) Affected

_No response_

### Device(s) Affected

_No response_

### AMP Version Affected

_No response_

Contributor guide

Open the contributing guide

Research direction

Start by reproducing the behavior with an amp-story-grid-layer using the 2021-foreground preset, following the viewport resize steps in the issue. Trace the implementation that sizes text relative to the layer and viewport; done means the text size remains tied to the layer height when the vertical viewport grows beyond the 69/116 aspect ratio.

Written by the indexing model from the issue text.

Assessment

Tech stack
javascript
Domain
frontend
Issue type
Bug
Difficulty
3/5
Estimated time
1-2 days
Activity status
Stale
Clarity
Mostly clear
Newbie friendliness
45/100

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.