Show Rearrange list item title

aleksis/apps/alsijil/frontend/components/coursebook/statistics/StatisticsForPersonPage.vue

@@ -27,11 +27,12 @@
         <template #default="{ items }">
           <v-list-item v-for="item in items" :key="item.id">
             <v-list-item-content>
-              <v-list-item-title class="d-flex">
+              <v-list-item-title>
                 <!-- date & timeslot -->
                 <time :datetime="item.relatedDocumentation.datetimeStart" class="text-no-wrap">
                   {{ $d($parseISODate(item.relatedDocumentation.datetimeStart), "shortDate") }}
                 </time>
+
                 <time :datetime="item.relatedDocumentation.datetimeStart" class="text-no-wrap">
                   {{ $d($parseISODate(item.relatedDocumentation.datetimeStart), "shortTime") }}
                 </time>
@@ -40,28 +41,34 @@
                   {{ $d($parseISODate(item.relatedDocumentation.datetimeEnd), "shortTime") }}
                 </time>
                 <!-- teacher -->
-                <person-chip v-for="teacher in item.relatedDocumentation.teachers" :person="teacher" no-link />
+                <person-chip
+                  v-for="teacher in item.relatedDocumentation.teachers"
+                  :person="teacher"
+                  no-link
+                  small
+                />
                 <!-- group -->
-                <div>
+                <span>
                   {{ item.groupShortName }}
-                </div>
+                </span>
                 <!-- subject -->
-                <subject-chip :subject="item.relatedDocumentation.subject" />
-                <v-spacer />
-                <!-- chips: absences & extraMarks -->
-                <absence-reason-chip
-                  v-if="item.absenceReason"
-                  :absenceReason="item.absenceReason"
-                />
-                <extra-mark-chip
-                  v-if="item.extraMark"
-                  :extra-mark="item.extraMark"
-                />
+                <subject-chip :subject="item.relatedDocumentation.subject" small />
               </v-list-item-title>
               <v-list-item-subtitle>
                 {{ item.note }}
               </v-list-item-subtitle>
             </v-list-item-content>
+            <v-list-item-action>
+              <!-- chips: absences & extraMarks -->
+              <absence-reason-chip
+                v-if="item.absenceReason"
+                :absenceReason="item.absenceReason"
+              />
+              <extra-mark-chip
+                v-if="item.extraMark"
+                :extra-mark="item.extraMark"
+              />
+            </v-list-item-action>
           </v-list-item>
           <v-divider></v-divider>
         </template>