From 1dfc83dd81dfa5d1b15bb35f570b181186c17800 Mon Sep 17 00:00:00 2001
From: Jonathan Weth <git@jonathanweth.de>
Date: Thu, 4 Jul 2024 21:25:30 +0200
Subject: [PATCH] Improve design of AbsenceCreationSummary
---
.../absences/AbsenceCreationSummary.vue | 48 +++++++++++--------
1 file changed, 28 insertions(+), 20 deletions(-)
diff --git a/aleksis/apps/alsijil/frontend/components/coursebook/absences/AbsenceCreationSummary.vue b/aleksis/apps/alsijil/frontend/components/coursebook/absences/AbsenceCreationSummary.vue
index f1e346316..17a7795e6 100644
--- a/aleksis/apps/alsijil/frontend/components/coursebook/absences/AbsenceCreationSummary.vue
+++ b/aleksis/apps/alsijil/frontend/components/coursebook/absences/AbsenceCreationSummary.vue
@@ -41,26 +41,34 @@
class="px-0"
:key="lesson.id"
>
- <!-- TODO: We should extract this display & share it -->
- <time :datetime="lesson.datetimeStart" class="text-no-wrap">
- {{
- $d($parseISODate(lesson.datetimeStart), "shortWithWeekday")
- }}
- </time>
- <span>(</span>
- <time :datetime="lesson.datetimeStart" class="text-no-wrap">
- {{ $d($parseISODate(lesson.datetimeStart), "shortTime") }}
- </time>
- <span>-</span>
- <time :datetime="lesson.datetimeEnd" class="text-no-wrap">
- {{ $d($parseISODate(lesson.datetimeEnd), "shortTime") }}
- </time>
- <span>)</span>
- <v-spacer />
- <div class="pr-2">
- {{ lesson.course?.name }}
- </div>
- <subject-chip :subject="lesson.subject" />
+ <v-row>
+ <!-- TODO: We should extract this display & share it -->
+ <v-col cols="3">
+ <time :datetime="lesson.datetimeStart" class="text-no-wrap">
+ {{
+ $d(
+ $parseISODate(lesson.datetimeStart),
+ "shortWithWeekday",
+ )
+ }}
+ </time>
+ </v-col>
+ <v-col cols="3">
+ <time :datetime="lesson.datetimeStart" class="text-no-wrap">
+ {{ $d($parseISODate(lesson.datetimeStart), "shortTime") }}
+ </time>
+ <span> - </span>
+ <time :datetime="lesson.datetimeEnd" class="text-no-wrap">
+ {{ $d($parseISODate(lesson.datetimeEnd), "shortTime") }}
+ </time>
+ </v-col>
+ <v-col cols="3">
+ {{ lesson.course?.name }}
+ </v-col>
+ <v-col cols="3">
+ <subject-chip :subject="lesson.subject" />
+ </v-col>
+ </v-row>
</v-list-item>
</v-expansion-panel-content>
</v-expansion-panel>
--
GitLab