pitchum/debianize-mobilizon
pitchum/debianize-mobilizon
1
0
Fork 0
Code Issues Pull Requests Projects Releases 2 Wiki Activity

fix(front): fix homepage event and groups cards snapping

Browse Source 
Signed-off-by: Thomas Citharel <tcit@tcit.fr>
This commit is contained in:
Thomas Citharel 2023-05-30 16:13:44 +02:00
parent e0488dd87f
commit 8809db582c
No known key found for this signature in database
GPG Key ID: A061B9DDE0CA0773
3 changed files with 14 additions and 10 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

6
js/src/components/Event/EventCard.vue
View File

@ -3,7 +3,7 @@
class="mbz-card snap-center dark:bg-mbz-purple" class="mbz-card snap-center dark:bg-mbz-purple"
:class="{ :class="{
'sm:flex sm:items-start': mode === 'row', 'sm:flex sm:items-start': mode === 'row',
'sm:max-w-xs sm:w-[18rem] shrink-0 flex flex-col': mode === 'column', 'sm:max-w-xs w-[18rem] shrink-0 flex flex-col': mode === 'column',
}" }"
:to="to" :to="to"
:isInternal="isInternal" :isInternal="isInternal"
@ -119,8 +119,8 @@
{{ {{
t( t(
"{count} participants", "{count} participants",
event.participantStats?.participant, { count: event.participantStats?.participant },
{ count: event.participantStats?.participant } event.participantStats?.participant
) )
}} }}
</mobilizon-tag> </mobilizon-tag>

4
js/src/components/Group/GroupCard.vue
View File

@ -2,10 +2,10 @@
<LinkOrRouterLink <LinkOrRouterLink
:to="to" :to="to"
:isInternal="isInternal" :isInternal="isInternal"
class="mbz-card shrink-0 dark:bg-mbz-purple dark:text-white rounded-lg shadow-lg flex items-center flex-col" class="mbz-card snap-center shrink-0 dark:bg-mbz-purple dark:text-white rounded-lg shadow-lg flex items-center flex-col"
:class="{ :class="{
'sm:flex-row': mode === 'row', 'sm:flex-row': mode === 'row',
'sm:max-w-xs sm:w-[18rem] shrink-0 flex flex-col': mode === 'column', 'sm:max-w-xs w-[18rem] shrink-0 flex flex-col': mode === 'column',
}" }"
> >
<div class="flex-none p-2 md:p-4"> <div class="flex-none p-2 md:p-4">

14
js/src/components/Local/CloseContent.vue
View File

@ -19,10 +19,10 @@
</div> </div>
<slot name="subtitle" /> <slot name="subtitle" />
</div> </div>
<div class="hidden sm:block" v-show="showScrollLeftButton"> <div class="" v-show="showScrollLeftButton">
<button <button
@click="scrollLeft" @click="scrollLeft"
class="absolute inset-y-0 my-auto z-10 rounded-full bg-white dark:bg-transparent w-10 h-10 border border-shadowColor -left-5" class="absolute inset-y-0 my-auto z-10 rounded-full bg-white dark:bg-transparent w-10 h-10 border border-shadowColor -left-5 ml-2"
> >
<span class="">&lt;</span> <span class="">&lt;</span>
</button> </button>
@ -36,10 +36,10 @@
<slot name="content" /> <slot name="content" />
</div> </div>
</div> </div>
<div class="hidden sm:block" v-show="showScrollRightButton"> <div class="" v-show="showScrollRightButton">
<button <button
@click="scrollRight" @click="scrollRight"
class="absolute inset-y-0 my-auto z-10 rounded-full bg-white dark:bg-transparent w-10 h-10 border border-shadowColor -right-5" class="absolute inset-y-0 my-auto z-10 rounded-full bg-white dark:bg-transparent w-10 h-10 border border-shadowColor -right-5 mr-2"
> >
<span class="">&gt;</span> <span class="">&gt;</span>
</button> </button>
@ -63,7 +63,7 @@ const emit = defineEmits(["doGeoLoc"]);
const { t } = useI18n({ useScope: "global" }); const { t } = useI18n({ useScope: "global" });
const showScrollRightButton = ref(true); const showScrollRightButton = ref(false);
const showScrollLeftButton = ref(false); const showScrollLeftButton = ref(false);
const scrollContainer = ref<any>(); const scrollContainer = ref<any>();
@ -100,6 +100,10 @@ const scrollHorizontalToVertical = (evt: WheelEvent) => {
}; };
onMounted(async () => { onMounted(async () => {
// Make sure everything is mounted properly
setTimeout(() => {
scrollHandler();
}, 1500);
scrollContainer.value.addEventListener("wheel", scrollHorizontalToVertical); scrollContainer.value.addEventListener("wheel", scrollHorizontalToVertical);
}); });