improve index/tag/place layout

This commit is contained in:
lesion 2023-03-27 17:19:27 +02:00
parent 0682feaaf8
commit f960400085
No known key found for this signature in database
GPG key ID: 352918250B012177
4 changed files with 11 additions and 11 deletions

View file

@ -1,5 +1,5 @@
<template lang="pug">
div.d-flex.flex-column.flex-grow-1(itemscope itemtype="https://schema.org/Event")
div.h-event(itemscope itemtype="https://schema.org/Event")
nuxt-link(:to='`/event/${event.slug || event.id}`' itemprop="url")
MyPicture(v-if='!hide_thumbs' :event='event' thumb :lazy='lazy')
v-icon.float-right.mr-1(v-if='event.parentId' color='success' v-text='mdiRepeat')

View file

@ -1,5 +1,5 @@
<template lang="pug">
v-container.px-2.px-sm-6.pt-0
v-container.px-2.px-sm-6.pt-0#home
//- View
#themeview.mt-sm-4.mt-2
@ -11,8 +11,8 @@ v-container.px-2.px-sm-6.pt-0
//- Events
#events.mt-sm-4.mt-2(v-if='!$fetchState.pending')
v-lazy.event(:value='idx<9' v-for='(event, idx) in visibleEvents' :key='event.id' :min-height='hide_thumbs ? 105 : undefined' :options="{ threshold: .5, rootMargin: '500px' }")
Event(:event='event' :lazy='idx<9')
v-lazy.event.v-card(:value='idx<9' v-for='(event, idx) in visibleEvents' :key='event.id' :min-height='hide_thumbs ? 105 : undefined' :options="{ threshold: .5, rootMargin: '500px' }" :class="{ 'theme--dark': is_dark }")
Event(:event='event' :lazy='idx>9')
.text-center(v-else)
v-progress-circular.justify-center.align-center(color='primary' indeterminate model-value='20')
@ -75,7 +75,7 @@ export default {
},
computed: {
...mapState(['settings', 'announcements', 'events', 'filter']),
...mapGetters(['hide_thumbs']),
...mapGetters(['hide_thumbs', 'is_dark']),
visibleEvents () {
const now = this.$time.nowUnix()
if (this.selectedDay) {

View file

@ -1,5 +1,5 @@
<template>
<v-container class='px-2 px-sm-6 pt-0'>
<v-container id='home' class='px-2 px-sm-6 pt-0'>
<h1 class='d-block text-h4 font-weight-black text-center text-uppercase mt-10 mx-auto w-100 text-underline'>
<u>{{ place.name }}</u>
</h1>
@ -7,7 +7,7 @@
<!-- Events -->
<div id="events">
<v-lazy class='event' :value='idx<9' v-for='(event, idx) in events' :key='event.id' :min-height='hide_thumbs ? 105 : undefined' :options="{ threshold: .5, rootMargin: '500px' }">
<v-lazy class='event v-card' :value='idx<9' v-for='(event, idx) in events' :key='event.id' :min-height='hide_thumbs ? 105 : undefined' :options="{ threshold: .5, rootMargin: '500px' }" :class="{ 'theme--dark': is_dark }">
<Event :event='event' :lazy='idx > 9' />
</v-lazy>
</div>
@ -33,7 +33,7 @@ export default {
},
computed: {
...mapState(['settings']),
...mapGetters(['hide_thumbs']),
...mapGetters(['hide_thumbs', 'is_dark']),
},
asyncData({ $axios, params, error }) {
try {

View file

@ -1,11 +1,11 @@
<template>
<v-container class='px-2 px-sm-6 pt-0' fluid>
<v-container id='home' class='px-2 px-sm-6 pt-0' fluid>
<h1 class='d-block text-h3 font-weight-black text-center text-uppercase mt-10 mb-16 mx-auto w-100 text-underline'><u>{{tag}}</u></h1>
<!-- Events -->
<div class="mb-2 mt-1 pl-1 pl-sm-2" id="events">
<v-lazy class='event' :value='idx<9' v-for='(event, idx) in events' :key='event.id' :min-height='hide_thumbs ? 105 : undefined' :options="{ threshold: .5, rootMargin: '500px' }">
<v-lazy class='event v-card' :value='idx<9' v-for='(event, idx) in events' :key='event.id' :min-height='hide_thumbs ? 105 : undefined' :options="{ threshold: .5, rootMargin: '500px' }" :class="{ 'theme--dark': is_dark }">
<Event :event='event' :lazy='idx>9' />
</v-lazy>
</div>
@ -32,7 +32,7 @@ export default {
},
computed: {
...mapState(['settings']),
...mapGetters(['hide_thumbs']),
...mapGetters(['hide_thumbs', 'is_dark']),
},
async asyncData ({ $axios, params, error }) {
try {