83 lines
2.0 KiB
CSS
83 lines
2.0 KiB
CSS
|
.key {
|
||
|
|
-moz-box-shadow:inset -8px -10px 0px -3px #ffffff;
|
||
|
|
-webkit-box-shadow:inset -8px -10px 0px -3px #ffffff;
|
||
|
|
box-shadow:inset -8px -10px 0px -3px #ffffff;
|
||
|
|
background-color:#ededed;
|
||
|
|
-moz-border-radius:6px;
|
||
|
|
-webkit-border-radius:6px;
|
||
|
|
border-radius:6px;
|
||
|
|
border:2px solid #dcdcdc;
|
||
|
|
display:block;
|
||
|
|
float: left;
|
||
|
|
color:#777777;
|
||
|
|
font-family:arial;
|
||
|
|
font-size:16px;
|
||
|
|
font-weight:bold;
|
||
|
|
text-decoration:none;
|
||
|
|
padding:4px 16px 16px 4px;
|
||
|
|
width: 24px;
|
||
|
|
height: 24px;
|
||
|
|
overflow: hidden;
|
||
|
|
margin: 1px;
|
||
|
|
}
|
||
|
|
.key:hover {
|
||
|
|
background-color:#dfdfdf;
|
||
|
|
}
|
||
|
|
.key:active {
|
||
|
|
position:relative;
|
||
|
|
top:1px;
|
||
|
|
}
|
||
|
|
.key-editing {
|
||
|
|
background-color:#b4b4b4;
|
||
|
|
position:relative;
|
||
|
|
top:2px;
|
||
|
|
}
|
||
|
|
/* This imageless css button was generated by CSSButtonGenerator.com */
|
||
|
|
|
||
|
|
/* Key size and pixel
|
||
|
|
* key: 1.00 1.25 1.50 1.75 2.00
|
||
|
|
* size: 50 62.5 75 87.5 100
|
||
|
|
* width: 24 36.5 49 61.5 74
|
||
|
|
*
|
||
|
|
* margin:1 + border:2 + padding:4 + width:24 + padding:16 + border:2 + margin:1 = 50px
|
||
|
|
* width:24 + 26px = 50px
|
||
|
|
*/
|
||
|
|
.btn100 { width:24px; }
|
||
|
|
.btn125 { width:36.5px; }
|
||
|
|
.btn150 { width:49px; }
|
||
|
|
.btn175 { width:61.5px; }
|
||
|
|
.btn200 { width:74px; }
|
||
|
|
.btn225 { width:86.5px; }
|
||
|
|
.btn250 { width:99px; }
|
||
|
|
.btn275 { width:111.5px; }
|
||
|
|
.btn600 { width:274px; }
|
||
|
|
.btn625 { width:286.5px; }
|
||
|
|
.btn700 { width:324px; }
|
||
|
|
|
||
|
|
.spc100 { width:24px; visibility:hidden; }
|
||
|
|
.spc125 { width:36.5px; visibility:hidden; }
|
||
|
|
.spc150 { width:49px; visibility:hidden; }
|
||
|
|
.spc175 { width:61.5px; visibility:hidden; }
|
||
|
|
.spc200 { width 74px; visibility:hidden; }
|
||
|
|
|
||
|
|
.clear {
|
||
|
|
clear: left;
|
||
|
|
}
|
||
|
|
|
||
|
|
.keyboard {
|
||
|
|
width: 1000px;
|
||
|
|
overflow: auto;
|
||
|
|
}
|
||
|
|
|
||
|
|
#keycodes {
|
||
|
|
font-size:12px;
|
||
|
|
font-weight:bold;
|
||
|
|
width: 200px;
|
||
|
|
}
|
||
|
|
|
||
|
|
/* http://www.w3schools.com/cssref/css3_pr_resize.asp */
|
||
|
|
.resizable {
|
||
|
|
resize: both;
|
||
|
|
overflow: auto;
|
||
|
|
}
|