pixel-editor/views/canvas-resize-popup.hbs

59 lines
2.4 KiB
Handlebars

<!--CANVAS RESIZE-->
<div class="update" id = "resize-canvas">
<button class="close-button">{{svg "x.svg" width="20" height="20"}}</button>
<h1>Resize canvas</h1>
<!--PIVOTS-->
<span id = "pivot-menu">
<button class="pivot-button" value="topleft">{{svg "arrows/topleft.svg" width="20" height="20"}}</button>
<button class="pivot-button" value="top">{{svg "arrows/top.svg" width="20" height="20"}}</button>
<button class="pivot-button" value="topright">{{svg "arrows/topright.svg" width="20" height="20"}}</button>
<button class="pivot-button" value="left">{{svg "arrows/left.svg" width="20" height="20"}}</button>
<button class="pivot-button rc-selected-pivot" value="middle">{{svg "arrows/middle.svg" width="20" height="20"}}</button>
<button class="pivot-button" value="right">{{svg "arrows/right.svg" width="20" height="20"}}</button>
<button class="pivot-button" value="bottomleft">{{svg "arrows/bottomleft.svg" width="20" height="20"}}</button>
<button class="pivot-button" value="bottom">{{svg "arrows/bottom.svg" width="20" height="20"}}</button>
<button class="pivot-button" value="bottomright">{{svg "arrows/bottomright.svg" width="20" height="20"}}</button>
</span>
<!-- SIZE-->
<span id = "rc-size-menu">
<h2>Size</h2>
<div>
<span>
Width: <input id="rc-width" type="number" default="0" step="1"
value="{{#if border}}{{border}}{{else}}0{{/if}}" autocomplete="off"/>
</span>
<span>
Height: <input id="rc-height" default="0" step="1" type="number"
value="{{#if border}}{{border}}{{else}}0{{/if}}" autocomplete="off"/>
</span>
</div>
</span>
<!--BORDERS-->
<span id = "borders-menu">
<h2>Borders offsets</h2>
<div>
<span>
Left: <input id="rc-border-left" type="number" default="0" step="1"
value="{{#if border}}{{border}}{{else}}0{{/if}}" autocomplete="off"/>
</span>
<span>
Right: <input id="rc-border-right" type="number" default="0" step="1"
value="{{#if border}}{{border}}{{else}}0{{/if}}" autocomplete="off"/>
</span>
<span>
Top: <input id="rc-border-top" type="number" default="0" step="1"
value="{{#if border}}{{border}}{{else}}0{{/if}}" autocomplete="off"/>
</span>
<span>
Bottom: <input id="rc-border-bottom" default="0" step="1" type="number"
value="{{#if border}}{{border}}{{else}}0{{/if}}" autocomplete="off"/>
</span>
</div>
<button id = "resize-canvas-confirm">Resize canvas</button>
</span>
</div>