ritmillio / next-reveal

The easiest way to animate your Next.js project. Scrollreveal.js helper package.
https://next-reveal-site-ritmillio.vercel.app/
57 stars 4 forks source link

RevealList not working #5

Closed u007 closed 1 year ago

u007 commented 1 year ago

RevealWrapper works but RevealList does not work on nextjs13 with restrictedmode true

<RevealList
                interval={60}
                delay={300}
                distance={200}
                style={{ display: 'grid' }}
            >
                <Grid.Col xs={6}>
                        <Link href={`/post/${secondTrendingPost.slug}`}>
                            <Image
                                src={secondTrendingPost.image}
                                alt="image"
                                mb="xs"
                                height={200}
                                withPlaceholder
                            />
                            <Tag label={secondTrendingPost.category} />
                            <Text size="xl" fw="bold" ff="bitter">
                                {secondTrendingPost.title}
                            </Text>
                            <Group my="xs">
                                <Likes
                                    count={
                                        secondTrendingPost.upvotes
                                            ? Object.keys(
                                                  secondTrendingPost.upvotes,
                                              ).length
                                            : 0
                                    }
                                />
                                <Comments
                                    count={secondTrendingPost.commentsCount}
                                />
                            </Group>
                        </Link>
                </Grid.Col>
                <Grid.Col xs={6}>
                        <Link href={`/post/${thirdTrendingPost.slug}`}>
                            <Image
                                src={thirdTrendingPost.image}
                                alt="image"
                                mb="xs"
                                height={200}
                                withPlaceholder
                            />
                            <Tag label={thirdTrendingPost.category} />
                            <Text size="xl" fw="bold" ff="bitter">
                                {thirdTrendingPost.title}
                            </Text>
                            <Group my="xs">
                                <Likes
                                    count={
                                        thirdTrendingPost.upvotes
                                            ? Object.keys(
                                                  thirdTrendingPost.upvotes,
                                              ).length
                                            : 0
                                    }
                                />
                                <Comments
                                    count={thirdTrendingPost.commentsCount}
                                />
                            </Group>
                        </Link>
                </Grid.Col>
            </RevealList>
ritmillio commented 1 year ago

Hello @u007 , What is Grid.Col? How can I reproduce this issue ? Please let me know. Have you tried a simple way if the issue is with RevealList by simply add some divs and check if that's working or not ?

u007 commented 1 year ago

hi, i did test on some div, it is the same. Grid.Col is from mantine ui v6 https://v6.mantine.dev/core/grid/

ritmillio commented 1 year ago

I cannot debug without any error message ? Could you please check your console/terminal for any errors? Since I don't know your current Nextjs setup I have no way to debug it. I tested it on my end with simple divs and it's just working fine.

ritmillio commented 1 year ago

Couldn't reproduce the bug, This issue is closed for now,