diff --git a/README.md b/README.md index 7a44d80..fa561a1 100644 --- a/README.md +++ b/README.md @@ -14,12 +14,10 @@ Suggestions / Planned features: - Line tool - Resize canvas -- Snap brush preview to pixel grid -- Move selection with arrows +- Resize sprite - Load palette from LPE file -- Move colours in palette editor +- Move colours in (advanced) palette editor - Duplicate layer -- Hide non-hovered layers - Symmetry options - Custom color picker @@ -33,9 +31,6 @@ Suggestions / Planned features: - Stack colors when too many - Fix popups -- Show colors which would need to be added to palette - -- Palette option remove unused colors - Pixel Grid - Another currentLayer.canvas - Must be rescaled each zoom @@ -43,6 +38,17 @@ Suggestions / Planned features: - Possibly add collaborate function - Bug fix - Alt + scroll broken + +- Polish: + - Show colors which would need to be added to palette + - Warning windows for wrong inputs + - Hide non-hovered layers + - Snap brush preview to pixel grid + - Palette option remove unused colors + - Move selection with arrows + - Update pivot buttons when resizing canvas + - Update borders by dragging the canvas' edges with the mouse when resizing canvas + - Move the canvases so they're centered after resizing the canvas (maybe a .center() method in layer class) ## How to Contribute diff --git a/css/pixel-editor.scss b/css/pixel-editor.scss index 557832e..97ba31b 100644 --- a/css/pixel-editor.scss +++ b/css/pixel-editor.scss @@ -974,8 +974,8 @@ svg { path { fill:$basehovericon; } - transition: background 150ms ease-in-out, - transform 150ms ease; + transition: background 100ms ease-in-out, + transform 100ms ease; -webkit-appearance: none; -moz-appearance: none; } @@ -1004,6 +1004,28 @@ svg { left:10px; text-align:center; + button { + background:$basehover; + border:none; + + color: $basehovericon; + transition: background 100ms ease-in-out, + transform 100ms ease; + -webkit-appearance: none; + -moz-appearance: none; + } + + button:hover, + button:focus { + cursor:pointer; + background-color: $baseicon; + color:$basehovericonhover; + border: 2px solid color(base, foreground); + } + button:active { + transform: scale(0.95); + } + input { position:relative; margin-left:10px; diff --git a/js/_resizeCanvas.js b/js/_resizeCanvas.js index 2e0460c..cbdd56b 100644 --- a/js/_resizeCanvas.js +++ b/js/_resizeCanvas.js @@ -45,8 +45,8 @@ function changedBorder(event) { } function changedSize(event) { - let widthOffset = document.getElementById("rc-width").value - layers[0].canvasSize[0]; - let heightOffset = document.getElementById("rc-height").value - layers[0].canvasSize[1]; + let widthOffset = Math.abs(document.getElementById("rc-width").value) - layers[0].canvasSize[0]; + let heightOffset = Math.abs(document.getElementById("rc-height").value) - layers[0].canvasSize[1]; let left = Math.round(widthOffset / 2); let right = widthOffset - left; @@ -139,11 +139,6 @@ function resizeCanvas(event) { break; } - /* - leftOffset = Math.abs(leftOffset); - topOffset = Math.abs(topOffset); - */ - for (let i=0; i