diff --git a/aleksis/apps/alsijil/frontend/components/coursebook/statistics/StatisticsForPersonCard.vue b/aleksis/apps/alsijil/frontend/components/coursebook/statistics/StatisticsForPersonCard.vue index 220d4c6bcd477328e6533c35ceb23640cc63fdd8..ebcb00af0740bc92bc2c4607b09a80c3ceec175d 100644 --- a/aleksis/apps/alsijil/frontend/components/coursebook/statistics/StatisticsForPersonCard.vue +++ b/aleksis/apps/alsijil/frontend/components/coursebook/statistics/StatisticsForPersonCard.vue @@ -108,12 +108,11 @@ export default { computed: { gridTemplateAreas() { return this.compact - ? `"absences tardinesses extra_marks" - "personal_notes personal_notes personal_notes"` + ? `"absences extra_marks" "tardinesses tardinesses"` : `"absences" "tardinesses" "extra_marks"`; }, gridTemplateColumnsNum() { - return this.compact ? 3 : 1; + return this.compact ? 2 : 1; }, }, }; diff --git a/aleksis/apps/alsijil/frontend/components/coursebook/statistics/StatisticsTardinessCard.vue b/aleksis/apps/alsijil/frontend/components/coursebook/statistics/StatisticsTardinessCard.vue index bba96cd38cedf3b417a71d5fee6add116d7322a8..3103208fb39190ccb61096bfc4940a53d7271be7 100644 --- a/aleksis/apps/alsijil/frontend/components/coursebook/statistics/StatisticsTardinessCard.vue +++ b/aleksis/apps/alsijil/frontend/components/coursebook/statistics/StatisticsTardinessCard.vue @@ -1,30 +1,36 @@ <template> <v-skeleton-loader v-if="loading" type="card" /> - <v-card v-else class="text-center"> - <v-card-text - class="d-flex flex-column align-center justify-center fill-height" - > - <div class="text-h2"> - {{ $n(tardinessCount) }} - </div> - <div class="text-subtitle-2"> - {{ $tc("alsijil.personal_notes.tardiness_n", tardinessCount) }} - </div> - <div class="text-caption"> - <!-- TODO: Show average tardiness instead of sum like mock-up? --> - <div> - <v-icon small>mdi-sigma</v-icon> - {{ $tc("time.minutes_n", tardinessSum, { n: $n(tardinessSum) }) }} - </div> - <div> - <v-icon small>mdi-diameter-variant</v-icon> - {{ - $tc("time.minutes_n", tardinessSum / tardinessCount, { - n: $n(tardinessSum / tardinessCount), - }) - }} - </div> - </div> + <v-card v-else> + <v-card-text> + <v-row> + <v-col class="text-center"> + <div class="text-h2"> + {{ $n(tardinessCount) }} + </div> + <div class="text-subtitle-2"> + {{ $tc("alsijil.personal_notes.tardiness_n", tardinessCount) }} + </div> + </v-col> + + <v-col + class="text-caption d-flex flex-column justify-center align-center" + > + <div> + <div> + <v-icon small>mdi-sigma</v-icon> + {{ $tc("time.minutes_n", tardinessSum, { n: $n(tardinessSum) }) }} + </div> + <div> + <v-icon small>mdi-diameter-variant</v-icon> + {{ + $tc("time.minutes_n", tardinessSum / tardinessCount, { + n: $n(tardinessSum / tardinessCount), + }) + }} + </div> + </div> + </v-col> + </v-row> </v-card-text> </v-card> </template>