avoid content jumping , improve mobile ux

pages/Admin.vue

@@ -1,7 +1,7 @@
 <template lang="pug">
-  v-container
+  v-container.container.pa-0.pa-md-3
     v-card
-      v-tabs(v-model='selectedTab')
+      v-tabs(v-model='selectedTab' show-arrows)
 
         //- SETTINGS
         v-tab {{$t('common.settings')}}

pages/add/_edit.vue

@@ -1,5 +1,5 @@
 <template lang="pug">
-  v-container.container.px-0.px-md-3
+  v-container.container.pa-0.pa-md-3
     v-card
       v-card-title
         h4 {{edit?$t('common.edit_event'):$t('common.add_event')}}

pages/export.vue

@@ -1,6 +1,6 @@
 <template lang="pug">
-  v-container
-    v-card(outlined)
+  v-container.pa-0.pa-md-3
+    v-card
       v-card-title {{$t('common.share')}}
       v-card-text
         p.text-body-1 {{$t('export.intro')}}
@@ -11,7 +11,7 @@
             Search(
               :filters='filters'
               @update='f => filters = f')
-      v-tabs(v-model='type')
+      v-tabs(v-model='type' show-arrows)
 
         //- TOFIX
         //- v-tab {{$t('common.email')}}

pages/index.vue

@@ -7,7 +7,7 @@
 
     //- Calendar and search bar
     v-row.pt-0.pt-sm-2.pl-0.pl-sm-2
-      .col-xl-5.col-lg-5.col-md-7.col-sm-12.col-xs-12.pa-4.pa-sm-3
+      #calh.col-xl-5.col-lg-5.col-md-7.col-sm-12.col-xs-12.pa-4.pa-sm-3
         //- this is needed as v-calendar does not support SSR
         //- https://github.com/nathanreyes/v-calendar/issues/336
         client-only(placeholder='Calendar unavailable without js')
@@ -19,8 +19,7 @@
 
     //- Events
     #events.mb-2.mt-1.pl-1.pl-sm-2
-      //- div.event(v-for='(event, idx) in events' :key='event.id' v-intersect="(entries, observer, isIntersecting) => intersecting[event.id] = isIntersecting")
-      Event(:event='event' @destroy='destroy' v-for='(event, idx) in visibleEvents' :key='event.id' @tagclick='tagClick' @placeclick='placeClick')
+      Event(:event='event' @destroy='destroy' v-for='(event, idx) in visibleEvents' :lazy='idx>2' :key='event.id' @tagclick='tagClick' @placeclick='placeClick')
 
 </template>