Adding moar icons + anim preview + code removal

This commit is contained in:
grosbouddha
2013-06-12 18:39:33 +02:00
parent 31062a70a9
commit 5de77dc6fb
19 changed files with 22291 additions and 31 deletions

View File

@@ -1,17 +0,0 @@
.preview-container {
background : white;
border : 0px Solid black;
border-radius:5px 0px 0px 5px;
box-shadow : 0px 0px 2px rgba(0,0,0,0.2);
font-size: 0;
}
.preview-container canvas {
border : 0px Solid transparent;
}
#preview-fps {
width : 200px;
}

View File

@@ -98,6 +98,11 @@
border-style: solid;
}
/**
* Drag n drop styles.
*/
.preview-tile.ui-draggable-dragging {
opacity: 0.3;
}

View File

@@ -3,6 +3,7 @@
body {
background: -webkit-radial-gradient(circle, #000, #373737);
}
/**
* Application layout
*/
@@ -46,7 +47,6 @@ body {
.right-column {
display: inline-block;
vertical-align: top;
background: blue;
margin-left: 10px;
}
@@ -81,6 +81,39 @@ body {
z-index: 10;
}
/**
* Animated preview styles.
*/
.preview-container {
border : 0px Solid black;
border-radius:5px 0px 0px 5px;
box-shadow : 0px 0px 2px rgba(0,0,0,0.2);
font-size: 0;
}
.preview-container canvas {
border : 0px Solid transparent;
}
.display-fps {
float: left;
color: #aaa;
font-size: 12px;
min-width: 55px;
vertical-align: bottom;
line-height: 24px;
}
.range-fps {
overflow: hidden;
}
.application-actions {
margin-top: 35px;
}
/**
* User messages
*/

View File

@@ -17,8 +17,8 @@
margin: 1px;
background-color: rgba(200,200,200, .1);
background-repeat: no-repeat;
background-position: 9px 9px;
background-size: 28px;
background-position: 12px 12px;
background-size: 24px 24px;
}
.tool-icon.selected {
@@ -41,7 +41,9 @@
}
.tool-icon.tool-vertical-mirror-pen {
background-image: url(../img/tools_legacy/vertical-mirror-pen.png);
background-image: url(../img/tools/mirror.png);
background-position: 0px 10px;
background-size: 38px 27px;
}
.tool-icon.tool-paint-bucket {
@@ -49,15 +51,17 @@
}
.tool-icon.tool-eraser {
background-image: url(../img/tools_legacy/eraser.png);
background-image: url(../img/tools/eraser.png);
}
.tool-icon.tool-stroke {
background-image: url(../img/tools_legacy/stroke.png);
background-image: url(../img/tools/stroke.png);
}
.tool-icon.tool-rectangle {
background-image: url(../img/tools_legacy/rectangle.png);
background-image: url(../img/tools/rectangle.png);
background-position: 12px 14px;
background-size: 24px 20px;
}
.tool-icon.tool-circle {
@@ -66,10 +70,14 @@
.tool-icon.tool-move {
background-image: url(../img/tools/hand.png);
background-position: 12px 12px;
background-size: 24px 24px;
}
.tool-icon.tool-rectangle-select {
background-image: url(../img/tools_legacy/select.png);
background-image: url(../img/tools/rectangle_selection.png);
background-position: 12px 14px;
background-size: 24px 20px;
}
.tool-icon.tool-shape-select {
@@ -78,6 +86,8 @@
.tool-icon.tool-colorpicker {
background-image: url(../img/tools/eyedropper.png);
background-position: 12px 12px;
background-size: 23px 23px;
}
/*