nand2tetris / web-ide

A web-based IDE for https://nand2tetris.org
https://nand2tetris.github.io/web-ide
Other
84 stars 22 forks source link

Fix compiler page offset when having too much tabs #460

Closed netalondon closed 1 month ago

netalondon commented 2 months ago

Fixes #451

the line position: absolute !important; caused the issue. disply: none; achieves the same effect.

DavidSouther commented 2 months ago

Unfortunately, this breaks keyboard interactions. The current form allows keyboard focus on the tabs to use the arrow keys to move tabs.

netalondon commented 2 months ago

We can do opacity: 0; instead, but this leaves a small gap after the label.

before: Screenshot from 2024-09-16 18-04-16

after: Screenshot from 2024-09-16 18-04-22

Is this good enough?

DavidSouther commented 2 months ago

How does it look by removing the position: absolute and setting opacity: 0; margin-inline: -1px;?

netalondon commented 2 months ago

How does it look by removing the position: absolute and setting opacity: 0; margin-inline: -1px;?

There's still a gap but smaller: Screenshot from 2024-09-16 19-01-19

margin-inline: -7px; looks most similar to the initial version. Should I just do that?

DavidSouther commented 2 months ago

It makes me a tiny bit uncomfortable, but just add a comment explaining why it's that way.