From f237b33f23682a35ff10780036f06e8b841ffd52 Mon Sep 17 00:00:00 2001
From: Jeppe Reinhold <jeppe@reinhold.is>
Date: Wed, 5 Jul 2023 10:05:00 +0200
Subject: [PATCH] update image alts

---
 src/stories/Configure.mdx | 20 ++++++++++----------
 1 file changed, 10 insertions(+), 10 deletions(-)

diff --git a/src/stories/Configure.mdx b/src/stories/Configure.mdx
index 7d16096..89eef18 100644
--- a/src/stories/Configure.mdx
+++ b/src/stories/Configure.mdx
@@ -75,7 +75,7 @@ import Theming from "./assets/theming.png";
 <div className="sb-section">
   <div className="sb-features-grid">
     <div className="sb-grid-item">
-      <img src={Docs} alt="Document" />
+      <img src={Docs} alt="A screenshot showing the autodocs tag being set, pointing a docs page being generated" />
       <h3 className="sb-section-item-heading">Autodocs</h3>
       <p className="sb-section-item-paragraph">Auto-generate living,
         interactive reference documentation from your components and stories.</p>
@@ -85,7 +85,7 @@ import Theming from "./assets/theming.png";
       >Learn more<span className="sb-chevron">&#8250;</span></a>
     </div>
     <div className="sb-grid-item">
-      <img src={Share} alt="Share" />
+      <img src={Share} alt="A browser window showing a Storybook being published to a chromatic.com URL" />
       <h3 className="sb-section-item-heading">Publish to Chromatic</h3>
       <p className="sb-section-item-paragraph">Publish your Storybook to review and collaborate with your entire team.</p>
       <a
@@ -94,7 +94,7 @@ import Theming from "./assets/theming.png";
       >Learn more <span className="sb-chevron">&#8250;</span></a>
     </div>
     <div className="sb-grid-item">
-      <img src={FigmaPlugin} alt="Figma Plugin" />
+      <img src={FigmaPlugin} alt="Windows showing the Storybook plugin in Figma" />
       <h3 className="sb-section-item-heading">Figma Plugin</h3>
       <p className="sb-section-item-paragraph">Embed your stories into Figma to cross-reference the design and live
         implementation in one place.</p>
@@ -104,7 +104,7 @@ import Theming from "./assets/theming.png";
       >Learn more <span className="sb-chevron">&#8250;</span></a>
     </div>
     <div className="sb-grid-item">
-      <img src={Testing} alt="Testing" />
+      <img src={Testing} alt="Screenshot of tests passing and failing" />
       <h3 className="sb-section-item-heading">Testing</h3>
       <p className="sb-section-item-paragraph">Use stories to test a component in all its variations, no matter how
         complex.</p>
@@ -114,7 +114,7 @@ import Theming from "./assets/theming.png";
       >Learn more <span className="sb-chevron">&#8250;</span></a>
     </div>
     <div className="sb-grid-item">
-      <img src={Accessibility} alt="Accessibility" />
+      <img src={Accessibility} alt="Screenshot of accessibility tests passing and failing" />
       <h3 className="sb-section-item-heading">Accessibility</h3>
       <p className="sb-section-item-paragraph">Automatically test your components for a11y issues as you develop.</p>
       <a
@@ -123,7 +123,7 @@ import Theming from "./assets/theming.png";
       >Learn more <span className="sb-chevron">&#8250;</span></a>
     </div>
     <div className="sb-grid-item">
-      <img src={Theming} alt="Theming" />
+      <img src={Theming} alt="Screenshot of Storybook in light and dark mode" />
       <h3 className="sb-section-item-heading">Theming</h3>
       <p className="sb-section-item-paragraph">Theme Storybook's UI to personalize it to your project.</p>
       <a
@@ -136,7 +136,7 @@ import Theming from "./assets/theming.png";
 
 <div className="sb-section sb-explore-grid">
     <div className="sb-section-item">
-      <img src={Github} alt="Github" className="sb-explore-image"/>
+      <img src={Github} alt="Github logo" className="sb-explore-image"/>
       
       Join our contributors building the future of UI development.
 
@@ -146,7 +146,7 @@ import Theming from "./assets/theming.png";
       >Star on GitHub <span className="sb-chevron">&#8250;</span></a>
     </div>
     <div className="sb-section-item">
-      <img src={Discord} alt="Discord" className="sb-explore-image"/>
+      <img src={Discord} alt="Discord logo" className="sb-explore-image"/>
       <div>
         Get support and chat with frontend developers.
 
@@ -157,7 +157,7 @@ import Theming from "./assets/theming.png";
       </div>
     </div>
     <div className="sb-section-item">
-      <img src={Youtube} alt="Youtube" className="sb-explore-image"/>
+      <img src={Youtube} alt="Youtube logo" className="sb-explore-image"/>
       <div>
         Watch tutorials, feature previews and interviews.
 
@@ -168,7 +168,7 @@ import Theming from "./assets/theming.png";
       </div>
     </div>
     <div className="sb-section-item">
-      <img src={Tutorials} alt="Tutorials" className="sb-explore-image"/>
+      <img src={Tutorials} alt="A book" className="sb-explore-image"/>
       <div>
         Follow guided walkthroughs on for key workflows.