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

proto init implementation + less

Browse Source
This commit is contained in:
Vince
2013-06-12 14:53:47 +02:00
parent 5ff471e58f
commit 31062a70a9
62 changed files with 355 additions and 302 deletions
Download Patch File Download Diff File Expand all files Collapse all files

211
css/tools.css
View File

@@ -1,211 +0,0 @@
.tools-group {
float: left;
height: 30px;
border-left: 1px solid #ccc;
padding: 0 3px;
}
.tool-icon {
float: left;
cursor : pointer;
width: 30px;
height: 30px;
background-color: transparent;
background-repeat: no-repeat;
background-position: 7px 7px;
}
/*
* Framesheet level actions:
*/
.tool-icon.tool-save {
background-image: url(../img/actions/save.png);
}
.tool-icon.tool-export {
background-image: url(../img/actions/image-export.png);
}
.tool-icon.tool-upload {
background-image: url(../img/actions/image-upload.png);
}
.tool-icon.tool-add-frame {
background-image: url(../img/actions/add.png);
}
/*
* Tool icons:
*/
.tool-icon.tool-pen {
background-image: url(../img/tools/pen.png);
}
.tool-icon.tool-vertical-mirror-pen {
background-image: url(../img/tools/vertical-mirror-pen.png);
}
.tool-icon.tool-paint-bucket {
background-image: url(../img/tools/paint-bucket.png);
}
.tool-icon.tool-eraser {
background-image: url(../img/tools/eraser.png);
}
.tool-icon.tool-stroke {
background-image: url(../img/tools/stroke.png);
}
.tool-icon.tool-rectangle {
background-image: url(../img/tools/rectangle.png);
}
.tool-icon.tool-circle {
background-image: url(../img/tools/circle.png);
}
.tool-icon.tool-move {
background-image: url(../img/tools/hand.png);
}
.tool-icon.tool-rectangle-select {
background-image: url(../img/tools/select.png);
}
.tool-icon.tool-shape-select {
background-image: url(../img/tools/wand.png);
}
.tool-icon.tool-colorpicker {
background-image: url(../img/tools/dropper.png);
}
/*.tool-icon.tool-palette {
background-image: url(../img/tools/color-palette.png);
}*/
/*
* Tool cursors:
*/
.tool-paint-bucket .drawing-canvas-container:hover {
cursor: url(../img/tools/paint-bucket.png) 12 12, pointer;
}
.tool-vertical-mirror-pen .drawing-canvas-container:hover {
cursor: url(../img/tools/vertical-mirror-pen.png) 5 15, pointer;
}
.tool-pen .drawing-canvas-container:hover {
cursor: url(../img/tools/pen.png) 0 15, pointer;
}
.tool-eraser .drawing-canvas-container:hover {
cursor: url(../img/tools/eraser.png) 0 15, pointer;
}
.tool-stroke .drawing-canvas-container:hover {
cursor: url(../img/tools/pen.png) 0 15, pointer;
}
.tool-rectangle .drawing-canvas-container:hover {
cursor: url(../img/tools/rectangle.png) 0 15, pointer;
}
.tool-circle .drawing-canvas-container:hover {
cursor: url(../img/tools/circle.png) 2 15, pointer;
}
.tool-move .drawing-canvas-container:hover {
cursor: url(../img/tools/hand.png) 15 15, pointer;
}
.tool-rectangle-select .drawing-canvas-container:hover {
cursor: url(../img/tools/select.png) 15 15, pointer;
}
.tool-shape-select .drawing-canvas-container:hover {
cursor: url(../img/tools/wand.png) 15 15, pointer;
}
.tool-colorpicker .drawing-canvas-container:hover {
cursor: url(../img/tools/dropper.png) 0 15, pointer;
}
.tool-grid,
.tool-grid label,
.tool-grid input {
line-height: 2.5;
cursor: pointer;
}
.tool-icon.selected {
cursor: auto;
background-color: #eee;
}
.tool-icon:hover {
background-color: #eee;
}
.tool-color-picker {
padding: 5px 0 0 5px;
height: 25px;
cursor : default;
}
.tool-color-picker input {
width: 8px; height: 8px;
border: 1px solid black;
padding: 1px;
background: white;
cursor: pointer;
position : relative;
}
.secondary-color-picker {
top : 8px;
}
.tool-palette {
width: auto;
}
.tool-palette .palette li {
float: left;
}
.palette .palette-color {
cursor: pointer;
display : inline-block;
height : 20px;
width : 20px;
margin : 5px;
}
.palette .palette-color.transparent-color {
background-color: white;
height : 16px;
width : 16px;
border: 2px solid #000;
background-image: -webkit-gradient(
linear,
left top,
right bottom,
color-stop(0, #fff),
color-stop(0.45, #fff),
color-stop(0.5, #ff0000),
color-stop(0.55, #fff),
color-stop(1, #fff)
);
background-image: -moz-linear-gradient(
left top,
#fff 0%,
#fff 45%,
#f00 50%,
#fff 55%,
#fff 100%
);
}