Settings Modal is Displacing when going through tabs

[devishraq]

Problem Description

When users open the settings modal and navigate through the tabs, specifically the Judge tab, the entire modal shifts. This issue is caused by the use of the overflow-y-auto class, which hides the scrollbar when on the Judge tab.

Simplistic Solution

The proposed solution is to set overflow-y: scroll; to ensure the scrollbar is always present, thereby preventing the displacement. Additionally, the scrollbar should be hidden but its functionality retained.

Uploading Screen-Recording-2024-08-06T08_23_21.970Z.mp4…

[devishraq]

I think I would be able to solve this.....Any one please assign me this!

[devishraq]

@thecodingwizard! Which approach will be much better removing the scrollbar while the settings modal is opened but keeping scrolling functionalities or just using overflow-y: scroll?

The first approach will be better I think....

[thecodingwizard]

Sorry could you re-upload the screen recording? I don't think it uploaded properly and I can't reproduce this issue on my end (though I'm on a mac).

The first approach is indeed better but I'm not actually sure how this can be done (maybe scrollbar width can be configured with CSS? not sure...)

[devishraq]

@thecodingwizard I am unable to upload it here....I don't why!....But here is a link from jumpshare:-
https://jumpshare.com/s/sLqkXGVLViKLRES3wTYu

[devishraq]

Here you can see : I forked, cloned, and edited and the result:-
https://jmp.sh/s/ChCcddzt0nJtzF1oZ1KT
I have taken the first approach as it may slightly improve the cleanliness of the UI!

[devishraq]

@thecodingwizard ! can you check the videos and the pull request kindly?

[thecodingwizard]

Closed via #157 , thank you @devishraq !