fix(playground): remove redundant vertical scroll bar

[OnkarRuikar]

• fixes Playground: Seeing double scrollbars in code editors #10732

Summary

Seeing two y-scrollbars in editors when code is long.

The playground doesn't work in internet archive so it's hard to know when and where the issue appeared. Looking at the current code. Parent wrapper .editor has overflow: scroll set so both x and y scrollbars are always visible. And child wrapper .cm-editor also has height 100% set. As the child has fixed height so when code is long the child also get y-scrollbar.

Solution

Instead of limiting the child .cm-editor height to 100% set min-height: 100%. So the child becomes long and the parent's .editor's scrollbar becomes usable.

Bonus

The code is actually being wrapped so there is no need of x-scrollbar on .editor. So instead of overflow: scroll we could use overflow-y: scroll.

Screenshot

Before

After

Testing

Ran yarn dev and tried on Chrome, Edge, and Brave browsers on Linux Mint.

[fiji-flo]

Thanks a lot! (the ugly curse of OS depending scroll bars)