From 1611c6dbc2e1e561e2a4ce1b93f4099344a58672 Mon Sep 17 00:00:00 2001
From: Abhishek Jakhar <abhishekjakhar.11@gmail.com>
Date: Wed, 21 Oct 2020 11:33:00 +0530
Subject: [PATCH] fix: responsive of page example in storybook (#3005)

* fix the responsive of page stories in story book

* fix the typo in Example header of Page stories

* add changeset
---
 .changeset/tough-weeks-pull.md                 | 5 +++++
 packages/core/src/layout/Page/Page.stories.tsx | 6 +++---
 2 files changed, 8 insertions(+), 3 deletions(-)
 create mode 100644 .changeset/tough-weeks-pull.md

diff --git a/.changeset/tough-weeks-pull.md b/.changeset/tough-weeks-pull.md
new file mode 100644
index 0000000000..e79355de90
--- /dev/null
+++ b/.changeset/tough-weeks-pull.md
@@ -0,0 +1,5 @@
+---
+'@backstage/core': patch
+---
+
+fix the responsive of page story
diff --git a/packages/core/src/layout/Page/Page.stories.tsx b/packages/core/src/layout/Page/Page.stories.tsx
index b3a75c19e9..3b1dd07c7a 100644
--- a/packages/core/src/layout/Page/Page.stories.tsx
+++ b/packages/core/src/layout/Page/Page.stories.tsx
@@ -118,14 +118,14 @@ const DataGrid = () => (
         justify="space-between"
         direction="row"
       >
-        <Grid item xs={6}>
+        <Grid item xs={12} md={6}>
           <GaugeCard
             title="GKE Usage Score"
             subheader="This should be above 75%"
             progress={0.87}
           />
         </Grid>
-        <Grid item xs={6}>
+        <Grid item xs={12} md={6}>
           <GaugeCard
             title="Deployment Score"
             subheader="This should be above 40%"
@@ -174,7 +174,7 @@ const DataGrid = () => (
 );
 
 const ExampleHeader = () => (
-  <Header title="Example" subtitle="This an example plugin">
+  <Header title="Example" subtitle="This is an example plugin">
     <HeaderLabel label="Owner" value="Owner" />
     <HeaderLabel label="Lifecycle" value="Lifecycle" />
   </Header>