From 126f0de318611aa294be0bdc958cd49eb801f39a Mon Sep 17 00:00:00 2001
From: Daniel Egger <daniel.egger@gmail.com>
Date: Tue, 11 Oct 2022 13:32:47 +0200
Subject: [PATCH] Anpassungen Mobile

---
 .../learningPath/LearningPathDiagram.vue          |  2 +-
 client/src/pages/CockpitPage.vue                  |  4 ++--
 client/src/pages/LoginPage.vue                    |  6 +++---
 .../src/pages/learningPath/LearningPathPage.vue   | 10 +++++-----
 .../pages/mediaLibrary/MLCategoryDetailPage.vue   |  3 ++-
 .../media_library/create_default_media_library.py | 15 ++++++++++-----
 .../tests/media_library_factories.py              |  4 ++--
 7 files changed, 25 insertions(+), 19 deletions(-)

diff --git a/client/src/components/learningPath/LearningPathDiagram.vue b/client/src/components/learningPath/LearningPathDiagram.vue
index deaa5070..711d4d35 100644
--- a/client/src/components/learningPath/LearningPathDiagram.vue
+++ b/client/src/components/learningPath/LearningPathDiagram.vue
@@ -386,7 +386,7 @@ export default {
   <div class="svg-container h-full content-start">
     <svg
       :id="identifier"
-      class="learning-path-visualization h-full"
+      class="learning-path-visualization h-full -mt-6 lg:mt-0"
       :viewBox="viewBox"
     ></svg>
   </div>
diff --git a/client/src/pages/CockpitPage.vue b/client/src/pages/CockpitPage.vue
index 76cb303e..b68150da 100644
--- a/client/src/pages/CockpitPage.vue
+++ b/client/src/pages/CockpitPage.vue
@@ -8,13 +8,13 @@ const userStore = useUserStore();
 </script>
 
 <template>
-  <main class="px-8 py-8 lg:px-12 lg:py-12 bg-gray-200">
+  <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-8 break-words bg-white max-w-xl">
+      <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">
diff --git a/client/src/pages/LoginPage.vue b/client/src/pages/LoginPage.vue
index 7c972ef7..76744f3d 100644
--- a/client/src/pages/LoginPage.vue
+++ b/client/src/pages/LoginPage.vue
@@ -18,7 +18,7 @@ const userStore = useUserStore();
 </script>
 
 <template>
-  <main class="px-8 py-8 lg:px-12 lg:py-12 bg-gray-200">
+  <main class="lg:px-12 lg:py-12 bg-gray-200">
     <div class="container-medium">
       <h1 class="mb-8">Login</h1>
 
@@ -35,7 +35,7 @@ const userStore = useUserStore();
             v-model="state.username"
             type="text"
             name="username"
-            class="py-2 px-3 border border-gray-500 mt-1 block w-96"
+            class="py-2 px-3 border border-gray-500 mt-1 block w-96 max-w-full"
           />
         </div>
         <div class="mb-4">
@@ -45,7 +45,7 @@ const userStore = useUserStore();
             v-model="state.password"
             type="password"
             name="password"
-            class="py-2 px-3 border border-gray-500 mt-1 block w-96"
+            class="py-2 px-3 border border-gray-500 mt-1 block w-96 max-w-full"
           />
         </div>
 
diff --git a/client/src/pages/learningPath/LearningPathPage.vue b/client/src/pages/learningPath/LearningPathPage.vue
index 6b580ec6..4ce80d13 100644
--- a/client/src/pages/learningPath/LearningPathPage.vue
+++ b/client/src/pages/learningPath/LearningPathPage.vue
@@ -56,10 +56,10 @@ const createContinueUrl = (learningPath: LearningPath): [string, boolean] => {
 
     <div class="learningpath flex flex-col">
       <div class="flex flex-col h-max">
-        <div class="bg-white py-8 flex flex-col">
-          <div class="flex justify-end p-3">
+        <div class="bg-white lg:py-8 flex flex-col">
+          <div class="flex justify-end lg:p-4">
             <button
-              class="btn-text inline-flex items-center px-3 py-2"
+              class="btn-text inline-flex items-center px-3 lg:py-2"
               data-cy="show-list-view"
               @click="learningPathStore.page = 'OVERVIEW'"
             >
@@ -74,14 +74,14 @@ const createContinueUrl = (learningPath: LearningPath): [string, boolean] => {
           ></LearningPathDiagram>
         </div>
 
-        <div class="container-large">
+        <div class="container-large pt-0 lg:pt-4">
           <h1 data-cy="learning-path-title" class="mt-6 lg:mt-12 mb-6">
             {{ learningPathStore.learningPath.title }}
           </h1>
           <div
             class="bg-white p-4 flex flex-col lg:flex-row divide-y lg:divide-y-0 lg:divide-x divide-gray-500 justify-start"
           >
-            <div class="p-4 lg:p-8 flex-auto">
+            <div class="p-2 lg:p-8 flex-auto">
               <h2>Willkommmen zurück, {{ userStore.first_name }}</h2>
               <p class="mt-4 text-xl"></p>
             </div>
diff --git a/client/src/pages/mediaLibrary/MLCategoryDetailPage.vue b/client/src/pages/mediaLibrary/MLCategoryDetailPage.vue
index 6143f328..91699cc3 100644
--- a/client/src/pages/mediaLibrary/MLCategoryDetailPage.vue
+++ b/client/src/pages/mediaLibrary/MLCategoryDetailPage.vue
@@ -142,7 +142,8 @@ const hasMoreItemsForType = (itemType: string, items: object[]) => {
                   :blank="mediaItem.value.open_window"
                   :to="mediaItem.value.url"
                   class="link"
-                  >{{ mediaItem.value.link_display_text }}
+                >
+                  {{ mediaItem.value.link_display_text }}
                 </media-link>
               </div>
             </li>
diff --git a/server/vbv_lernwelt/media_library/create_default_media_library.py b/server/vbv_lernwelt/media_library/create_default_media_library.py
index aa10ca6e..13118ed8 100644
--- a/server/vbv_lernwelt/media_library/create_default_media_library.py
+++ b/server/vbv_lernwelt/media_library/create_default_media_library.py
@@ -148,13 +148,15 @@ die der Fahrzeugbesitzer und die Fahrzeugbesitzerin in einem grösseren Schadenf
                             contents=[
                                 create_relative_link_block(
                                     RelativeLinkBlockFactory(
-                                        title="VBV 303/12.3 Verkehrsrechtsschutz",
+                                        title="Rechtsstreitigkeiten",
+                                        description="VBV 303/12.3 Verkehrsrechtsschutz",
                                         url="/media/versicherungsvermittlerin-media/category/rechtsstreitigkeiten",
                                     )
                                 ),
                                 create_relative_link_block(
                                     RelativeLinkBlockFactory(
-                                        title="VBV 303/13 Reiseversicherung",
+                                        title="Reisen",
+                                        description="VBV 303/13 Reiseversicherung",
                                         url="/media/versicherungsvermittlerin-media/category/reisen",
                                     )
                                 ),
@@ -250,19 +252,22 @@ Diese können negative Folgen verschiedener Art nach sich ziehen, darunter recht
                             contents=[
                                 create_relative_link_block(
                                     RelativeLinkBlockFactory(
-                                        title="VBV 303/03 Hausratversicherung",
+                                        title="Haushalt",
+                                        description="VBV 303/03 Hausratversicherung",
                                         url="/media/versicherungsvermittlerin-media/category/haushalt",
                                     )
                                 ),
                                 create_relative_link_block(
                                     RelativeLinkBlockFactory(
-                                        title="VBV 303/12 Rechtschutzversicherung",
+                                        title="Rechtsstreitigkeiten",
+                                        desciption="VBV 303/12 Rechtschutzversicherung",
                                         url="/media/versicherungsvermittlerin-media/category/rechtsstreitigkeiten",
                                     )
                                 ),
                                 create_relative_link_block(
                                     RelativeLinkBlockFactory(
-                                        title="VBV 304/Teil E Obligatorische Krankenversicherung",
+                                        title="Gesundheit",
+                                        description="VBV 304/Teil E Obligatorische Krankenversicherung",
                                         url="/media/versicherungsvermittlerin-media/category/gesundheit",
                                     )
                                 ),
diff --git a/server/vbv_lernwelt/media_library/tests/media_library_factories.py b/server/vbv_lernwelt/media_library/tests/media_library_factories.py
index 6ec3a27e..89d329d4 100644
--- a/server/vbv_lernwelt/media_library/tests/media_library_factories.py
+++ b/server/vbv_lernwelt/media_library/tests/media_library_factories.py
@@ -99,8 +99,8 @@ class RelativeLinkBlockFactory(wagtail_factories.StructBlockFactory):
     class Meta:
         model = RelativeLinkBlock
 
-    title = "Platzhalter Querverweis"
-    description = "Handlungsfeld"
+    title = "Fahrzeug"
+    description = "Platzhalter Querverweis"
     link_display_text = "Handlungsfeld anzeigen"
     icon_url = "/static/icons/demo/icon-hf-reisen.svg"
     url = "/media/versicherungsvermittlerin-media/category/fahrzeug"