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

Added progress bar for GIF rendering

Browse Source
This commit is contained in:
jdescottes
2014-04-12 12:08:53 +02:00
parent 3abf0897d5
commit 09319ecc1b
8 changed files with 155 additions and 61 deletions
Download Patch File Download Diff File Expand all files Collapse all files

47
src/css/settings-export.css Normal file
View File

@@ -0,0 +1,47 @@
/* Gif/Png Export Setting panel*/
/*******************************/
.gif-upload-button,
.gif-render-button {
/*float : right;*/
margin-top : 10px;
margin-right : 10px;
}
.gif-export-radio-group {
margin:10px 0;
}
.gif-export-preview,
.png-export-preview {
margin-top:20px;
max-width:240px;
position:relative;
}
.png-export-preview {
margin:10px 0;
overflow: hidden;
}
.png-export-preview img {
float: left;
}
.png-upload-status {
margin : 10px 0;
}
.preview-upload-ongoing:before{
content: "Upload ongoing ...";
position: absolute;
display: block;
height: 100%;
width: 100%;
text-align: center;
padding-top: 45%;
box-sizing:border-box;
-moz-box-sizing:border-box;
background: rgba(0,0,0,0.5);
color: white;
}

42
src/css/settings.css
View File

@@ -21,9 +21,9 @@
margin-right: 0;
}
/*
* Settings icons
*/
/********************************************************** *j* j** j*j j j j** *****************/
/* Settings icons I I I I I\I \ */
/********************************************************** *** *** *** * * '** *****************/
.tool-icon.gallery-icon {
background-image: url(../img/gallery.png);
@@ -104,6 +104,10 @@
border-left : 3px solid gold;
}
/************************************************************************************************/
/* Common settings classes */
/************************************************************************************************/
.settings-section {
margin: 10px 20px;
font-size: 12px;
@@ -133,6 +137,10 @@
margin-bottom: 10px;
}
/************************************************************************************************/
/* Application settings */
/************************************************************************************************/
.background-picker-wrapper {
overflow: hidden;
padding: 10px 5px 20px 5px;
@@ -166,11 +174,12 @@
border: gold 1px solid;
}
/* Gif/Png Export Setting panel*/
/*******************************/
/************************************************************************************************/
/* Gif/Png Export panel */
/************************************************************************************************/
.gif-upload-button,
.gif-render-button {
/*float : right;*/
margin-top : 10px;
margin-right : 10px;
}
@@ -179,6 +188,17 @@
margin:10px 0;
}
.gif-export-progress-status {
margin-left: 5px;
}
.gif-export-progress-bar {
margin-top:5px;
height:3px;
width: 0;
background:gold;
}
.gif-export-preview,
.png-export-preview {
margin-top:20px;
@@ -213,7 +233,10 @@
color: white;
}
/* Import panel */
/************************************************************************************************/
/* Import panel */
/************************************************************************************************/
.import-section,
.resize-section {
margin: 15px 0;
@@ -291,6 +314,11 @@
vertical-align: middle;
}
/************************************************************************************************/
/* Browse local piskels panel */
/************************************************************************************************/
.local-piskels-list {
width: 100%;
}