adds information about how Blankslate adapts to narrow containers

primer · Nov 13, 2023 · fc0379e · fc0379e
1 parent 20316c9
commit fc0379e
Showing 1 changed file with 6 additions and 0 deletions.
diff --git a/content/components/blankslate.mdx b/content/components/blankslate.mdx
@@ -73,6 +73,12 @@ For first time user experiences, use illustration Blankslates to playfully engag
 
 ![first time user Blankslate](https://github.com/primer/design/assets/813754/3caf0160-d369-40b6-86dc-d2eac967a21d)
 
+## In a narrow container
+
+When a Blankslate is rendered in a narrow area, the spacing and font sizes are reduced so that it's visually proportional to the narrow area it's being rendered in. This is implemented using container queries, so this will happen on any viewport size.
+
+![Blankslate with smaller spacing and text](https://github.com/primer/design/assets/2313998/95cd99e1-5d8a-4b2d-849e-430d17f61d02)
+
 ## Accessibility
 
 ### Known accessibility issues (GitHub staff only)