static/css/jsKeyboard.css

   1
   2 body {margin:0px 0px; padding:0px; /* Need to set body margin and padding to get consistency between browsers. */
   3      /* text-align:center; /* Hack for IE5/Win */
   4 font-size:14px; font-family:Arial Unicode MS;font-weight:normal;
   5 /*overflow:hidden;*/
   6 }
   7
   8 #virtualKeyboard {
   9     width: 100%;
  10     text-align: center;
  11     /*background-color:#7b8490;*/
  12     /*border-top:3px solid #000;*/
  13 }
  14
  15 #keyboard{
  16     padding:10px;
  17     width:837px;
  18     margin: 0 auto;
  19     height:288;
  20     display:block;
  21     padding-left:25px;
  22     display:block;
  23 /*    position:absolute;*/
  24     bottom:0px; left:0px;
  25  }
  26 #keyboard:after {content: ".";display: block;height: 0;clear: both;visibility: hidden;}
  27
  28 #keyboardHeader {position:relative;}
  29 #keyboardHeader div {color:#fff; background-color:#7b8490;padding:3px; padding-left:15px; padding-right:15px; position:absolute; cursor:pointer; right:-10px; top:-40px;}
  30 .closex {font-weight:bolder; color:#000;}
  31
  32 #keyboardCapitalLetter {display:none;}
  33 #keyboardSmallLetter {display:block;}
  34 #keyboardNumber {display:none;}
  35 #keyboardSymbols {display:none;}
  36
  37 .button
  38 {
  39     width:60px; height:60px;
  40     background-color:#fff;
  41     position:relative;
  42     float:left;
  43     margin-right:9px;
  44     margin-top:10px;
  45     cursor:pointer;
  46     font-size:1.9em;
  47
  48     /*box shadow*/
  49     -webkit-box-shadow: 0px 1px 3px #000000;-moz-box-shadow: 0px 1px 3px #000000;box-shadow: 0px 1px 3px #000000;
  50     /*box radius*/
  51     -moz-border-radius: 5px;border-radius: 5px;
  52     /*gradient*/
  53     background: #ffffff; /* old browsers */
  54     background: -moz-linear-gradient(top, #ffffff 0%, #e5e5e5 100%); /* firefox */
  55     background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#ffffff), color-stop(100%,#e5e5e5)); /* webkit */
  56     filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#e5e5e5',GradientType=0 ); /* ie */
  57 }
  58 .buttonDown {background:none;background-color: #c9cdd5; -webkit-box-shadow:none;-moz-box-shadow: none;box-shadow: none;}
  59 .button_a {margin-left:26px;}
  60 .button_dash {margin-left:26px;}
  61 .button_underscore {margin-left:26px;}
  62 .button_enter {width:103px; font-size:1.3em; }
  63 .button_del{width:103px; font-size:1.3em;}
  64 .button_smallletter{font-size:1.3em;}
  65 .button_capitalletterleft{font-size:1.3em;}
  66 .button_capitalletterright{ width:129px; font-size:1.3em;}
  67 .button_numberleft{width:172px; font-size:1.3em; margin-left:26px;}
  68 .button_numberright{width:129px; font-size:1.3em;}
  69 .button_space {width:376px;}
  70 .button_symbolsleft{width:172px; font-size:1.3em; margin-left:26px;}
  71 .button_symbolsright{width:129px; font-size:1.3em;}
  72
  73
  74 .key {width:100%; height:100%; text-align:center; padding-top:12px; text-shadow: 0px 1px 1px #ffffff;filter: dropshadow(color=#ffffff, offx=0, offy=1);}
  75 .key_del {padding-top:18px;}
  76 .key_enter {padding-top:18px;}
  77 .key_smallletter {padding-top:18px;}
  78 .key_capitalletterleft {padding-top:18px;}
  79 .key_capitalletterright {padding-top:18px;}
  80 .key_number {padding-top:18px;}
  81 .key_symbols {padding-top:18px;}
  82
  83 .button:hover {
  84 border-color: rgba(82, 168, 236, 0.8);
  85 outline: 0;
  86 outline: thin dotted 9;
  87 -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075),0 0 8px rgba(82, 168, 236, 0.6);
  88 -moz-box-shadow: inset 0 1px 1px rgba(0,0,0,0.075),0 0 8px rgba(82,168,236,0.6);
  89 box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075),0 0 8px rgba(82, 168, 236, 0.6);
  90 }