Improve intro page

Author: garronej

stories/RotatingLogo.tsx

@@ -30,17 +30,17 @@ export const RotatingLogo = memo((props: Props) => {
     });
     return (
         <div id={id} className={classes.root} style={style}>
+            <img
+                className={classes.stillImg}
+                src={keycloakifyLogoHeroStillPngUrl}
+                alt={"keyhole"}
+            />
             <img
                 className={classes.rotatingImg}
                 onLoad={onLoad}
                 src={keycloakifyLogoHeroMovingPngUrl}
                 alt={"Rotating react logo"}
             />
-            <img
-                className={classes.stillImg}
-                src={keycloakifyLogoHeroStillPngUrl}
-                alt={"keyhole"}
-            />
         </div>
     );
 });

stories/assets/logo-in.png

@@ -20,10 +20,20 @@ import { RotatingLogo } from "./RotatingLogo";
 <RotatingLogo style={{ "width": 250 }} />
 </div>
 <br/>
-🇫🇷 <i><a href="https://www.systeme-de-design.gouv.fr/">French State Design System</a> React integration</i> 🇫🇷 
+🇫🇷 <i>The <a href="https://www.systeme-de-design.gouv.fr/">French State Design System</a> React toolkit</i> 🇫🇷 
+<br/>
+
+[Github](https://github.com/codegouvfr/react-dsfr) - [Documentation](https://react-dsfr.etalab.studio/)
+
+<iframe width="560" height="315" src="https://www.youtube.com/embed/5q88JgXUAY4" title="YouTube video player" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share" allowfullscreen></iframe>
+
+<br/>
 
-This website documents the React components featured by [@codegouvfr/react-dsfr](https://github.com/codegouvfr/react-dsfr).  
-🏁 If you're just getting started heads over to the 👉 [Guides](https://react-dsfr.etalab.studio/) 👈.
+This Storybook website serves as your daily companion for developing with React-DSFR. 
+It not only provides visibility into the available components but also allows you to preview them in various states, 
+enabling you to copy and paste the code directly into your project. 
 
+Additionally, this website features a handy [color helper tool](/?path=/docs/%F0%9F%8E%A8-color-helper--page). 
+This tool empowers you to navigate through the DSFR color palette and choose the most fitting shades for your specific use cases.  
 
 </div>