Added warning background color

ampproject · Apr 30, 2021 · 46d6a5b · 46d6a5b · alankent · Apr 30, 2021
1 parent 5b90892
commit 46d6a5b
Showing 1 changed file with 4 additions and 0 deletions.
diff --git a/extensions/amp-story/amp-story-grid-layer.md b/extensions/amp-story/amp-story-grid-layer.md
@@ -431,6 +431,10 @@ Use the `2021-foreground` preset for foreground elements. This layer will always
 Use the `2021-background` preset for the background layer. This preset covers the entire screen on most mobile phones with the background asset. It does so without letterboxing, and keeps positioning consistent with the foreground elements.
 While this technique provides the most consistent user experience, it may crop up to 7% of one or all borders of your background. Keep this in mind when designing and picking your assets.
 
+[tip type="warning"]
+This preset may show letterboxing on devices that don't have conventional phone screen sizes, such as tablets or foldable phones. You may change the background color of your pages to match the background for the best visual outcome.
+[/tip]
+
 <div layout="container" width="3" height="2">
   <div style="width:33%;display:inline-block">
     <amp-img src="https://github.com/ampproject/amphtml/raw/main/extensions/amp-story/img/preset_story_scaled.gif" layout="responsive" alt="Animation showing how a perfectly scaled with a 7.2% bleed-area adapts to different screen aspect ratios, always keeping content visible" width="200" height="350"/>