diff --git a/aleksis/core/frontend/components/calendar/BaseCalendarFeedDetails.vue b/aleksis/core/frontend/components/calendar/BaseCalendarFeedDetails.vue
index 2db52ae5ef86ecf4534aee70ffd7d9939dffe453..e76a4d076577c6d4f1d7621f2af275ee5c018486 100644
--- a/aleksis/core/frontend/components/calendar/BaseCalendarFeedDetails.vue
+++ b/aleksis/core/frontend/components/calendar/BaseCalendarFeedDetails.vue
@@ -27,28 +27,36 @@
         </slot>
       </v-toolbar>
       <slot name="time" :selected-event="selectedEvent">
-        <v-card-text v-if="!withoutTime">
-          <v-icon left>mdi-calendar-today-outline</v-icon>
-          <span v-if="selectedEvent.start !== selectedEvent.end">
-            {{ $d(selectedEvent.start, "shortDateTime") }} –
-            {{ $d(selectedEvent.end, "shortDateTime") }}
-          </span>
-          <span v-else> {{ $d(selectedEvent.start, "shortDateTime") }}</span>
-        </v-card-text>
+        <v-list-item v-if="!withoutTime">
+          <v-list-item-icon>
+            <v-icon color="primary">mdi-calendar-today-outline</v-icon>
+          </v-list-item-icon>
+          <v-list-item-content>
+            <v-list-item-title>
+              <span v-if="selectedEvent.start !== selectedEvent.end">
+                {{ $d(selectedEvent.start, "shortDateTime") }} –
+                {{ $d(selectedEvent.end, "shortDateTime") }}
+              </span>
+              <span v-else>
+                {{ $d(selectedEvent.start, "shortDateTime") }}</span
+              >
+            </v-list-item-title>
+          </v-list-item-content>
+        </v-list-item>
       </slot>
       <slot name="description" :selected-event="selectedEvent">
-        <v-divider v-if="selectedEvent.description && !withoutDescription" />
-        <v-card-text
-          class="d-flex"
+        <v-divider
+          inset
           v-if="selectedEvent.description && !withoutDescription"
-        >
-          <div>
-            <v-icon left>mdi-card-text-outline</v-icon>
-          </div>
-          <div style="white-space: pre-line">
+        />
+        <v-list-item v-if="selectedEvent.description && !withoutDescription">
+          <v-list-item-icon>
+            <v-icon color="primary">mdi-card-text-outline</v-icon>
+          </v-list-item-icon>
+          <v-list-item-content style="white-space: pre-line">
             {{ selectedEvent.description }}
-          </div>
-        </v-card-text>
+          </v-list-item-content>
+        </v-list-item>
       </slot>
     </v-card>
   </v-menu>