Console panel overlaps with the Preview panel #57028
Labels
help wanted
Open for all. You do not need permission to work on these.
platform: learn
UI side of the client application that needs familiarity with React, Gatsby etc.
scope: UI
Threads for addressing UX changes and improvements to user interface
Comments
|
Taking this one on! |
|
@jatin0801 this issue is not open for contributing, it has not been triaged yet |
|
Not sure why we need the Unless I'm missing something, I would suggest removing it. We do have the same issue with the Python challenges output console, but that is less of an issue and isn't fixed by removing the referred to |
|
That should be fine to remove, I think. Opening for contribution. |
4 tasks
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Describe the Issue
With the desktop layout on Step based challenge, When the console panel is opened, it overlaps with the preview panel, making part of the preview invisible unless the camper reduces the height of console panel.
Therefore, the camper cannot open a large enough console panel to debug and see all of the preview panel at the same time.
(It seems that the
min-height: 70vh;property for.challenge-previewclass is the cause of this issue.)Affected Page
https://www.freecodecamp.org/learn/javascript-algorithms-and-data-structures-v8/learn-basic-string-and-array-methods-by-building-a-music-player/step-76
Steps to Reproduce
Expected behavior
The console panel does not overlap with the preview panel, so campers can always refer the entire preview panel even when they have the console panel open with enough height.
Screenshots
Console panel overlaps with the Preview panel
System
Additional context
None
The text was updated successfully, but these errors were encountered: