-
Notifications
You must be signed in to change notification settings - Fork 260
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
FE - Status Page graph not displaying well on high resolution screens #1729
Comments
If anyone would like to work on this, I'd be happy to provide some additional (minor) fix requests for the status page. |
@gorkem-bwl can I take this on? |
i can fix this could you please assign this to me @ajhollid , @gorkem-bwl ? |
@FlowerC9 currently I don't have a design for this as we're quite focused on the release issues. Do you have something in mind? |
can you @ajhollid please tell the steps to recreate this i have tried but it seems bar graphs is fine? |
i not able to check in 4k @ajhollid .can you @gorkem-bwl please unassign me from this issue since i don't have any 4k medium so i'm not able to check is it fixed or not. |
Sure, thanks for noting down. |
@gorkem-bwl , I think I have resolution settings on my mac. ![]() Assign me this if I am not wrong. |
You should be good to go @Owaiseimdad ! |
@ajhollid possible to help me in setup for checkmate? -> When you tell Change directory to the Docker/dev directory which directory are you trying to change? I some how understood something so started with https://docs.checkmate.so/users-guide/quickstart#manual-install Also, I don’t see any server-client repo at all. What am I missing here? Also, as I am working on frontend, was thinking of manual installation in frontend and backend will be on docker. Please help me here also, if there is any other chat available to have a quick huddle let me know. |
@Owaiseimdad you are right - we are planning to write that section from scratch to eliminate any confusion.
Checkmate backend: https://github.com/bluewave-labs/checkmate-backend
You can use our Discord channel for this. |
@gorkem-bwl , looks like my current mac has only 3360x2100 which is not 4K but close to it. I do have a monitor will try to see I f I can reproduce in it as I am not able to reproduce it the above resolution I have. |
@Owaiseimdad this one happens with the status page in fact. You'd need to run the latest code and create a status page first, and then go from there. Can yo do it? |
Yes @gorkem-bwl , you are right. Analysis: The issue is with respect to the code used for width calc(30vw / 25) is problematic because vw(viewport width) scales with screen size and division with 25 might not give expected results on high resolutions. Changing it to rem does resolve the issue but I see if I zoom in with the vw or rem the issue remains the same. ![]() Added margin-left to avoid anything in future also, there are two boxes so implement a common HOF so that if they are changed then both side are affected. ![]() ![]() Looking at more possible scenarios which can cause issue, if I find none, will raise a PR. |
Many thanks digging deep here @Owaiseimdad - that is a good starting point and waiting for your PR for the next release, which is 2.1 |
@gorkem-bwl this has been pushed to development now, we can close this. |
Perfect, thanks. |
On the status page graph bars do not have consistent gap spacing, which leads to issues on high resolution screens:
Expected:

Actual:

The text was updated successfully, but these errors were encountered: