Merge pull request #71 from shopware/product-experience

Fix flex container

src/foundations/human-ai-interation.md

@@ -53,8 +53,3 @@ Therefore, merchants must be able to review or preview AI-generated content befo
 - To differentiate human-generated content from AI-generated content, the AI Copilot icon or a light blue background behind generated text should be used to indicate AI-generated content visually.
 - Merchants should be able to remove, edit or update AI-generated content at any time.
 
----
-
-<!--[Learn more about UX Writing for Human-AI Interactions](/Product/Guides/Design/DesignSystem/HumanAIInteraction/UXWriting/)-->
-
----

src/product-experience/content/index.md

@@ -31,7 +31,7 @@ At Shopware, the tone of voice that fosters meaningful connections with our audi
 </picture>
 
 ## 🎯 Writing Goals and Principles
-<div class="grid gap-8 section-thumbnails mb-[12px]">
+<div class="flex gap-8 section-thumbnails mb-[12px]">
     <div class="section-thumbnails--card  md:max-w-1/2">
 <picture class="section-thumbnails--image">
 <source media="(prefers-color-scheme: dark)" srcset="/product-experience/[email protected] 4x">
@@ -51,7 +51,7 @@ At Shopware, the tone of voice that fosters meaningful connections with our audi
         <p>Treat readers with the respect they deserve. Put yourself in their shoes, and don’t patronise them. Remember that they have other things to do. Be considerate and inclusive.</p>
 </div>
 </div>
-<div class="grid gap-8 section-thumbnails mb-[12px]">
+<div class="flex gap-8 section-thumbnails mb-[12px]">
         <div class="section-thumbnails--card md:max-w-1/2">
 <picture class="section-thumbnails--image">
 <source media="(prefers-color-scheme: dark)" srcset="/product-experience/[email protected] 4x">
@@ -75,7 +75,7 @@ At Shopware, the tone of voice that fosters meaningful connections with our audi
 ## 💬 Our Approach
 In order to achieve these goals, we make sure our content adheres to these values.
 
-<div class="grid gap-8 section-thumbnails mb-[12px]">
+<div class="flex gap-8 section-thumbnails mb-[12px]">
     <div class="section-thumbnails--card  md:max-w-1/2">
 <picture class="section-thumbnails--image">
 <source media="(prefers-color-scheme: dark)" srcset="/product-experience/[email protected] 4x">
@@ -95,7 +95,7 @@ In order to achieve these goals, we make sure our content adheres to these value
         <p>Before you start writing, ask yourself: What purpose does this serve? Who is going to read it? What do they need to know?</p>
 </div>
 </div>
-<div class="grid gap-8 section-thumbnails mb-[42px]">
+<div class="flex gap-8 section-thumbnails mb-[42px]">
         <div class="section-thumbnails--card md:max-w-1/2">
 <picture class="section-thumbnails--image">
 <source media="(prefers-color-scheme: dark)" srcset="/product-experience/[email protected] 4x">

src/product-experience/index.md

@@ -15,7 +15,7 @@ swag:
 
 ## Content Guideance
 
-<div class="grid gap-8 section-thumbnails mb-[42px] md:max-w-12/12">
+<div class="flex gap-8 section-thumbnails mb-[42px] md:max-w-12/12">
     <div class="section-thumbnails--card md:max-w-1/3">
 <picture class="section-thumbnails--image">
 <source media="(prefers-color-scheme: dark)" srcset="/product-experience/[email protected] 4x">