Skip to content
New issue

Have a question about this project? # for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “#”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? # to your account

CanvasHeight set to 100% seems to collapse clover-viewer-content when below 767px window width #214

Open
tarjelavik opened this issue May 28, 2024 · 0 comments

Comments

@tarjelavik
Copy link

I am checking Clover on a new site. I can't seem to get responsive height to work properly. The viewer below collapses the content-viewer-content div when the width is below 767px.

 <div className='w-full h-[500px] md:h-[700px] lg:h-[70vh] relative dark:nx-bg-primary-300/10 bg-slate-200 z-0'>
    <Viewer
      iiifContent={manifestId}
      options={{
        canvasHeight: '100%',
        informationPanel: {
          open: false
        },
        ...config // Override default options
      }}
    />
</div>

If canvasHeight is set to a fixed value it works fine.

This happens with the demo manifest (https://api.dc.library.northwestern.edu/api/v2/works/71153379-4283-43be-8b0f-4e7e3bfda275?as=iiif) and my less than perfect manifests (https://api-ub.vercel.app/items/ubb-diplom-0080/manifest).

Inline style or Tailwindcss results in the same behaviour.

Handeling an interactive component on mobile is tricky i guess, but it seems like the Clover Viewer should handle it a bit better :-)

# for free to join this conversation on GitHub. Already have an account? # to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

1 participant