Skip to content
New issue

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

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

Already on GitHub? Sign in to your account

Scrollable Areas #76

Open
rogadev opened this issue May 10, 2023 · 2 comments
Open

Scrollable Areas #76

rogadev opened this issue May 10, 2023 · 2 comments

Comments

@rogadev
Copy link

rogadev commented May 10, 2023

Describe the bug

The way the current scrollable area is structured within the HTML is such that using a tool like the Chrome extension GoFullPage doesn't allow it to capture the full scrollable area. This is because of the way the child element handles height and overflow.

I would recommend making it such that the full report takes up as much vertical space as it needs, instead of being an internally scrollable area with overflow handling and a fixed height. I've included a screenshot of what you get, vs what you might expect to see when screenshotting another webpage with the same tool.

screencapture-localhost-5678-2023-05-09-18_18_00

screencapture-victoria-mossaway-ca-2023-05-09-18_25_36

I'm sure you're working on a version that has a quick export report function. Until then, this would otherwise be a very easy way to export a PNG or PDF version of the report. I hope this helps!

Reproduction

No response

System / Nuxt Info

System:
    OS: Windows 10 10.0.22621
    CPU: (12) x64 Intel(R) Core(TM) i7-10750H CPU @ 2.60GHz
    Memory: 5.61 GB / 15.83 GB
  Binaries:
    Node: 18.12.1 - C:\Program Files\nodejs\node.EXE
    Yarn: 1.22.18 - ~\AppData\Roaming\npm\yarn.CMD
    npm: 9.6.1 - C:\Program Files\nodejs\npm.CMD
  Browsers:
    Edge: Spartan (44.22621.1555.0), Chromium (113.0.1774.35), ChromiumDev (115.0.1843.0)
    Internet Explorer: 11.0.22621.1
@rogadev rogadev changed the title Scrollable Area Page Structure Scrollable Areas May 10, 2023
@NathanBeddoeWebDev
Copy link

I agree with this, I think having the main part of the page have an inner overflow is kinda janky, and most users (especially if the dashboard is shared with less technical users in a company) would be frustrated about it.

@harlan-zw I've got a branch on my fork that changes the layout to using the base page overflow, and then stickies the nav, Table Header and sidebar tab navigation. I'll wait for your input as to why it was done like this originally and then I can raise the PR if you're happy to go in this direction.

Messing with positioning attributes can be a little annoying, that would be my only concern.

@harlan-zw
Copy link
Owner

I honestly can't remember why it was set up like this @NathanBeddoeWebDev, happy to take a look at the PR :)

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
3 participants