Change how stage overlays & fullscreen are handled
This makes the layout behavior for stage overlays much more consistent. Items whose overflow *should* be contained within the stage, like the monitors and color picker loupe, are now placed within the "stage" element directly. Items whose overflow should *not* be contained within the stage, like the target highlight box and dragged sprite, are now inside a "stage overlays" container element, which is properly positioned (taking into account the stage's border width) and sized. This is made possible by unifying stage layout across both fullscreen & non-fullscreen modes via moving the fullscreen overlay styles to the StageWrapper component. Whereas previously, the stage overlays were positioned *outside* of the stage in fullscreen and had to reposition themselves correctly, they are now positioned the same in both fullscreen and regular modes.
Showing
- src/components/gui/gui.jsx 1 addition, 0 deletionssrc/components/gui/gui.jsx
- src/components/stage-wrapper/stage-wrapper.css 19 additions, 0 deletionssrc/components/stage-wrapper/stage-wrapper.css
- src/components/stage-wrapper/stage-wrapper.jsx 5 additions, 1 deletionsrc/components/stage-wrapper/stage-wrapper.jsx
- src/components/stage/stage.css 22 additions, 45 deletionssrc/components/stage/stage.css
- src/components/stage/stage.jsx 53 additions, 55 deletionssrc/components/stage/stage.jsx
Loading
Please register or sign in to comment