phetsims / circuit-construction-kit-common

"Circuit Construction Kit: Basics" is an educational simulation in HTML5, by PhET Interactive Simulations.
GNU General Public License v3.0
10 stars 10 forks source link

Setting pageControl.visibleProperty to false causes circuitElementToolbox to lose alignment with left UI #953

Closed matthew-blackman closed 1 year ago

matthew-blackman commented 1 year ago

Dynamic layout issue when hiding the dots. The carousel shifts to the left and loses its alignment with the buttons below.

Screen Shot 2023-01-25 at 8 57 59 AM
AgustinVallejo commented 1 year ago

Will take a look!

arouinfar commented 1 year ago

Thanks @AgustinVallejo!

Looks like the solution was to add slightly more left padding to the sim and then shift everything to the left when the pageControl dots were hidden. I like it!

Not sure if your commits need to be reviewed or not, so back to @matthew-blackman @samreid.

samreid commented 1 year ago

Now that we fixed the layout of the PageControls to respect the horizontal margin, the horizontal margin of 17 (which used to be for the carousel) is very far. There is a lot of trapped space to the left of the toolbox:

image

Let's reduce that somewhat.

samreid commented 1 year ago

I reduced it and it seems much better with and without the page controls:

image

Closing.