169 lines
No EOL
2.7 KiB
CSS
169 lines
No EOL
2.7 KiB
CSS
html, body {
|
||
height : 100%;
|
||
margin : 0;
|
||
cursor : default;
|
||
-webkit-touch-callout: none;
|
||
-webkit-user-select: none;
|
||
-khtml-user-select: none;
|
||
-moz-user-select: none;
|
||
-ms-user-select: none;
|
||
user-select: none;
|
||
}
|
||
|
||
ul, li {
|
||
margin : 0;
|
||
padding : 0;
|
||
}
|
||
|
||
.debug {
|
||
border : 1px Solid black;
|
||
}
|
||
|
||
.left-nav {
|
||
position:absolute;
|
||
top : 0;
|
||
bottom : 0;
|
||
width : 200px;
|
||
overflow-y: scroll;
|
||
background : #000;
|
||
padding : 10px;
|
||
}
|
||
|
||
.main-panel {
|
||
position:absolute;
|
||
top : 0;
|
||
bottom : 0;
|
||
left : 220px;
|
||
right : 0;
|
||
background : #ccc;
|
||
}
|
||
|
||
.preview-container {
|
||
position : absolute;
|
||
top : 30px;
|
||
right : 0;
|
||
height : 256px;
|
||
width : 256px;
|
||
background : white;
|
||
border : 0px Solid black;
|
||
border-radius:5px 0px 0px 5px;
|
||
box-shadow : 0px 0px 2px rgba(0,0,0,0.2);
|
||
}
|
||
|
||
.preview-container canvas {
|
||
border : 0px Solid transparent;
|
||
border-radius:5px 0px 0px 5px;
|
||
}
|
||
|
||
#cursorInfo {
|
||
position : fixed;
|
||
cursor : default;
|
||
-webkit-touch-callout: none;
|
||
-webkit-user-select: none;
|
||
-khtml-user-select: none;
|
||
-moz-user-select: none;
|
||
-ms-user-select: none;
|
||
user-select: none;
|
||
}
|
||
|
||
.action-button {
|
||
background-color : white;
|
||
width : 150px;
|
||
display : inline-block;
|
||
}
|
||
|
||
#preview-list {
|
||
list-style-type: none;
|
||
}
|
||
|
||
.preview-tile {
|
||
padding : 10px;
|
||
overflow: hidden;
|
||
background-color: gray;
|
||
}
|
||
|
||
.preview-tile .canvas-container {
|
||
float: left;
|
||
}
|
||
|
||
.preview-tile .tile-view {
|
||
float: left;
|
||
border: blue 1px solid;
|
||
}
|
||
|
||
.preview-tile .tile-action {
|
||
display: none;
|
||
float: right;
|
||
}
|
||
|
||
.preview-tile:hover .tile-action {
|
||
display: block;
|
||
}
|
||
|
||
.preview-tile:hover {
|
||
background-color: lightgray;
|
||
}
|
||
|
||
#preview-list .preview-tile.selected {
|
||
background-color: lightyellow;
|
||
}
|
||
|
||
.canvas-container {
|
||
position: relative;
|
||
display: block;
|
||
}
|
||
|
||
.canvas-container .canvas-background {
|
||
background: url(../img/transparent_background.png) repeat;
|
||
position: absolute;
|
||
top: 0;
|
||
right: 0;
|
||
bottom: 0;
|
||
left: 0;
|
||
}
|
||
|
||
.canvas {
|
||
position: relative;
|
||
z-index: 1;
|
||
}
|
||
|
||
#palette li {
|
||
display : inline-block;
|
||
height : 20px;
|
||
width : 20px;
|
||
margin : 5px;
|
||
}
|
||
|
||
#preview-fps {
|
||
width : 200px;
|
||
}
|
||
|
||
/* User messages */
|
||
.user-message {
|
||
position: fixed;
|
||
bottom: 0;
|
||
left: 40%;
|
||
background-color: #F9EDBE;
|
||
padding: 7px 22px;
|
||
border-top-left-radius: 7px;
|
||
border-top-right-radius: 7px;
|
||
font-family: ‘Arial Black’, Gadget, sans-serif;
|
||
color: #222;
|
||
border: #F0C36D 1px solid;
|
||
border-bottom: 0;
|
||
font-weight: bold;
|
||
font-size: 14px;
|
||
z-index: 10000;
|
||
}
|
||
|
||
/* Force apparition of scrollbars on leopard */
|
||
::-webkit-scrollbar {
|
||
-webkit-appearance: none;
|
||
width: 7px;
|
||
}
|
||
|
||
::-webkit-scrollbar-thumb {
|
||
border-radius: 4px;
|
||
background-color: rgba(180,180,180,.7);
|
||
-webkit-box-shadow: 0 0 1px rgba(255,255,255,.5);
|
||
} |