fix: content fixes (images, deadlink)

.github/workflows/checkout-test-build-deploy.yml

@@ -25,7 +25,7 @@ jobs:
     timeout-minutes: 5
     steps:
       - name: Checkout repository
-        uses: actions/checkout@v3
+        uses: actions/checkout@v4
 
       - name: Prepare
         uses: ./.github/actions/checkout-install

src/components/banner/Cutdown.vue

@@ -3,9 +3,9 @@
     <div class="banner--cutdown">
         <div class="cutdown_content">
             <picture>
-            <source media="(prefers-color-scheme: dark)" srcset="../../foundations/accessibility/[email protected] 4x">
+            <source media="(prefers-color-scheme: dark)" srcset="/foundations/accessibility/[email protected] 4x">
 
-            <img class="cutdown__thumbnail" decoding="async" loading="lazy" alt="A sketch of the Accessibility icon. The image is tinted in shades of green." srcset="../../foundations/accessibility/foundations-accessibility-intro.png 4x" src="../../foundations/accessibility/foundations-accessibility-intro.png" width="100%" height="auto">
+            <img class="cutdown__thumbnail" decoding="async" loading="lazy" alt="A sketch of the Accessibility icon. The image is tinted in shades of green." srcset="/foundations/accessibility/foundations-accessibility-intro.png 4x" src="/foundations/accessibility/foundations-accessibility-intro.png" width="100%" height="auto">
             </picture>
             <div class="left">
                 <div class="h-label"><slot name="eyebrow">{{ eyebrow }}</slot></div>

src/components/getstarted/HowToIntegrateResources.vue

@@ -7,17 +7,17 @@
       You can access and download the kit directly from our Figma account. Make sure you're signed in to Figma to download the file.
       </p>
       <picture>
-        <source media="(prefers-color-scheme: dark)" srcset="../../foundations/getstarted/[email protected] 4x">
+        <source media="(prefers-color-scheme: dark)" srcset="/foundations/getstarted/[email protected] 4x">
 
-        <img decoding="async" loading="lazy" alt="A sketch of the Accessibility icon. The image is tinted in shades of green." srcset="../../foundations/getstarted/foundations-getstarted-figma--download.png 4x" src="../../foundations/getstarted/foundations-getstarted-figma--download.png" width="100%" height="auto">
+        <img decoding="async" loading="lazy" alt="A sketch of the Accessibility icon. The image is tinted in shades of green." srcset="/foundations/getstarted/foundations-getstarted-figma--download.png 4x" src="/foundations/getstarted/foundations-getstarted-figma--download.png" width="100%" height="auto">
       </picture>
     </div>
       <div class="HowToIntegrateResources_subgrid">
         <div>
         <picture>
-          <source media="(prefers-color-scheme: dark)" srcset="../../foundations/getstarted/[email protected] 2x">
+          <source media="(prefers-color-scheme: dark)" srcset="/foundations/getstarted/[email protected] 2x">
 
-          <img decoding="async" loading="lazy" alt="A sketch of the Accessibility icon. The image is tinted in shades of green." srcset="../../foundations/getstarted/foundations-getstarted-figma--integrate.png 2x" src="../../foundations/getstarted/foundations-getstarted-figma--integrate.png" width="100%" height="auto">
+          <img decoding="async" loading="lazy" alt="A sketch of the Accessibility icon. The image is tinted in shades of green." srcset="/foundations/getstarted/foundations-getstarted-figma--integrate.png 2x" src="/foundations/getstarted/foundations-getstarted-figma--integrate.png" width="100%" height="auto">
         </picture>
         <p>
           <h3>Publish library to your workspace</h3> 
@@ -26,9 +26,9 @@
         </div>
         <div>
           <picture>
-            <source media="(prefers-color-scheme: dark)" srcset="../../foundations/getstarted/[email protected] 2x">
+            <source media="(prefers-color-scheme: dark)" srcset="/foundations/getstarted/[email protected] 2x">
 
-            <img decoding="async" loading="lazy" alt="A sketch of the Accessibility icon. The image is tinted in shades of green." srcset="../../foundations/getstarted/foundations-getstarted-figma--customize.png 2x" src="../../foundations/getstarted/foundations-getstarted-figma--customize.png" width="100%" height="auto">
+            <img decoding="async" loading="lazy" alt="A sketch of the Accessibility icon. The image is tinted in shades of green." srcset="/foundations/getstarted/foundations-getstarted-figma--customize.png 2x" src="/foundations/getstarted/foundations-getstarted-figma--customize.png" width="100%" height="auto">
           </picture>
           <p>
           <h3>Add library to your design files</h3> 

src/foundations/accessibility.md

@@ -19,9 +19,9 @@ import Cutdown from "../components/banner/Cutdown.vue";
 At Shopware, we are committed to creating inclusive and barrier-free shopping experiences for our valued merchants and their customers.
 
 <picture>
-<source media="(prefers-color-scheme: dark)" srcset="../foundations/accessibility/[email protected] 4x">
+<source media="(prefers-color-scheme: dark)" srcset="/foundations/accessibility/[email protected] 4x">
 
-<img decoding="async" loading="lazy" alt="A sketch of the Accessibility icon. The image is tinted in shades of green." srcset="../foundations/accessibility/foundations-accessibility-intro.png 4x" src="../foundations/accessibility/foundations-accessibility-intro.png" width="100%" height="auto">
+<img decoding="async" loading="lazy" alt="A sketch of the Accessibility icon. The image is tinted in shades of green." srcset="/foundations/accessibility/foundations-accessibility-intro.png 4x" src="/foundations/accessibility/foundations-accessibility-intro.png" width="100%" height="auto">
 </picture>
 
 ## Shopware is for everyone 

src/foundations/human-ai-interation.md

@@ -36,9 +36,9 @@ The count is: {{ count }}
 Designing for Human-AI interaction requires a user-centric approach that prioritizes ease of use, clear communication, and continuous improvement. By following these guidelines, you can create an AI feature that seamlessly integrates with the merchants workflow and enhances their productivity and efficiency.
 
 <picture>
-<source media="(prefers-color-scheme: dark)" srcset="../foundations/principles/human-ai-interactions/[email protected] 4x">
+<source media="(prefers-color-scheme: dark)" srcset="/foundations/principles/human-ai-interactions/[email protected] 4x">
 
-<img decoding="async" loading="lazy" alt="A sketch of three circles overlaying each other. The image is tinted in shades of blue." srcset="../foundations/principles/human-ai-interactions/foundations-human--ai--interactions-intro.png 4x" src="../foundations/principles/human-ai-interactions/foundations-human--ai--interactions-intro.png" width="100%" height="auto">
+<img decoding="async" loading="lazy" alt="A sketch of three circles overlaying each other. The image is tinted in shades of blue." srcset="/foundations/principles/human-ai-interactions/foundations-human--ai--interactions-intro.png 4x" src="/foundations/principles/human-ai-interactions/foundations-human--ai--interactions-intro.png" width="100%" height="auto">
 </picture>
 
 ### Initially
@@ -74,6 +74,6 @@ Therefore, merchants must be able to review or preview AI-generated content befo
 
 ---
 
-[Learn more about UX Writing for Human-AI Interactions](/Product/Guides/Design/DesignSystem/HumanAIInteraction/UXWriting/)
+<!--[Learn more about UX Writing for Human-AI Interactions](/Product/Guides/Design/DesignSystem/HumanAIInteraction/UXWriting/)-->
 
 ---

src/foundations/index.md

@@ -24,9 +24,9 @@ import SwagTeam from "../components/team/SwagTeam.vue";
 Our Product Design Principles reflect how we think about design. They provide a way for us to look at the work we create and how we create it: **Building the right thing; building the thing right – distinctively Shopware.**
 
 <picture>
-<source media="(prefers-color-scheme: dark)" srcset="../foundations/principles/[email protected] 4x">
+<source media="(prefers-color-scheme: dark)" srcset="/foundations/principles/[email protected] 4x">
 
-<img decoding="async" loading="lazy" alt="A sketch of three circles overlaying each other. The image is tinted in shades of blue." srcset="../foundations/principles/foundations-design--principles-intro.png 4x" src="../foundations/principles/foundations-design--principles-intro.png" width="100%" height="auto">
+<img decoding="async" loading="lazy" alt="A sketch of three circles overlaying each other. The image is tinted in shades of blue." srcset="/foundations/principles/foundations-design--principles-intro.png 4x" src="/foundations/principles/foundations-design--principles-intro.png" width="100%" height="auto">
 </picture>
 
 >These Principles are the foundation of Shopware's products and services, they're important whether you work at Shopware or you're developing apps or other solutions for Shopware's eco-system. 

src/get-started/index.md

@@ -31,9 +31,9 @@ import NPM from "../components/interaction/NPM.vue";
   Meteor is Shopware’s open source design system – It is the basis of the Shopware Design Language, manifested in a unified system of components, styles, visuals and guidelines. It is therefore, the foundation for all of Shopware’s products. It helps us work together more efficiently and provides a unified process across teams to build empowering and delightful experiences for everyone.
   </p>
   <picture>
-  <source media="(prefers-color-scheme: dark)" srcset="../foundations/getstarted/[email protected] 4x">
+  <source media="(prefers-color-scheme: dark)" srcset="/foundations/getstarted/[email protected] 4x">
 
-  <img decoding="async" loading="lazy" alt="A sketch of the Accessibility icon. The image is tinted in shades of green." srcset="../foundations/getstarted/foundations-getstarted-intro.png 4x" src="../foundations/getstarted/foundations-getstarted-intro.png" width="100%" height="auto">
+  <img decoding="async" loading="lazy" alt="A sketch of the Accessibility icon. The image is tinted in shades of green." srcset="/foundations/getstarted/foundations-getstarted-intro.png 4x" src="/foundations/getstarted/foundations-getstarted-intro.png" width="100%" height="auto">
   </picture>
 
 

src/index.md

@@ -36,8 +36,8 @@ import NPM from "./components/interaction/NPM.vue";
     </template>
     <template #image>
     <picture>
-    <source media="(prefers-color-scheme: dark)" srcset="./home/[email protected] 4x">
-    <img decoding="async" loading="lazy" alt="A sketch of the Accessibility icon. The image is tinted in shades of green." srcset="./home/design-hero.png 4x" src="./home/design-hero.png" width="100%" height="auto">
+    <source media="(prefers-color-scheme: dark)" srcset="/home/[email protected] 4x">
+    <img decoding="async" loading="lazy" alt="A sketch of the Accessibility icon. The image is tinted in shades of green." srcset="/home/design-hero.png 4x" src="/home/design-hero.png" width="100%" height="auto">
     </picture>
     </template>
 </SwagDesignHero>

src/team/index.md

@@ -24,8 +24,8 @@ import SwagTeamValuesMarquee from "../components/team/SwagTeamValuesMarquee.vue"
     <template #content><p>At Shopware, we're not just a design team – we're a crew of passionate individuals driven by innovation, rebellion, deep thinking, and creativity. We are united by a common passion for pushing boundaries and redefining the norm of commerce.</p></template>
     <template #image>
     <picture>
-    <source media="(prefers-color-scheme: dark)" srcset="../home/[email protected] 4x">
-    <img decoding="async" loading="lazy" alt="A sketch of the Accessibility icon. The image is tinted in shades of green." srcset="../home/design-hero.png 4x" src="../home/design-hero.png" width="100%" height="auto">
+    <source media="(prefers-color-scheme: dark)" srcset="/home/[email protected] 4x">
+    <img decoding="async" loading="lazy" alt="A sketch of the Accessibility icon. The image is tinted in shades of green." srcset="/home/design-hero.png 4x" src="/home/design-hero.png" width="100%" height="auto">
     </picture>
     </template>
 </SwagTeamHero>