finos / a11y-theme-builder

DesignOps toolchain theme builder for accessibility inclusion using Atomic Design.
Apache License 2.0
46 stars 69 forks source link

[TB] Incomplete Visibility of Laptop Component in Full-Screen Mode #867

Open aadhil2k4 opened 6 months ago

aadhil2k4 commented 6 months ago

Problem/Concern

SCR-20240507-qgww

The laptop component in the template section is not fully visible when in full-screen mode. However, it is visible in the small window view.

This is one of the deployments where I found the issue : link to problem content

Proposed Solution

aaronreed708 commented 6 months ago

Hi @aadhil2k4, thank you for opening the issue! Can you provide a little more information? What OS and browser were you on? Were you running a version that you had built or one of our deployed versions? I'm personally not having a problem with the laptop being chopped off on MacOS with Chrome.

aadhil2k4 commented 6 months ago

I got this issue on both Chrome and Safari on MacOS. I tried my locally-built version as well as your deployed versions. The same issue persists in both versions.

aaronreed708 commented 6 months ago

@aadhil2k4 Sorry, I had missed that you had replied to this issue. If I am blocking you in the future, please feel free to ping me directly to make sure that I'm on the ball.

I am unable to recreate what you are seeing. if the laptop is visible in small window mode I cannot get it to be chopped off in fullscreen mode. However, I did find today that if I am using zoom in my browser to make its contents display a little larger, then I'm ending up with a chopped off laptop like you are reporting. I also notice that if I zoom in that the text that is supposed to be displayed below the laptop, "Sample Template - more coming soon", it is overlaid by the laptop.

I don't see a way to address this apart from introducing scroll bars to the page unless you can find a way to lockdown the laptop image. Do you have any suggestions?

aadhil2k4 commented 6 months ago

@aaronreed708 yes I noticed that too. I think the only way is to add scroll functionality to the page. If I find any more ways I will let you know.

aaronreed708 commented 4 months ago

Discussed with @aadhil2k4 yesterday. He tried using overflow-y: auto with no success. When I looked at the app, I saw that we already had a rule in there using overflow-y: scroll. Which makes me think that at one time we did have the capability to scroll and some later change has since prevented it from working. So maybe that should be the next thing to look at? Did this EVER work?