Images are draggable by default, but when used within buttons or as
clickable elements, they should not be draggable because starting a drag
accidentally prevents the click event.
* add feedback form
This implements #829
* small style updates to the stage buttons
from @carljbowman
* remove `stageSize` for now
We eventually need this, but not yet, and it’s causing lint failure.
* Implement GH-830: Add coming soon tooltips
This implements coming soon tooltips for:
* the small stage size
* save, load and language
It also creates the component that can be copied over into the paint editor for use there as well.
Lastly, this does a small refactor on the full screen implementation to include multiple small screen sizes too.
Commit fceba4e8b introduced new sizing behavior for the stage in
order to fit everything in a 1024 width. Adopted this same behavior
for the StageHeader component.
1. Fixed issue with sprites not being dragable when stage zoomed.
2. Fixed issue with coordinates of mouse position being wrong when
stage is zoomed. This was caused by the renderer not being
resized when zooming/unzooming.
3. Refactored zoom control to separate react component/containter
with global reducer for isZoomed, which is passed to the stage
container. This allows for the zoom control to zoom the stage
menu and stage as seperate containers.
4. Added icons zoom/unzoom for stage zoom control. Moved icon
position to be part of stage menu floating to right of start/stop
buttons.
Attaching the storage module in `vmListenerHOC` means it can propagate
down to the GUI, stage, and blocks naturally. The default VM property
value has been removed from those places so that we're not instantiating
extra VM instances any more. Instead, using one of those components
outside of the `vmListenerHOC` framework will require providing a VM
instance as a property.
* Covers parts of these issues: GUI layout panes (#69), sprite libraries (#12), import buttons (#64), menu bar (#67), and sprite info area (#53)
~ Refactored layout pane structure by removing `display: flex` from `.box`, by default. Declaring flex instead only where specifically needed. This helped fix layout quirks, and should help us avoid hard to find issues related to nested flex boxes
~ Added descriptive classnames to boxes/containers/wrappers. Moved more padding, margins + layout into these wrappers to help with component reusability.
~ Set up a spacer unit variable inside `gui.css`, to start keeping consistent padding, margins and rounded corners between panes. Used [CSS/PostCSS Modules](https://github.com/css-modules/postcss-modules-values) to avoid SCSS dependency.
~ Refactored inline styles from JSX, into CSS files. 2 reasons: a) prepping for reuse of CSS Module variables. b) Feels easier to debug complex flex layouts when all the styles are in one place vs JS/HTML/CSS syntax mixed together
~ Added menu bar into layout via new component, and sprite info header in sprite selector pane, with stubs for the labels + forms. Sprite items are correctly scrolling, while leaving the header fixed, in Chrome. Mostly working in FFx. Not working in Safari, IE yet.
~ Style pass on library modal
~ Experimenting with a few different transition styles: Logo in menu bar, sprite library items, Add buttons.
Move layout styles from component stylesheets to the GUI, or the component that is placing the component.
Add a new `Box` component to control layouts, basically giving a convenient way to lay out with flexbox.
Use `Box` as the output component for any component that may need to be passed layout options. The props passing convention allows giving layout props to the final `Box` component, making wrapping with another `Box` unnecessary in some cases.
Paul Kaplan