mirror/piskel
1
0
Fork 0
mirror of https://github.com/piskelapp/piskel.git synced 2023-08-10 21:12:52 +03:00
Code Issues Projects Releases Wiki Activity

Issue #446: Cleanup gif export panel

Browse Source
This commit is contained in:
Julian Descottes 2016-05-23 00:40:23 +02:00
parent f66c2578ab
commit ba8964a2af
4 changed files with 47 additions and 28 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

22
src/css/settings-export.css
View File

@ -136,3 +136,25 @@
border-style: solid;
border-width: 1px;
}
.export-panel-gif .settings-item {
display: flex;
align-items: center;
overflow: hidden;
padding: 5px;
border: 1px solid #5d5d5d;
border-radius: 2px;
}
.export-panel-gif .button {
margin-right: 5px;
width: 75px;
flex-shrink: 0;
}
.gif-export-info {
padding: 10px 5px 0px;
font-weight: normal;
text-shadow: none;
font-style: italic;
}

20
src/templates/settings/export/gif.html
View File

@ -1,14 +1,14 @@
<script type="text/html" id="templates/settings/export/gif.html">
<div class="settings-title">
Export to Animated GIF
</div>
<div class="settings-item">
<form action="" method="POST" class="gif-export-form">
<div class="settings-item">
<button type="button" class="button button-primary gif-download-button">Download GIF</button>
<button type="button" class="button button gif-upload-button">Get public URL</button>
</div>
</form>
<div class="export-panel-gif">
<div class="gif-export-info">The animation will be converted to an animated GIF. Opacity will not be preserved. Colors might be resampled.</div>
<div class="settings-item">
<button type="button" class="button button-primary gif-download-button">Download</button>
<div>Download as an animated GIF.</div>
</div>
<div class="settings-item">
<button type="button" class="button button-primary gif-upload-button">Upload</button>
<div>Upload as an animated GIF to a public URL.</div>
</div>
<div class="gif-upload">
<div class="gif-export-preview"></div>
<div class="gif-upload-status"></div>

5
src/templates/settings/export/png.html
View File

@ -1,9 +1,6 @@
<script type="text/html" id="templates/settings/export/png.html">
<div class="settings-title">
Export Spritesheet
</div>
<div class="settings-item">
<div class="settings-description">PNG with all frames side by side.</div>
<div class="settings-description">Export Spritesheet as a PNG with all frames side by side.</div>
<button type="button" class="button button-primary png-download-button">Download PNG</button>
</div>
</script>

28
src/templates/settings/export/zip.html
View File

@ -1,19 +1,19 @@
<script type="text/html" id="templates/settings/export/zip.html">
<div class="settings-title">
Export as ZIP
</div>
<div class="settings-item">
<div class="settings-description">ZIP with one PNG file per frame.</div>
<div class="settings-description">File names will start with the prefix below.</div>
<div>
<div class="settings-item">
<label>Prefix</label>
<input type="text" class="zip-prefix-name textfield" autocomplete="off" placeholder="PNG file prefix ...">
<div class="settings-description">ZIP with one PNG file per frame.</div>
<div class="settings-description">File names will start with the prefix below.</div>
<div class="settings-item">
<label>Prefix</label>
<input type="text" class="zip-prefix-name textfield" autocomplete="off" placeholder="PNG file prefix ...">
</div>
</div>
<div class="settings-item">
<label>
<input class="zip-split-layers-checkbox checkbox-fix" type="checkbox" />
Split by layers
</label>
<div class="settings-item">
<label>
<input class="zip-split-layers-checkbox checkbox-fix" type="checkbox" />
Split by layers
</label>
</div>
<button type="button" class="button button-primary zip-generate-button"/>Download ZIP</button>
</div>
<button type="button" class="button button-primary zip-generate-button"/>Download ZIP</button>
</script>