Update design

[derzeiss]

• Mobile-Design abgeschafft zugunsten eines desktopfreundlicheren
• Handy-Frame / Rahmen entfernt
• Layout vereinfacht, optionale Emojis entfernt, utility-classes m-top & m-bottom entfernt
• Theme-Editor leicht überarbeitet, da das Layout für Workshop-Teilnehmer häufig verwirrend war.
• .stackblitzrc hinzugefügt, sodass wir in Zukunft einfach einen Link als iFrame in die Aufgabe packen können anstatt eines Screenshots. Beispiel mit aktuellem Schritt 1:

  <iframe style="display: block;width: 100%;max-width: 800px;margin: auto;aspect-ratio: 16 / 10;border: none;" src="https://stackblitz.com/github/workshops-de/react-typescript-workshop/tree/01-initialize-project-using-create-react-app?embed=1&hideExplorer=1&hideNavigation=1&view=preview"></iframe>
  

  Link zum selbst ausprobieren: https://stackblitz.com/github/workshops-de/react-typescript-workshop/tree/01-initialize-project-using-create-react-app?embed=1&hideExplorer=1&hideNavigation=1&view=preview

Noch offen:

• Testen, inwiefern das Design auch in jedem Einzelschritt des Workshops funktioniert
• Testen auf Fehlertoleranz (was passiert, wenn ich kein perfektes Layout nutze? Z.B. Klassen vergesse oder andere HTML Elemente / Struktur nutze?)
• Alle Tags entsprechend anpassen

Preview der Änderungen:
https://stackblitz.com/github/workshops-de/react-typescript-workshop/tree/update-design?embed=1&hideExplorer=1&hideNavigation=1&view=preview
Preview inkl. Editor:
https://stackblitz.com/github/workshops-de/react-typescript-workshop/tree/update-design