chore: fix mobile layout

components/pages/events/event-card.vue

@@ -15,8 +15,9 @@
       </h3>
     </v-card-title>
     <v-card-text>
-      <v-row wrap>
+      <v-row dense>
         <v-col
+          cols="12"
           xs="12"
           sm="6"
         >
@@ -25,17 +26,17 @@
           }}
           ({{ weekday }} {{ daysUntil }})
         </v-col>
-        <v-col v-if="event.time" xs="12" sm="6">
+        <v-col v-if="event.time" cols="12" xs="12" sm="6">
           <strong class="mr-1" v-text="$t('events.time')" />{{
             event.time
           }}
         </v-col>
       </v-row>
-      <v-row v-if="event.danceHall" wrap>
+      <v-row v-if="event.danceHall" dense>
         <v-col
+          cols="12"
           xs="12"
           sm="6"
-          md="3"
         >
           <strong class="mr-1" v-text="$t('events.hall')" />
           <v-icon
@@ -50,9 +51,9 @@
           {{ event.danceHall.name }}
         </v-col>
         <v-col
+          cols="12"
           xs="12"
           sm="6"
-          md="3"
         >
           <strong class="mr-1" v-text="$t('events.city')" />
           <v-icon
@@ -67,9 +68,9 @@
           {{ event.danceHall.city }}
         </v-col>
         <v-col
+          cols="12"
           xs="12"
           sm="6"
-          md="3"
         >
           <strong class="mr-1" v-text="$t('events.municipality')" />
           <v-icon
@@ -86,9 +87,9 @@
           {{ event.danceHall.municipality }}
         </v-col>
         <v-col
+          cols="12"
           xs="12"
           sm="6"
-          md="3"
         >
           <strong class="mr-1" v-text="$t('events.state')" />
           <v-icon