From 58cf852842a6da8e1ad140f7322daa482fa089e7 Mon Sep 17 00:00:00 2001
From: Christian Cueni <christian.cueni@iterativ.ch>
Date: Tue, 9 Apr 2024 11:15:58 +0200
Subject: [PATCH] WIP: Style components

---
 .../src/components/dashboard/CompetenceSummary.vue | 14 ++++++--------
 client/src/components/dashboard/CoursePanel.vue    | 12 +++++++-----
 .../dashboard/MentorCompetenceSummary.vue          |  9 +++++----
 .../src/components/dashboard/MentorMenteeCount.vue |  3 ++-
 .../components/dashboard/MentorOpenTasksCount.vue  |  1 +
 server/config/urls.py                              | 14 +++++++++-----
 .../dashboard/graphql/types/assignment.py          |  6 +++++-
 server/vbv_lernwelt/dashboard/views.py             | 11 +++++++++--
 8 files changed, 44 insertions(+), 26 deletions(-)

diff --git a/client/src/components/dashboard/CompetenceSummary.vue b/client/src/components/dashboard/CompetenceSummary.vue
index 9d2a9164..6e073e5b 100644
--- a/client/src/components/dashboard/CompetenceSummary.vue
+++ b/client/src/components/dashboard/CompetenceSummary.vue
@@ -24,13 +24,11 @@ onMounted(async () => {
 </script>
 
 <template>
-  <div v-if="competence" class="mb-14 space-y-8">
-    <div class="flex flex-col space-y-7 bg-white p-6">
-      <CompetenceSummaryBox
-        :fail-count="competence.fail_count"
-        :success-count="competence.success_count"
-        :details-link="competenceCriteriaUrl"
-      />
-    </div>
+  <div v-if="competence" class="mb-14">
+    <CompetenceSummaryBox
+      :fail-count="competence.fail_count"
+      :success-count="competence.success_count"
+      :details-link="competenceCriteriaUrl"
+    />
   </div>
 </template>
diff --git a/client/src/components/dashboard/CoursePanel.vue b/client/src/components/dashboard/CoursePanel.vue
index dc5d960b..638b6d17 100644
--- a/client/src/components/dashboard/CoursePanel.vue
+++ b/client/src/components/dashboard/CoursePanel.vue
@@ -37,11 +37,13 @@ function hasWidget(widget: WidgetType) {
 
 <template>
   <div v-if="courseConfig" class="mb-14 space-y-8">
-    <div class="flex flex-col space-y-4 bg-white p-6">
-      <h3 class="mb-4 text-3xl">{{ courseName }}</h3>
-      <p>
-        <span class="rounded bg-gray-300 px-2 py-1">{{ courseConfig.role_key }}</span>
-      </p>
+    <div class="flex flex-col space-y-8 bg-white p-6">
+      <div class="border-b border-gray-300 pb-8">
+        <h3 class="mb-4 text-3xl">{{ courseName }}</h3>
+        <p>
+          <span class="rounded bg-gray-300 px-2 py-1">{{ courseConfig.role_key }}</span>
+        </p>
+      </div>
       <LearningPathDiagram
         v-if="
           hasWidget('ProgressWidget') &&
diff --git a/client/src/components/dashboard/MentorCompetenceSummary.vue b/client/src/components/dashboard/MentorCompetenceSummary.vue
index 24b4dc4d..4a06a135 100644
--- a/client/src/components/dashboard/MentorCompetenceSummary.vue
+++ b/client/src/components/dashboard/MentorCompetenceSummary.vue
@@ -17,21 +17,22 @@ onMounted(async () => {
 
 <template>
   <div v-if="summary" class="w-[325px]">
+    <h3 class="mb-4 text-base">{{ $t("Kompetenznachweise") }}</h3>
     <div class="flex flex-row space-x-3 bg-white">
       <div
-        class="flex h-[74px] items-center justify-center px-3 py-1 text-3xl font-bold"
+        class="flex h-[47px] items-center justify-center py-1 pr-3 text-3xl font-bold"
       >
         <span>{{ summary.summary.total_passed }}</span>
       </div>
-      <p class="ml-3 mt-0 leading-[74px]">{{ $t("Bestanden") }}</p>
+      <p class="ml-3 mt-0 leading-[47px]">{{ $t("Bestanden") }}</p>
     </div>
     <div class="flex flex-row space-x-3 bg-white pb-6">
       <div
-        class="flex h-[74px] items-center justify-center px-3 py-1 text-3xl font-bold"
+        class="flex h-[47px] items-center justify-center py-1 pr-3 text-3xl font-bold"
       >
         <span>{{ summary.summary.total_failed }}</span>
       </div>
-      <p class="ml-3 mt-0 leading-[74px]">{{ $t("Nicht bestanden") }}</p>
+      <p class="ml-3 mt-0 leading-[47px]">{{ $t("Nicht bestanden") }}</p>
     </div>
     <p>{{ $t("Details anschauen") }}</p>
   </div>
diff --git a/client/src/components/dashboard/MentorMenteeCount.vue b/client/src/components/dashboard/MentorMenteeCount.vue
index 25c8a953..79597ff1 100644
--- a/client/src/components/dashboard/MentorMenteeCount.vue
+++ b/client/src/components/dashboard/MentorMenteeCount.vue
@@ -16,9 +16,10 @@ onMounted(async () => {
 
 <template>
   <div class="w-[325px]">
+    <h3 class="mb-4 text-base">{{ $t("Personen") }}</h3>
     <div class="flex flex-row space-x-3 bg-white pb-6">
       <div
-        class="flex h-[74px] items-center justify-center px-3 py-1 text-3xl font-bold"
+        class="flex h-[74px] items-center justify-center py-1 pr-3 text-3xl font-bold"
       >
         <span>{{ menteeCount }}</span>
       </div>
diff --git a/client/src/components/dashboard/MentorOpenTasksCount.vue b/client/src/components/dashboard/MentorOpenTasksCount.vue
index bb310a0f..4136cbf4 100644
--- a/client/src/components/dashboard/MentorOpenTasksCount.vue
+++ b/client/src/components/dashboard/MentorOpenTasksCount.vue
@@ -16,6 +16,7 @@ onMounted(async () => {
 
 <template>
   <div class="w-[325px]">
+    <h3 class="mb-4 text-base">{{ $t("Zu erledigen") }}</h3>
     <div class="flex flex-row space-x-3 bg-white pb-6">
       <div
         class="flex h-[74px] w-[74px] items-center justify-center rounded-full border-2 border-green-500 px-3 py-1 text-3xl font-bold"
diff --git a/server/config/urls.py b/server/config/urls.py
index 582eced0..6155a093 100644
--- a/server/config/urls.py
+++ b/server/config/urls.py
@@ -10,9 +10,6 @@ from django.views import defaults as default_views
 from django.views.decorators.csrf import csrf_exempt
 from django_ratelimit.exceptions import Ratelimited
 from graphene_django.views import GraphQLView
-from wagtail import urls as wagtail_urls
-from wagtail.admin import urls as wagtailadmin_urls
-from wagtail.documents import urls as media_library_urls
 
 from vbv_lernwelt.api.directory import list_entities
 from vbv_lernwelt.api.user import get_profile, me_user_view, post_avatar
@@ -42,8 +39,12 @@ from vbv_lernwelt.course.views import (
     request_course_completion_for_user,
 )
 from vbv_lernwelt.course_session.views import get_course_session_documents
-from vbv_lernwelt.dashboard.views import get_dashboard_config, get_dashboard_persons, get_mentee_count, \
-    get_mentor_open_tasks_count
+from vbv_lernwelt.dashboard.views import (
+    get_dashboard_config,
+    get_dashboard_persons,
+    get_mentee_count,
+    get_mentor_open_tasks_count,
+)
 from vbv_lernwelt.edoniq_test.views import (
     export_students,
     export_students_and_trainers,
@@ -62,6 +63,9 @@ from vbv_lernwelt.importer.views import (
 )
 from vbv_lernwelt.media_files.views import user_image
 from vbv_lernwelt.notify.views import email_notification_settings
+from wagtail import urls as wagtail_urls
+from wagtail.admin import urls as wagtailadmin_urls
+from wagtail.documents import urls as media_library_urls
 
 
 class SignedIntConverter(IntConverter):
diff --git a/server/vbv_lernwelt/dashboard/graphql/types/assignment.py b/server/vbv_lernwelt/dashboard/graphql/types/assignment.py
index 214fcc4e..be2160fc 100644
--- a/server/vbv_lernwelt/dashboard/graphql/types/assignment.py
+++ b/server/vbv_lernwelt/dashboard/graphql/types/assignment.py
@@ -59,7 +59,11 @@ def create_assignment_summary(course_id, metrics) -> AssignmentStatisticsSummary
 
     if not completed_metrics:
         return AssignmentStatisticsSummaryType(
-            _id=course_id, completed_count=0, average_passed=0, total_passed=0, total_failed=0  # noqa
+            _id=course_id,
+            completed_count=0,
+            average_passed=0,
+            total_passed=0,
+            total_failed=0,  # noqa
         )
 
     completed_count = len(completed_metrics)
diff --git a/server/vbv_lernwelt/dashboard/views.py b/server/vbv_lernwelt/dashboard/views.py
index 7b489862..c4d57396 100644
--- a/server/vbv_lernwelt/dashboard/views.py
+++ b/server/vbv_lernwelt/dashboard/views.py
@@ -6,9 +6,16 @@ from rest_framework.decorators import api_view
 from rest_framework.exceptions import PermissionDenied
 from rest_framework.response import Response
 
-from vbv_lernwelt.assignment.models import AssignmentCompletion, AssignmentCompletionStatus
+from vbv_lernwelt.assignment.models import (
+    AssignmentCompletion,
+    AssignmentCompletionStatus,
+)
 from vbv_lernwelt.core.models import User
-from vbv_lernwelt.course.models import CourseSession, CourseSessionUser, CourseConfiguration
+from vbv_lernwelt.course.models import (
+    CourseConfiguration,
+    CourseSession,
+    CourseSessionUser,
+)
 from vbv_lernwelt.course.views import logger
 from vbv_lernwelt.course_session_group.models import CourseSessionGroup
 from vbv_lernwelt.learning_mentor.models import LearningMentor