Component layout proposal for landscape view / high res

[kamelie1706]

Hi,

Fantastic project!
Any hope to get a layout more suitable to landscape/high res screen such as this

Ideally would be we could move the different components as we wish ... It is a long time I have not dealt with HTML but was under impression could be done in HTML5
https://www.w3schools.com/howto/howto_js_draggable.asp

[benchmarko]

Good idea!
The virtual keyboard is already movable... ;)
I was also thinking about different views for coding and game play.

[kamelie1706]

Indeed realized it after! I could not move it on the side to the output screen only up and down but I guess this is just how it is coded now in html layout

[benchmarko]

I experimented a bit with moving the components, now it's close to your suggestion (index2.html):
https://benchmarko.github.io/CPCBasicTS/index2.html?showKbd=true&showVariable=true

Could still be improved, e.g. the keyboard is a bit too wide.
On narrow screens (or mobiles), the right area is attached at the bottom. Now with additional functions in between, not so optimal.

I'm thinking about putting the CPC screen on the left. And replacing the open/collapse buttons with settings buttons.

[kamelie1706]

Looks great!

[benchmarko]

After some UI changes you can now drag elements (v0.2.6). This needs to be activated under "View".