From 4626065b7c657987d9b5686d90a07bb961d915f8 Mon Sep 17 00:00:00 2001
From: Christian Cueni <christian.cueni@iterativ.ch>
Date: Mon, 24 Oct 2022 15:21:08 +0200
Subject: [PATCH] Add fake landing page

---
 client/pa11y.js                               |  22 ++++
 client/src/App.vue                            |   8 +-
 client/src/pages/CockpitPage.vue              |  83 +++++++++---
 package.json                                  |   3 +
 .../static/icons/demo/uk-lernpfad.svg         | 118 ++++++++++++++++++
 .../static/icons/demo/vm-lernpfad.svg         | 118 ++++++++++++++++++
 .../static/icons/icon-certificate.svg         |   8 ++
 server/vbv_lernwelt/static/icons/icon-pen.svg |   5 +
 8 files changed, 346 insertions(+), 19 deletions(-)
 create mode 100644 client/pa11y.js
 create mode 100644 server/vbv_lernwelt/static/icons/demo/uk-lernpfad.svg
 create mode 100644 server/vbv_lernwelt/static/icons/demo/vm-lernpfad.svg
 create mode 100644 server/vbv_lernwelt/static/icons/icon-certificate.svg
 create mode 100644 server/vbv_lernwelt/static/icons/icon-pen.svg

diff --git a/client/pa11y.js b/client/pa11y.js
new file mode 100644
index 00000000..22baec5e
--- /dev/null
+++ b/client/pa11y.js
@@ -0,0 +1,22 @@
+const pa11y = require("pa11y");
+
+async function runPa11y() {
+  try {
+    const results = await pa11y("http://localhost:8000/login?next=/", {
+      actions: [
+        "set field #username to admin",
+        "set field #password to test",
+        'click element [data-cy="login-button"]',
+        "wait for path to be /",
+        "navigate to http://localhost:8000/learn/versicherungsvermittlerin-lp/analyse",
+      ],
+    });
+    console.log(results);
+    // Do something with the results
+  } catch (error) {
+    console.log(error);
+    // Handle the error
+  }
+}
+
+runPa11y();
diff --git a/client/src/App.vue b/client/src/App.vue
index 7d453d8b..ec5f9370 100644
--- a/client/src/App.vue
+++ b/client/src/App.vue
@@ -1,12 +1,12 @@
 <template>
-  <div id="app" class="flex flex-col min-h-screen">
-    <MainNavigationBar class="flex-none" />
+  <div class="flex flex-col min-h-screen">
+    <MainNavigationBar class="flex-none"/>
     <RouterView v-slot="{ Component }" class="flex-auto">
       <Transition mode="out-in" name="app">
         <component :is="Component"></component>
       </Transition>
     </RouterView>
-    <AppFooter class="flex-none" />
+    <AppFooter class="flex-none"/>
   </div>
 </template>
 
@@ -15,7 +15,7 @@ import * as log from "loglevel";
 
 import AppFooter from "@/components/AppFooter.vue";
 import MainNavigationBar from "@/components/MainNavigationBar.vue";
-import { onMounted } from "vue";
+import {onMounted} from "vue";
 
 log.debug("App created");
 
diff --git a/client/src/pages/CockpitPage.vue b/client/src/pages/CockpitPage.vue
index b68150da..1c8e9c60 100644
--- a/client/src/pages/CockpitPage.vue
+++ b/client/src/pages/CockpitPage.vue
@@ -1,5 +1,5 @@
 <script setup lang="ts">
-import { useUserStore } from "@/stores/user";
+import {useUserStore} from "@/stores/user";
 import * as log from "loglevel";
 
 log.debug("CockpitView created");
@@ -8,22 +8,75 @@ const userStore = useUserStore();
 </script>
 
 <template>
-  <main class="py-4 lg:px-12 lg:py-12 bg-gray-200">
-    <div class="container-medium">
-      <h1 data-cy="welcome-message">Willkommen, {{ userStore.first_name }}</h1>
-
-      <h2 class="mt-12">Deine Kurse</h2>
-
-      <div class="mt-8 p-4 lg:p-8 break-words bg-white max-w-xl">
-        <h3>Versicherungsvermittler/in</h3>
-        <div class="mt-4">
-          <router-link class="btn-blue" to="/learn/versicherungsvermittlerin-lp">
-            Weiter geht's
-          </router-link>
+  <div class="flex flex-col lg:flex-row">
+    <main class="grow bg-gray-200 lg:order-2">
+      <div class="mt-14 container-medium">
+        <h1 data-cy="welcome-message">Willkommen, {{ userStore.first_name }}</h1>
+        <div class="mb-14">
+          <h2 class="mt-12 mb-3">Kurse</h2>
+          <div class="flex flex-col md:flex-row justify-between">
+            <div class="bg-white p-6 md:w-[48%] mb-4 md:mb-0">
+              <h3 class="mb-4">Versicherungsvermittler/in</h3>
+              <img class="mb-8 block" src="/static/icons/demo/vm-lernpfad.svg"/>
+              <router-link class="btn-blue" to="/learn/versicherungsvermittlerin-lp">
+                Weiter geht's
+              </router-link>
+            </div>
+            <div class="bg-white p-6 md:w-[48%]">
+              <h3 class="mb-4">Überbetriebliche Kurse</h3>
+              <img class="mb-8 block" src="/static/icons/demo/uk-lernpfad.svg"/>
+              <button
+                class="bg-green-500 font-semibold py-2 px-4 align-middle inline-block text-blue-900 border-2 border-green-500">
+                Abgeschlossen
+              </button>
+            </div>
+          </div>
+        </div>
+        <div>
+          <h3 class="mb-6">Termine</h3>
+          <ul class="p-4 bg-white">
+            <li class="flex flex-row border-b py-4">
+              <p class="text-bold w-60">Prüfung</p>
+              <p class="grow">Mo, 14. November 2022, 18 Uhr</p>
+              <p class="underline">Details anschauen</p>
+            </li>
+            <li class="flex flex-row border-b py-4">
+              <p class="text-bold w-60">Austausch mit Trainer</p>
+              <p class="grow">Fr, 24. November 2022, 11 Uhr</p>
+              <p class="underline">Details anschauen</p>
+            </li>
+            <li class="flex flex-row py-4">
+              <p class="text-bold w-60">Vernetzen - Live Session</p>
+              <p class="grow">Di, 4. Dezember 2022, 10.30 Uhr</p>
+              <p class="underline">Details anschauen</p>
+            </li>
+          </ul>
         </div>
       </div>
-    </div>
-  </main>
+    </main>
+    <aside class="lg:w-[343px] m-8 lg:order-1">
+      <div class="mx-auto text-center pb-6 mb-6 border-b">
+        <img class="rounded-full inline-block max-w-[150px] mb-4" :src="userStore.avatar_url"/>
+        <div>
+          <p class="text-bold">{{ userStore.first_name }} {{ userStore.last_name }}</p>
+          <p class="mb-4">{{ userStore.email }}</p>
+          <p>Profil bearbeiten
+            <it-icon-pen class="w-4 h-4"></it-icon-pen>
+          </p>
+        </div>
+      </div>
+      <div class="flex flex-row items-center">
+        <div class="rounded-full bg-sky-200 h-12 w-12 mr-4">
+          <it-icon-certificate class="h-6 w-6 block mx-auto pt-2"></it-icon-certificate>
+        </div>
+        <div>
+          <h4 class="text-bold">Zertifikat:</h4>
+          <p class="text-bold">Überbetriebliche Kurse</p>
+          <p>Erhalten am 20.11.2022</p>
+        </div>
+      </div>
+    </aside>
+  </div>
 </template>
 
 <style scoped></style>
diff --git a/package.json b/package.json
index ed702d91..49b7d73e 100644
--- a/package.json
+++ b/package.json
@@ -10,5 +10,8 @@
   },
   "devDependencies": {
     "cypress": "^10.6.0"
+  },
+  "dependencies": {
+    "pa11y": "^6.2.3"
   }
 }
diff --git a/server/vbv_lernwelt/static/icons/demo/uk-lernpfad.svg b/server/vbv_lernwelt/static/icons/demo/uk-lernpfad.svg
new file mode 100644
index 00000000..079e42f8
--- /dev/null
+++ b/server/vbv_lernwelt/static/icons/demo/uk-lernpfad.svg
@@ -0,0 +1,118 @@
+<svg viewBox="0 0 302 31" fill="none" xmlns="http://www.w3.org/2000/svg">
+    <path d="M13.4299 14.9995H286.296" stroke="#E0E5EC" stroke-width="2"/>
+    <ellipse cx="15.1816" cy="15.5" rx="14.9368" ry="15.5" fill="#54CE8B"/>
+    <line x1="30.6081" y1="16.5" x2="-1.52802e-05" y2="16.5" stroke="white" stroke-width="2"/>
+    <ellipse cx="15.3604" cy="15.5" rx="7.58692" ry="7.87302" fill="white"/>
+    <path d="M54.2919 21.3733L54.2919 31C58.9316 30.9339 63.0615 28.8962 65.9694 25.2383L58.4802 19.3199C57.4598 20.5245 55.9669 21.3063 54.2919 21.3733Z"
+          fill="#54CE8B"/>
+    <path d="M58.7889 18.9657L66.2468 24.9028C69.0582 21.1383 69.9824 16.8895 68.9962 12.2678L59.8007 14.4309C59.8627 14.7761 59.8961 15.1316 59.8961 15.4951C59.8961 16.7923 59.4844 17.9908 58.7889 18.9657Z"
+          fill="#54CE8B"/>
+    <path d="M59.6862 13.9575L62.5517 13.2866L68.8707 11.8073C67.7683 7.25936 64.8904 3.65496 60.7328 1.61629L56.758 10.2612C58.1849 11.0138 59.264 12.3494 59.687 13.9575L59.6862 13.9575Z"
+          fill="#54CE8B"/>
+    <path d="M54.088 9.63299C54.8854 9.63299 55.6448 9.79686 56.3368 10.0931L58.4406 5.50556L60.312 1.42618C56.0826 -0.512671 51.8144 -0.474855 47.6191 1.53884L50.4483 7.43731L51.7439 10.1372C52.4607 9.8142 53.2534 9.63299 54.0888 9.63299L54.088 9.63299Z"
+          fill="#54CE8B"/>
+    <path d="M51.3181 10.3506L47.1851 1.76326C43.0535 3.87823 40.2319 7.53929 39.2054 12.1131L48.4507 14.1045C48.8467 12.4844 49.905 11.1287 51.3181 10.3506Z"
+          fill="#54CE8B"/>
+    <path d="M48.2654 15.5181C48.2654 15.1908 48.2925 14.8706 48.343 14.5583L39.0952 12.5614C38.1868 17.1924 39.1852 21.4164 42.0642 25.123L46.0277 21.8628L49.4323 19.0623C48.7002 18.0757 48.2661 16.8477 48.2661 15.5173L48.2654 15.5181Z"
+          fill="#54CE8B"/>
+    <path d="M49.7284 19.3934L46.306 22.1913L42.3243 25.4467C45.31 29.0723 49.1872 30.9402 53.8568 31L53.8568 21.3715C52.2149 21.3054 50.7486 20.5549 49.7284 19.3934Z"
+          fill="#54CE8B"/>
+    <path d="M47.8793 15.624C47.8488 12.0864 50.651 9.22624 54.0977 9.19578C57.5443 9.16531 60.3953 11.9755 60.4258 15.5131C60.4563 19.0507 57.6542 21.9109 54.2075 21.9413C50.7608 21.9718 47.9098 19.1616 47.8793 15.624Z"
+          fill="white" stroke="white" stroke-width="3"/>
+    <path d="M93.0622 21.3733L93.0622 31C97.7019 30.9339 101.832 28.8962 104.74 25.2383L97.2505 19.3199C96.23 20.5245 94.7372 21.3063 93.0622 21.3733Z"
+          fill="#54CE8B"/>
+    <path d="M97.5591 18.9657L105.017 24.9028C107.828 21.1383 108.753 16.8895 107.766 12.2678L98.571 14.4309C98.633 14.7761 98.6663 15.1316 98.6663 15.4951C98.6663 16.7923 98.2546 17.9908 97.5591 18.9657Z"
+          fill="#54CE8B"/>
+    <path d="M98.4565 13.9575L101.322 13.2866L107.641 11.8073C106.539 7.25936 103.661 3.65496 99.5031 1.61629L95.5282 10.2612C96.9552 11.0138 98.0343 12.3494 98.4573 13.9575L98.4565 13.9575Z"
+          fill="#54CE8B"/>
+    <path d="M92.8582 9.63299C93.6556 9.63299 94.415 9.79686 95.107 10.0931L97.2109 5.50556L99.0823 1.42618C94.8528 -0.512671 90.5847 -0.474855 86.3893 1.53884L89.2185 7.43731L90.5142 10.1372C91.2309 9.8142 92.0237 9.63299 92.859 9.63299L92.8582 9.63299Z"
+          fill="#54CE8B"/>
+    <path d="M90.0884 10.3506L85.9553 1.76326C81.8238 3.87823 79.0022 7.53929 77.9757 12.1131L87.2209 14.1045C87.6169 12.4844 88.6752 11.1287 90.0884 10.3506Z"
+          fill="#54CE8B"/>
+    <path d="M87.0356 15.5181C87.0356 15.1908 87.0628 14.8706 87.1133 14.5583L77.8654 12.5614C76.957 17.1924 77.9555 21.4164 80.8344 25.123L84.798 21.8628L88.2026 19.0623C87.4704 18.0757 87.0364 16.8477 87.0364 15.5173L87.0356 15.5181Z"
+          fill="#54CE8B"/>
+    <path d="M88.4987 19.3934L85.0763 22.1913L81.0946 25.4467C84.0802 29.0723 87.9574 30.9402 92.627 31L92.627 21.3715C90.9852 21.3054 89.5189 20.5549 88.4987 19.3934Z"
+          fill="#54CE8B"/>
+    <path d="M86.6496 15.624C86.6191 12.0864 89.4212 9.22624 92.8679 9.19578C96.3146 9.16531 99.1656 11.9755 99.1961 15.5131C99.2266 19.0507 96.4244 21.9109 92.9777 21.9413C89.531 21.9718 86.6801 19.1616 86.6496 15.624Z"
+          fill="white" stroke="white" stroke-width="3"/>
+    <path d="M131.832 21.3733L131.832 31C136.472 30.9339 140.602 28.8962 143.51 25.2383L136.021 19.3199C135 20.5245 133.507 21.3063 131.832 21.3733Z"
+          fill="#54CE8B"/>
+    <path d="M136.329 18.9657L143.787 24.9028C146.599 21.1383 147.523 16.8895 146.537 12.2678L137.341 14.4309C137.403 14.7761 137.437 15.1316 137.437 15.4951C137.437 16.7923 137.025 17.9908 136.329 18.9657Z"
+          fill="#54CE8B"/>
+    <path d="M137.227 13.9575L140.092 13.2866L146.411 11.8073C145.309 7.25936 142.431 3.65496 138.273 1.61629L134.299 10.2612C135.725 11.0138 136.805 12.3494 137.228 13.9575L137.227 13.9575Z"
+          fill="#54CE8B"/>
+    <path d="M131.629 9.63299C132.426 9.63299 133.185 9.79686 133.877 10.0931L135.981 5.50556L137.853 1.42618C133.623 -0.512671 129.355 -0.474855 125.16 1.53884L127.989 7.43731L129.284 10.1372C130.001 9.8142 130.794 9.63299 131.629 9.63299L131.629 9.63299Z"
+          fill="#54CE8B"/>
+    <path d="M128.859 10.3506L124.726 1.76326C120.594 3.87823 117.772 7.53929 116.746 12.1131L125.991 14.1045C126.387 12.4844 127.445 11.1287 128.859 10.3506Z"
+          fill="#54CE8B"/>
+    <path d="M125.806 15.5181C125.806 15.1908 125.833 14.8706 125.884 14.5583L116.636 12.5614C115.727 17.1924 116.726 21.4164 119.605 25.123L123.568 21.8628L126.973 19.0623C126.241 18.0757 125.807 16.8477 125.807 15.5173L125.806 15.5181Z"
+          fill="#54CE8B"/>
+    <path d="M127.269 19.3934L123.847 22.1913L119.865 25.4467C122.851 29.0723 126.728 30.9402 131.397 31L131.397 21.3715C129.755 21.3054 128.289 20.5549 127.269 19.3934Z"
+          fill="#54CE8B"/>
+    <path d="M125.42 15.624C125.389 12.0864 128.191 9.22624 131.638 9.19577C135.085 9.16531 137.936 11.9755 137.966 15.5131C137.997 19.0507 135.195 21.9109 131.748 21.9413C128.301 21.9718 125.45 19.1616 125.42 15.624Z"
+          fill="white" stroke="white" stroke-width="3"/>
+    <path d="M170.603 21.3733L170.603 31C175.242 30.9339 179.372 28.8962 182.28 25.2383L174.791 19.3199C173.771 20.5245 172.278 21.3063 170.603 21.3733Z"
+          fill="#54CE8B"/>
+    <path d="M175.1 18.9657L182.558 24.9028C185.369 21.1383 186.293 16.8895 185.307 12.2678L176.111 14.4309C176.174 14.7761 176.207 15.1316 176.207 15.4951C176.207 16.7923 175.795 17.9908 175.1 18.9657Z"
+          fill="#54CE8B"/>
+    <path d="M175.997 13.9575L178.863 13.2866L185.182 11.8073C184.079 7.25936 181.201 3.65496 177.044 1.61629L173.069 10.2612C174.496 11.0138 175.575 12.3494 175.998 13.9575L175.997 13.9575Z"
+          fill="#54CE8B"/>
+    <path d="M170.399 9.63299C171.196 9.63299 171.956 9.79686 172.648 10.0931L174.751 5.50556L176.623 1.42618C172.393 -0.512671 168.125 -0.474855 163.93 1.53884L166.759 7.43731L168.055 10.1372C168.771 9.8142 169.564 9.63299 170.4 9.63299L170.399 9.63299Z"
+          fill="#54CE8B"/>
+    <path d="M167.629 10.3506L163.496 1.76326C159.364 3.87823 156.543 7.53929 155.516 12.1131L164.761 14.1045C165.157 12.4844 166.216 11.1287 167.629 10.3506Z"
+          fill="#54CE8B"/>
+    <path d="M164.576 15.5181C164.576 15.1908 164.603 14.8706 164.654 14.5583L155.406 12.5614C154.498 17.1924 155.496 21.4164 158.375 25.123L162.339 21.8628L165.743 19.0623C165.011 18.0757 164.577 16.8477 164.577 15.5173L164.576 15.5181Z"
+          fill="#54CE8B"/>
+    <path d="M166.039 19.3934L162.617 22.1913L158.635 25.4467C161.621 29.0723 165.498 30.9402 170.168 31L170.168 21.3715C168.526 21.3054 167.059 20.5549 166.039 19.3934Z"
+          fill="#54CE8B"/>
+    <path d="M164.19 15.624C164.16 12.0864 166.962 9.22624 170.409 9.19577C173.855 9.16531 176.706 11.9755 176.737 15.5131C176.767 19.0507 173.965 21.9109 170.518 21.9413C167.072 21.9718 164.221 19.1616 164.19 15.624Z"
+          fill="white" stroke="white" stroke-width="3"/>
+    <path d="M209.373 21.3733L209.373 31C214.013 30.9339 218.143 28.8962 221.051 25.2383L213.561 19.3199C212.541 20.5245 211.048 21.3063 209.373 21.3733Z"
+          fill="#54CE8B"/>
+    <path d="M213.87 18.9657L221.328 24.9028C224.139 21.1383 225.063 16.8895 224.077 12.2678L214.882 14.4309C214.944 14.7761 214.977 15.1316 214.977 15.4951C214.977 16.7923 214.565 17.9908 213.87 18.9657Z"
+          fill="#54CE8B"/>
+    <path d="M214.767 13.9575L217.633 13.2866L223.952 11.8073C222.849 7.25936 219.972 3.65496 215.814 1.61629L211.839 10.2612C213.266 11.0138 214.345 12.3494 214.768 13.9575L214.767 13.9575Z"
+          fill="#54CE8B"/>
+    <path d="M209.169 9.63299C209.966 9.63299 210.726 9.79686 211.418 10.0931L213.522 5.50556L215.393 1.42618C211.164 -0.512671 206.895 -0.474855 202.7 1.53884L205.529 7.43731L206.825 10.1372C207.542 9.8142 208.334 9.63299 209.17 9.63299L209.169 9.63299Z"
+          fill="#54CE8B"/>
+    <path d="M206.399 10.3506L202.266 1.76326C198.135 3.87823 195.313 7.53929 194.286 12.1131L203.532 14.1045C203.928 12.4844 204.986 11.1287 206.399 10.3506Z"
+          fill="#54CE8B"/>
+    <path d="M203.346 15.5181C203.346 15.1908 203.374 14.8706 203.424 14.5583L194.176 12.5614C193.268 17.1924 194.266 21.4164 197.145 25.123L201.109 21.8628L204.513 19.0623C203.781 18.0757 203.347 16.8477 203.347 15.5173L203.346 15.5181Z"
+          fill="#54CE8B"/>
+    <path d="M204.809 19.3934L201.387 22.1913L197.405 25.4467C200.391 29.0723 204.268 30.9402 208.938 31L208.938 21.3715C207.296 21.3054 205.83 20.5549 204.809 19.3934Z"
+          fill="#54CE8B"/>
+    <path d="M202.96 15.624C202.93 12.0864 205.732 9.22624 209.179 9.19577C212.625 9.16531 215.476 11.9755 215.507 15.5131C215.537 19.0507 212.735 21.9109 209.289 21.9413C205.842 21.9718 202.991 19.1616 202.96 15.624Z"
+          fill="white" stroke="white" stroke-width="3"/>
+    <path d="M248.143 21.3733L248.143 31C252.783 30.9339 256.913 28.8962 259.821 25.2383L252.332 19.3199C251.311 20.5245 249.818 21.3063 248.143 21.3733Z"
+          fill="#54CE8B"/>
+    <path d="M252.64 18.9657L260.098 24.9028C262.91 21.1383 263.834 16.8895 262.847 12.2678L253.652 14.4309C253.714 14.7761 253.747 15.1316 253.747 15.4951C253.747 16.7923 253.336 17.9908 252.64 18.9657Z"
+          fill="#54CE8B"/>
+    <path d="M253.538 13.9575L256.403 13.2866L262.722 11.8073C261.62 7.25936 258.742 3.65496 254.584 1.61629L250.609 10.2612C252.036 11.0138 253.115 12.3494 253.538 13.9575L253.538 13.9575Z"
+          fill="#54CE8B"/>
+    <path d="M247.939 9.63299C248.737 9.63299 249.496 9.79686 250.188 10.0931L252.292 5.50556L254.163 1.42618C249.934 -0.512671 245.666 -0.474855 241.47 1.53884L244.3 7.43731L245.595 10.1372C246.312 9.8142 247.105 9.63299 247.94 9.63299L247.939 9.63299Z"
+          fill="#54CE8B"/>
+    <path d="M245.169 10.3506L241.036 1.76326C236.905 3.87823 234.083 7.53929 233.057 12.1131L242.302 14.1045C242.698 12.4844 243.756 11.1287 245.169 10.3506Z"
+          fill="#54CE8B"/>
+    <path d="M242.117 15.5181C242.117 15.1908 242.144 14.8706 242.194 14.5583L232.947 12.5614C232.038 17.1924 233.037 21.4164 235.916 25.123L239.879 21.8628L243.284 19.0623C242.552 18.0757 242.118 16.8477 242.118 15.5173L242.117 15.5181Z"
+          fill="#54CE8B"/>
+    <path d="M243.58 19.3934L240.157 22.1913L236.176 25.4467C239.161 29.0723 243.038 30.9402 247.708 31L247.708 21.3715C246.066 21.3054 244.6 20.5549 243.58 19.3934Z"
+          fill="#54CE8B"/>
+    <path d="M241.731 15.624C241.7 12.0864 244.502 9.22624 247.949 9.19577C251.396 9.16531 254.247 11.9755 254.277 15.5131C254.308 19.0507 251.506 21.9109 248.059 21.9413C244.612 21.9718 241.761 19.1616 241.731 15.624Z"
+          fill="white" stroke="white" stroke-width="3"/>
+    <path d="M286.914 21.3733L286.914 31C291.553 30.9339 295.683 28.8962 298.591 25.2383L291.102 19.3199C290.081 20.5245 288.589 21.3063 286.914 21.3733Z"
+          fill="#54CE8B"/>
+    <path d="M291.41 18.9657L298.868 24.9028C301.68 21.1383 302.604 16.8895 301.618 12.2678L292.422 14.4309C292.484 14.7761 292.518 15.1316 292.518 15.4951C292.518 16.7923 292.106 17.9908 291.41 18.9657Z"
+          fill="#54CE8B"/>
+    <path d="M292.308 13.9575L295.173 13.2866L301.492 11.8073C300.39 7.25936 297.512 3.65496 293.354 1.61629L289.38 10.2612C290.806 11.0138 291.886 12.3494 292.309 13.9575L292.308 13.9575Z"
+          fill="#54CE8B"/>
+    <path d="M286.71 9.63299C287.507 9.63299 288.266 9.79686 288.958 10.0931L291.062 5.50556L292.934 1.42618C288.704 -0.512671 284.436 -0.474855 280.241 1.53884L283.07 7.43731L284.365 10.1372C285.082 9.8142 285.875 9.63299 286.71 9.63299L286.71 9.63299Z"
+          fill="#54CE8B"/>
+    <path d="M283.94 10.3506L279.807 1.76326C275.675 3.87823 272.853 7.53929 271.827 12.1131L281.072 14.1045C281.468 12.4844 282.527 11.1287 283.94 10.3506Z"
+          fill="#54CE8B"/>
+    <path d="M280.887 15.5181C280.887 15.1908 280.914 14.8706 280.965 14.5583L271.717 12.5614C270.808 17.1924 271.807 21.4164 274.686 25.123L278.649 21.8628L282.054 19.0623C281.322 18.0757 280.888 16.8477 280.888 15.5173L280.887 15.5181Z"
+          fill="#54CE8B"/>
+    <path d="M282.35 19.3934L278.928 22.1913L274.946 25.4467C277.932 29.0723 281.809 30.9402 286.478 31L286.478 21.3715C284.836 21.3054 283.37 20.5549 282.35 19.3934Z"
+          fill="#54CE8B"/>
+    <path d="M280.501 15.624C280.47 12.0864 283.273 9.22624 286.719 9.19577C290.166 9.16531 293.017 11.9755 293.047 15.5131C293.078 19.0507 290.276 21.9109 286.829 21.9413C283.382 21.9718 280.531 19.1616 280.501 15.624Z"
+          fill="white" stroke="white" stroke-width="3"/>
+</svg>
diff --git a/server/vbv_lernwelt/static/icons/demo/vm-lernpfad.svg b/server/vbv_lernwelt/static/icons/demo/vm-lernpfad.svg
new file mode 100644
index 00000000..22ec903a
--- /dev/null
+++ b/server/vbv_lernwelt/static/icons/demo/vm-lernpfad.svg
@@ -0,0 +1,118 @@
+<svg viewBox="0 0 302 31" fill="none" xmlns="http://www.w3.org/2000/svg">
+    <path d="M13.4299 14.9995H286.296" stroke="#E0E5EC" stroke-width="2"/>
+    <ellipse cx="15.1816" cy="15.5" rx="14.9368" ry="15.5" fill="#54CE8B"/>
+    <line x1="30.6081" y1="16.5" x2="1.52374e-05" y2="16.5" stroke="white" stroke-width="2"/>
+    <ellipse cx="15.3604" cy="15.5" rx="7.58692" ry="7.87302" fill="white"/>
+    <path d="M54.2919 21.3733L54.2919 31C58.9316 30.9339 63.0615 28.8962 65.9694 25.2383L58.4802 19.3199C57.4598 20.5245 55.9669 21.3063 54.2919 21.3733Z"
+          fill="#54CE8B"/>
+    <path d="M58.7889 18.9657L66.2468 24.9028C69.0582 21.1383 69.9824 16.8895 68.9962 12.2678L59.8007 14.4309C59.8627 14.7761 59.8961 15.1316 59.8961 15.4951C59.8961 16.7923 59.4844 17.9908 58.7889 18.9657Z"
+          fill="#54CE8B"/>
+    <path d="M59.6862 13.9575L62.5517 13.2866L68.8707 11.8073C67.7683 7.25936 64.8904 3.65496 60.7328 1.61629L56.758 10.2612C58.1849 11.0138 59.264 12.3494 59.687 13.9575L59.6862 13.9575Z"
+          fill="#54CE8B"/>
+    <path d="M54.088 9.63299C54.8854 9.63299 55.6448 9.79686 56.3368 10.0931L58.4406 5.50556L60.312 1.42618C56.0826 -0.512671 51.8144 -0.474855 47.6191 1.53884L50.4483 7.43731L51.7439 10.1372C52.4607 9.8142 53.2534 9.63299 54.0888 9.63299L54.088 9.63299Z"
+          fill="#54CE8B"/>
+    <path d="M51.3181 10.3506L47.1851 1.76326C43.0535 3.87823 40.2319 7.53929 39.2054 12.1131L48.4507 14.1045C48.8467 12.4844 49.905 11.1287 51.3181 10.3506Z"
+          fill="#54CE8B"/>
+    <path d="M48.2654 15.5181C48.2654 15.1908 48.2926 14.8706 48.343 14.5583L39.0952 12.5614C38.1868 17.1924 39.1853 21.4164 42.0642 25.123L46.0278 21.8628L49.4323 19.0623C48.7002 18.0757 48.2662 16.8477 48.2662 15.5173L48.2654 15.5181Z"
+          fill="#54CE8B"/>
+    <path d="M49.7284 19.3934L46.306 22.1913L42.3243 25.4467C45.31 29.0723 49.1872 30.9402 53.8568 31L53.8568 21.3715C52.2149 21.3054 50.7486 20.5549 49.7284 19.3934Z"
+          fill="#54CE8B"/>
+    <path d="M47.8793 15.624C47.8489 12.0864 50.651 9.22624 54.0977 9.19578C57.5444 9.16531 60.3954 11.9755 60.4258 15.5131C60.4563 19.0507 57.6542 21.9109 54.2075 21.9413C50.7608 21.9718 47.9098 19.1616 47.8793 15.624Z"
+          fill="white" stroke="white" stroke-width="3"/>
+    <path d="M93.0622 21.3733L93.0622 31C97.7019 30.9339 101.832 28.8962 104.74 25.2383L97.2505 19.3199C96.23 20.5245 94.7372 21.3063 93.0622 21.3733Z"
+          fill="#54CE8B"/>
+    <path d="M97.5591 18.9657L105.017 24.9028C107.828 21.1383 108.753 16.8895 107.766 12.2678L98.571 14.4309C98.633 14.7761 98.6663 15.1316 98.6663 15.4951C98.6663 16.7923 98.2546 17.9908 97.5591 18.9657Z"
+          fill="#54CE8B"/>
+    <path d="M98.4565 13.9575L101.322 13.2866L107.641 11.8073C106.539 7.25936 103.661 3.65496 99.5031 1.61629L95.5282 10.2612C96.9552 11.0138 98.0343 12.3494 98.4573 13.9575L98.4565 13.9575Z"
+          fill="#54CE8B"/>
+    <path d="M92.8582 9.63299C93.6556 9.63299 94.415 9.79686 95.107 10.0931L97.2109 5.50556L99.0823 1.42618C94.8528 -0.512671 90.5847 -0.474855 86.3893 1.53884L89.2185 7.43731L90.5142 10.1372C91.2309 9.8142 92.0237 9.63299 92.859 9.63299L92.8582 9.63299Z"
+          fill="#54CE8B"/>
+    <path d="M90.0884 10.3506L85.9553 1.76326C81.8238 3.87823 79.0022 7.53929 77.9757 12.1131L87.2209 14.1045C87.6169 12.4844 88.6752 11.1287 90.0884 10.3506Z"
+          fill="#54CE8B"/>
+    <path d="M87.0357 15.5181C87.0357 15.1908 87.0628 14.8706 87.1133 14.5583L77.8655 12.5614C76.9571 17.1924 77.9555 21.4164 80.8345 25.123L84.798 21.8628L88.2026 19.0623C87.4705 18.0757 87.0364 16.8477 87.0364 15.5173L87.0357 15.5181Z"
+          fill="#54CE8B"/>
+    <path d="M88.4987 19.3934L85.0763 22.1913L81.0946 25.4467C84.0802 29.0723 87.9574 30.9402 92.627 31L92.627 21.3715C90.9852 21.3054 89.5189 20.5549 88.4987 19.3934Z"
+          fill="#54CE8B"/>
+    <path d="M86.6496 15.624C86.6191 12.0864 89.4213 9.22624 92.8679 9.19578C96.3146 9.16531 99.1656 11.9755 99.1961 15.5131C99.2266 19.0507 96.4245 21.9109 92.9778 21.9413C89.5311 21.9718 86.6801 19.1616 86.6496 15.624Z"
+          fill="white" stroke="white" stroke-width="3"/>
+    <path d="M131.832 21.3733L131.832 31C136.472 30.9339 140.602 28.8962 143.51 25.2383L136.021 19.3199C135 20.5245 133.507 21.3063 131.832 21.3733Z"
+          fill="#E0E5EC"/>
+    <path d="M136.329 18.9657L143.787 24.9028C146.599 21.1383 147.523 16.8895 146.537 12.2678L137.341 14.4309C137.403 14.7761 137.437 15.1316 137.437 15.4951C137.437 16.7923 137.025 17.9908 136.329 18.9657Z"
+          fill="#E0E5EC"/>
+    <path d="M137.227 13.9575L140.092 13.2866L146.411 11.8073C145.309 7.25936 142.431 3.65496 138.273 1.61629L134.299 10.2612C135.725 11.0138 136.805 12.3494 137.228 13.9575L137.227 13.9575Z"
+          fill="#E0E5EC"/>
+    <path d="M131.629 9.63299C132.426 9.63299 133.185 9.79686 133.877 10.0931L135.981 5.50556L137.853 1.42618C133.623 -0.512671 129.355 -0.474855 125.16 1.53884L127.989 7.43731L129.284 10.1372C130.001 9.8142 130.794 9.63299 131.629 9.63299L131.629 9.63299Z"
+          fill="#E0E5EC"/>
+    <path d="M128.859 10.3506L124.726 1.76326C120.594 3.87823 117.772 7.53929 116.746 12.1131L125.991 14.1045C126.387 12.4844 127.445 11.1287 128.859 10.3506Z"
+          fill="#41B5FA"/>
+    <path d="M125.806 15.5181C125.806 15.1908 125.833 14.8706 125.884 14.5583L116.636 12.5614C115.727 17.1924 116.726 21.4164 119.605 25.123L123.568 21.8628L126.973 19.0623C126.241 18.0757 125.807 16.8477 125.807 15.5173L125.806 15.5181Z"
+          fill="#41B5FA"/>
+    <path d="M127.269 19.3934L123.847 22.1913L119.865 25.4467C122.851 29.0723 126.728 30.9402 131.397 31L131.397 21.3715C129.755 21.3054 128.289 20.5549 127.269 19.3934Z"
+          fill="#41B5FA"/>
+    <path d="M125.42 15.624C125.389 12.0864 128.191 9.22624 131.638 9.19578C135.085 9.16531 137.936 11.9755 137.966 15.5131C137.997 19.0507 135.195 21.9109 131.748 21.9413C128.301 21.9718 125.45 19.1616 125.42 15.624Z"
+          fill="white" stroke="white" stroke-width="3"/>
+    <path d="M170.603 21.3733L170.603 31C175.242 30.9339 179.372 28.8962 182.28 25.2383L174.791 19.3199C173.771 20.5245 172.278 21.3063 170.603 21.3733Z"
+          fill="#E0E5EC"/>
+    <path d="M175.1 18.9657L182.558 24.9028C185.369 21.1383 186.293 16.8895 185.307 12.2678L176.111 14.4309C176.174 14.7761 176.207 15.1316 176.207 15.4951C176.207 16.7923 175.795 17.9908 175.1 18.9657Z"
+          fill="#E0E5EC"/>
+    <path d="M175.997 13.9575L178.863 13.2866L185.181 11.8073C184.079 7.25936 181.201 3.65496 177.044 1.61629L173.069 10.2612C174.496 11.0138 175.575 12.3494 175.998 13.9575L175.997 13.9575Z"
+          fill="#E0E5EC"/>
+    <path d="M170.399 9.63299C171.196 9.63299 171.956 9.79686 172.648 10.0931L174.751 5.50556L176.623 1.42618C172.393 -0.512671 168.125 -0.474855 163.93 1.53884L166.759 7.43731L168.055 10.1372C168.771 9.8142 169.564 9.63299 170.4 9.63299L170.399 9.63299Z"
+          fill="#E0E5EC"/>
+    <path d="M167.629 10.3506L163.496 1.76326C159.364 3.87823 156.543 7.53929 155.516 12.1131L164.761 14.1045C165.157 12.4844 166.216 11.1287 167.629 10.3506Z"
+          fill="#E0E5EC"/>
+    <path d="M164.576 15.5181C164.576 15.1908 164.603 14.8706 164.654 14.5583L155.406 12.5614C154.498 17.1924 155.496 21.4164 158.375 25.123L162.339 21.8628L165.743 19.0623C165.011 18.0757 164.577 16.8477 164.577 15.5173L164.576 15.5181Z"
+          fill="#E0E5EC"/>
+    <path d="M166.039 19.3934L162.617 22.1913L158.635 25.4467C161.621 29.0723 165.498 30.9402 170.168 31L170.168 21.3715C168.526 21.3054 167.059 20.5549 166.039 19.3934Z"
+          fill="#E0E5EC"/>
+    <path d="M164.19 15.624C164.16 12.0864 166.962 9.22624 170.408 9.19578C173.855 9.16531 176.706 11.9755 176.737 15.5131C176.767 19.0507 173.965 21.9109 170.518 21.9413C167.072 21.9718 164.221 19.1616 164.19 15.624Z"
+          fill="white" stroke="white" stroke-width="3"/>
+    <path d="M209.373 21.3733L209.373 31C214.013 30.9339 218.143 28.8962 221.05 25.2383L213.561 19.3199C212.541 20.5245 211.048 21.3063 209.373 21.3733Z"
+          fill="#E0E5EC"/>
+    <path d="M213.87 18.9657L221.328 24.9028C224.139 21.1383 225.063 16.8895 224.077 12.2678L214.882 14.4309C214.944 14.7761 214.977 15.1316 214.977 15.4951C214.977 16.7923 214.565 17.9908 213.87 18.9657Z"
+          fill="#E0E5EC"/>
+    <path d="M214.767 13.9575L217.633 13.2866L223.952 11.8073C222.849 7.25936 219.971 3.65496 215.814 1.61629L211.839 10.2612C213.266 11.0138 214.345 12.3494 214.768 13.9575L214.767 13.9575Z"
+          fill="#E0E5EC"/>
+    <path d="M209.169 9.63299C209.966 9.63299 210.726 9.79686 211.418 10.0931L213.522 5.50556L215.393 1.42618C211.164 -0.512671 206.895 -0.474855 202.7 1.53884L205.529 7.43731L206.825 10.1372C207.542 9.8142 208.334 9.63299 209.17 9.63299L209.169 9.63299Z"
+          fill="#E0E5EC"/>
+    <path d="M206.399 10.3506L202.266 1.76326C198.135 3.87823 195.313 7.53929 194.286 12.1131L203.532 14.1045C203.928 12.4844 204.986 11.1287 206.399 10.3506Z"
+          fill="#E0E5EC"/>
+    <path d="M203.346 15.5181C203.346 15.1908 203.374 14.8706 203.424 14.5583L194.176 12.5614C193.268 17.1924 194.266 21.4164 197.145 25.123L201.109 21.8628L204.513 19.0623C203.781 18.0757 203.347 16.8477 203.347 15.5173L203.346 15.5181Z"
+          fill="#E0E5EC"/>
+    <path d="M204.809 19.3934L201.387 22.1913L197.405 25.4467C200.391 29.0723 204.268 30.9402 208.938 31L208.938 21.3715C207.296 21.3054 205.83 20.5549 204.809 19.3934Z"
+          fill="#E0E5EC"/>
+    <path d="M202.96 15.624C202.93 12.0864 205.732 9.22624 209.179 9.19578C212.625 9.16531 215.476 11.9755 215.507 15.5131C215.537 19.0507 212.735 21.9109 209.289 21.9413C205.842 21.9718 202.991 19.1616 202.96 15.624Z"
+          fill="white" stroke="white" stroke-width="3"/>
+    <path d="M248.143 21.3733L248.143 31C252.783 30.9339 256.913 28.8962 259.821 25.2383L252.332 19.3199C251.311 20.5245 249.818 21.3063 248.143 21.3733Z"
+          fill="#E0E5EC"/>
+    <path d="M252.64 18.9657L260.098 24.9028C262.91 21.1383 263.834 16.8895 262.848 12.2678L253.652 14.4309C253.714 14.7761 253.747 15.1316 253.747 15.4951C253.747 16.7923 253.336 17.9908 252.64 18.9657Z"
+          fill="#E0E5EC"/>
+    <path d="M253.538 13.9575L256.403 13.2866L262.722 11.8073C261.62 7.25936 258.742 3.65496 254.584 1.61629L250.609 10.2612C252.036 11.0138 253.115 12.3494 253.538 13.9575L253.538 13.9575Z"
+          fill="#E0E5EC"/>
+    <path d="M247.939 9.63299C248.737 9.63299 249.496 9.79686 250.188 10.0931L252.292 5.50556L254.163 1.42618C249.934 -0.512671 245.666 -0.474855 241.47 1.53884L244.3 7.43731L245.595 10.1372C246.312 9.8142 247.105 9.63299 247.94 9.63299L247.939 9.63299Z"
+          fill="#E0E5EC"/>
+    <path d="M245.169 10.3506L241.036 1.76326C236.905 3.87823 234.083 7.53929 233.057 12.1131L242.302 14.1045C242.698 12.4844 243.756 11.1287 245.169 10.3506Z"
+          fill="#E0E5EC"/>
+    <path d="M242.117 15.5181C242.117 15.1908 242.144 14.8706 242.194 14.5583L232.947 12.5614C232.038 17.1924 233.037 21.4164 235.916 25.123L239.879 21.8628L243.284 19.0623C242.552 18.0757 242.118 16.8477 242.118 15.5173L242.117 15.5181Z"
+          fill="#E0E5EC"/>
+    <path d="M243.58 19.3934L240.157 22.1913L236.176 25.4467C239.161 29.0723 243.039 30.9402 247.708 31L247.708 21.3715C246.066 21.3054 244.6 20.5549 243.58 19.3934Z"
+          fill="#E0E5EC"/>
+    <path d="M241.731 15.624C241.7 12.0864 244.502 9.22624 247.949 9.19578C251.396 9.16531 254.247 11.9755 254.277 15.5131C254.308 19.0507 251.506 21.9109 248.059 21.9413C244.612 21.9718 241.761 19.1616 241.731 15.624Z"
+          fill="white" stroke="white" stroke-width="3"/>
+    <path d="M286.914 21.3733L286.914 31C291.553 30.9339 295.683 28.8962 298.591 25.2383L291.102 19.3199C290.081 20.5245 288.589 21.3063 286.914 21.3733Z"
+          fill="#E0E5EC"/>
+    <path d="M291.41 18.9657L298.868 24.9028C301.68 21.1383 302.604 16.8895 301.618 12.2678L292.422 14.4309C292.484 14.7761 292.518 15.1316 292.518 15.4951C292.518 16.7923 292.106 17.9908 291.41 18.9657Z"
+          fill="#E0E5EC"/>
+    <path d="M292.308 13.9575L295.173 13.2866L301.492 11.8073C300.39 7.25936 297.512 3.65496 293.354 1.61629L289.38 10.2612C290.807 11.0138 291.886 12.3494 292.309 13.9575L292.308 13.9575Z"
+          fill="#E0E5EC"/>
+    <path d="M286.71 9.63299C287.507 9.63299 288.266 9.79686 288.958 10.0931L291.062 5.50556L292.934 1.42618C288.704 -0.512671 284.436 -0.474855 280.241 1.53884L283.07 7.43731L284.366 10.1372C285.082 9.8142 285.875 9.63299 286.71 9.63299L286.71 9.63299Z"
+          fill="#E0E5EC"/>
+    <path d="M283.94 10.3506L279.807 1.76326C275.675 3.87823 272.854 7.53929 271.827 12.1131L281.072 14.1045C281.468 12.4844 282.527 11.1287 283.94 10.3506Z"
+          fill="#E0E5EC"/>
+    <path d="M280.887 15.5181C280.887 15.1908 280.914 14.8706 280.965 14.5583L271.717 12.5614C270.808 17.1924 271.807 21.4164 274.686 25.123L278.649 21.8628L282.054 19.0623C281.322 18.0757 280.888 16.8477 280.888 15.5173L280.887 15.5181Z"
+          fill="#E0E5EC"/>
+    <path d="M282.35 19.3934L278.928 22.1913L274.946 25.4467C277.932 29.0723 281.809 30.9402 286.478 31L286.478 21.3715C284.837 21.3054 283.37 20.5549 282.35 19.3934Z"
+          fill="#E0E5EC"/>
+    <path d="M280.501 15.624C280.47 12.0864 283.273 9.22624 286.719 9.19578C290.166 9.16531 293.017 11.9755 293.047 15.5131C293.078 19.0507 290.276 21.9109 286.829 21.9413C283.382 21.9718 280.531 19.1616 280.501 15.624Z"
+          fill="white" stroke="white" stroke-width="3"/>
+</svg>
diff --git a/server/vbv_lernwelt/static/icons/icon-certificate.svg b/server/vbv_lernwelt/static/icons/icon-certificate.svg
new file mode 100644
index 00000000..b97a85a0
--- /dev/null
+++ b/server/vbv_lernwelt/static/icons/icon-certificate.svg
@@ -0,0 +1,8 @@
+<svg viewBox="0 0 27 36" fill="none" xmlns="http://www.w3.org/2000/svg">
+    <path d="M26.0703 0.368164H1.0325C0.620877 0.368164 0.327332 0.662119 0.327332 1.07333V34.9273C0.327332 35.3389 0.621286 35.6324 1.0325 35.6324H26.0703C26.4819 35.6324 26.7755 35.3385 26.7755 34.9273L26.7759 1.07333C26.7759 0.662119 26.4819 0.368164 26.0707 0.368164H26.0703ZM25.3647 34.2221H1.7375V1.77875H25.4235V34.2221H25.3647Z"
+          fill="#13609C"/>
+    <path d="M17.7235 14.4736C15.0197 14.4736 12.8452 16.7072 12.8452 19.4106C12.8452 20.7623 13.3741 21.9967 14.2559 22.8781V22.9368V30.6952C14.2559 30.9891 14.4322 31.224 14.6675 31.3417C14.9024 31.4594 15.2554 31.4003 15.4317 31.1654L17.7239 28.8147L20.0161 31.1654C20.1338 31.2831 20.3101 31.4003 20.4863 31.4003C20.604 31.4003 20.6626 31.4003 20.7803 31.3417C21.0152 31.224 21.1919 30.9891 21.1919 30.6952L21.1911 22.9372V22.8786C22.0725 21.9971 22.6018 20.7627 22.6018 19.411C22.6014 16.7072 20.4268 14.4736 17.7235 14.4736L17.7235 14.4736ZM19.8394 28.9909L18.1933 27.4043C18.0756 27.2866 17.8993 27.1694 17.723 27.1694C17.5467 27.1694 17.3704 27.228 17.2528 27.4043L15.6658 29.05L15.6662 23.8777C16.3127 24.1717 17.0179 24.348 17.782 24.348C18.5462 24.348 19.2514 24.1717 19.8979 23.8777V28.991L19.8394 28.9909ZM17.7235 22.9371C15.7839 22.9371 14.2559 21.3501 14.2559 19.4105C14.2559 17.4708 15.8429 15.8838 17.7235 15.8838C19.6045 15.8838 21.1911 17.4708 21.1911 19.4105C21.1911 21.3504 19.6627 22.9371 17.7235 22.9371Z"
+          fill="#13609C"/>
+    <path d="M5.91086 7.42107H21.1922C21.6038 7.42107 21.8973 7.12712 21.8973 6.71591C21.8973 6.30429 21.6034 6.01074 21.1922 6.01074H5.91086C5.49925 6.01074 5.2057 6.3047 5.2057 6.71591C5.2057 7.12712 5.49966 7.42107 5.91086 7.42107Z"
+          fill="#13609C"/>
+</svg>
diff --git a/server/vbv_lernwelt/static/icons/icon-pen.svg b/server/vbv_lernwelt/static/icons/icon-pen.svg
new file mode 100644
index 00000000..68dc9fc8
--- /dev/null
+++ b/server/vbv_lernwelt/static/icons/icon-pen.svg
@@ -0,0 +1,5 @@
+<svg viewBox="0 0 18 18" fill="none" xmlns="http://www.w3.org/2000/svg">
+    <path fill-rule="evenodd" clip-rule="evenodd"
+          d="M6.6286 16.8048L6.60244 16.7786L0.5 17.5L1.2214 11.3954L1.19524 11.3692L11.5912 0.973274C12.2226 0.342242 13.246 0.342242 13.8774 0.973274L17.0267 4.12475C17.6578 4.7562 17.6578 5.77954 17.0267 6.41099L6.6286 16.8048ZM13.0105 1.84027C12.8574 1.68788 12.6099 1.68788 12.4569 1.84027L11.6505 2.64231L15.3555 6.34736L16.1598 5.54315C16.3121 5.39009 16.3121 5.14263 16.1598 4.98957L13.0105 1.84027ZM10.7876 3.51042L14.4927 7.21547L6.63142 15.0724L2.92636 11.3673L10.7876 3.51042ZM5.502 15.6735L2.32654 12.4981L1.89937 16.1094L5.502 15.6735Z"
+          fill="#00224D"/>
+</svg>