Switch to a diffrent keyboard and timepicker
these should hopefully work better on mobile browsers
This commit is contained in:
parent
b6dfba391c
commit
0eada46ece
27 changed files with 8074 additions and 3643 deletions
170
web_app/css/external/keyboard-basic.css
vendored
Normal file
170
web_app/css/external/keyboard-basic.css
vendored
Normal file
|
|
@ -0,0 +1,170 @@
|
|||
/* *** keyboard light theme ***
|
||||
for when jQuery UI themes are not being used
|
||||
See http://jsfiddle.net/Mottie/jsh0377k/
|
||||
*/
|
||||
.ui-keyboard {
|
||||
/* adjust overall keyboard size using "font-size" */
|
||||
font-size: 14px;
|
||||
text-align: center;
|
||||
/* include the following setting to place the
|
||||
keyboard at the bottom of the browser window */
|
||||
width: 100%;
|
||||
height: auto;
|
||||
left: 0px;
|
||||
top: auto;
|
||||
bottom: 0px;
|
||||
position: fixed;
|
||||
}
|
||||
.ui-keyboard {
|
||||
background: #fefefe;
|
||||
border: 1px solid #aaa;
|
||||
padding: 4px;
|
||||
}
|
||||
.ui-keyboard-button {
|
||||
border: 1px solid #aaa;
|
||||
padding: 0 0.5em;
|
||||
margin: 1px;
|
||||
min-width: 3em;
|
||||
height: 3em;
|
||||
line-height: 3em;
|
||||
vertical-align: top;
|
||||
font-family: Helvetica, Arial, sans-serif;
|
||||
color: #333;
|
||||
text-align: center;
|
||||
-webkit-border-radius: 5px;
|
||||
-moz-border-radius: 5px;
|
||||
border-radius: 5px;
|
||||
-webkit-box-shadow: 1px 1px 3px 0 rgba(0, 0, 0, 0.5);
|
||||
-moz-box-shadow: 1px 1px 3px 0 rgba(0, 0, 0, 0.5);
|
||||
box-shadow: 1px 1px 3px 0 rgba(0, 0, 0, 0.5);
|
||||
background: white;
|
||||
background-image: -moz-linear-gradient(-90deg, white 0%, #e3e3e3 100%);
|
||||
background-image: -webkit-linear-gradient(-90deg, white 0%, #e3e3e3 100%);
|
||||
background-image: -o-linear-gradient(-90deg, white 0%, #e3e3e3 100%);
|
||||
background-image: -ms-linear-gradient(-90deg, white 0%, #e3e3e3 100%);
|
||||
cursor: pointer;
|
||||
overflow: hidden;
|
||||
-moz-user-focus: ignore;
|
||||
}
|
||||
.ui-keyboard-button span {
|
||||
/* padding: 0; margin: 0; white-space:nowrap; display: inline-block; */
|
||||
display: block;
|
||||
width: 100%;
|
||||
font-size: 1.2em;
|
||||
text-align: center;
|
||||
}
|
||||
/* make action keys extra-wide */
|
||||
.ui-keyboard-actionkey:not(.ui-keyboard-dec) {
|
||||
min-width: 6em;
|
||||
}
|
||||
.ui-keyboard-space {
|
||||
width: 15em;
|
||||
}
|
||||
.ui-keyboard-actionkey:not(.ui-keyboard-dec) span {
|
||||
font-size: 0.8em;
|
||||
position: relative;
|
||||
top: -1em;
|
||||
left: -1.6em;
|
||||
}
|
||||
.ui-keyboard-placeholder {
|
||||
color: #888;
|
||||
}
|
||||
/* disabled or readonly inputs, or use input[disabled='disabled'] { color: #f00; } */
|
||||
.ui-keyboard-nokeyboard {
|
||||
color: #888;
|
||||
border-color: #888;
|
||||
}
|
||||
|
||||
/* combo key styling - toggles diacritics on/off */
|
||||
.ui-keyboard-button.ui-keyboard-combo.ui-state-default {
|
||||
border-color: #375a7f;
|
||||
}
|
||||
/* (in)valid inputs */
|
||||
button.ui-keyboard-accept.ui-keyboard-valid-input {
|
||||
background: #008966;
|
||||
border-color: #007f5e;
|
||||
color: #fff;
|
||||
}
|
||||
button.ui-keyboard-accept.ui-keyboard-valid-input:hover {
|
||||
background: #00bc8c;
|
||||
border-color: #00bc8c;
|
||||
}
|
||||
button.ui-keyboard-accept.ui-keyboard-invalid-input {
|
||||
background: #d62c1a;
|
||||
border-color: #cd2a19;;
|
||||
color: #fff;
|
||||
}
|
||||
button.ui-keyboard-accept.ui-keyboard-invalid-input:hover {
|
||||
background: #e74c3c;
|
||||
border-color: #e74c3c;
|
||||
}
|
||||
/* unlocked icon (keyboard enabled) */
|
||||
button.ui-keyboard-toggle span {
|
||||
width: .9em;
|
||||
height: .9em;
|
||||
display: inline-block;
|
||||
margin-bottom: 3px;
|
||||
background-repeat: no-repeat;
|
||||
background-position: center center;
|
||||
background-size: contain;
|
||||
/* light theme unlocked icon - fill: #111 */
|
||||
background-image: url('data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxMCIgaGVpZ2h0PSIxMCIgZmlsbD0iIzExMSI+PHBhdGggZD0iTTguNyw0LjRINy41SDUuMHYtMS45YzAtMS40LTEuMS0yLjUtMi41LTIuNWMtMS40LDAtMi41LDEuMS0yLjUsMi41djEuOWgxLjIgdi0xLjljMC0wLjcsMC42LTEuMiwxLjItMS4yczEuMiwwLjYsMS4yLDEuMnYxLjljLTAuNywwLTEuMiwwLjYtMS4yLDEuMlY4LjggYzAsMC43LDAuNiwxLjIsMS4yLDEuMmg1LjBDOS40LDEwLDEwLDkuNCwxMCw4LjhWNS42QzEwLDUuMCw5LjQsNC40LDguOCw0LjR6IE02LjYsNy40djEuMCBjMCwwLjItMC4xLDAuMy0wLjMsMC4zUzYuMCw4LjYsNi4wLDguNFY3LjRjLTAuMi0wLjEtMC4zLTAuMy0wLjMtMC41YzAtMC4zLDAuMy0wLjYsMC42LTAuNiBTNi45LDYuNiw2LjksNi45QzYuOSw3LjEsNi44LDcuMyw2LjYsNy40eiIvPjwvc3ZnPg==');
|
||||
}
|
||||
.ui-keyboard-dark-theme button.ui-keyboard-toggle span {
|
||||
/* dark theme unlocked icon - fill: #eee */
|
||||
background-image: url('data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxMCIgaGVpZ2h0PSIxMCIgZmlsbD0iI2VlZSI+PHBhdGggZD0iTTguNyw0LjRINy41SDUuMHYtMS45YzAtMS40LTEuMS0yLjUtMi41LTIuNWMtMS40LDAtMi41LDEuMS0yLjUsMi41djEuOWgxLjIgdi0xLjljMC0wLjcsMC42LTEuMiwxLjItMS4yczEuMiwwLjYsMS4yLDEuMnYxLjljLTAuNywwLTEuMiwwLjYtMS4yLDEuMlY4LjggYzAsMC43LDAuNiwxLjIsMS4yLDEuMmg1LjBDOS40LDEwLDEwLDkuNCwxMCw4LjhWNS42QzEwLDUuMCw5LjQsNC40LDguOCw0LjR6IE02LjYsNy40djEuMCBjMCwwLjItMC4xLDAuMy0wLjMsMC4zUzYuMCw4LjYsNi4wLDguNFY3LjRjLTAuMi0wLjEtMC4zLTAuMy0wLjMtMC41YzAtMC4zLDAuMy0wLjYsMC42LTAuNiBTNi45LDYuNiw2LjksNi45QzYuOSw3LjEsNi44LDcuMyw2LjYsNy40eiIvPjwvc3ZnPg==');
|
||||
}
|
||||
/* locked icon (keyboard disabled) */
|
||||
button.ui-keyboard-toggle.ui-keyboard-disabled span {
|
||||
/* light theme locked icon - fill: #111 */
|
||||
background-image: url('data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxMCIgaGVpZ2h0PSIxMCIgZmlsbD0iIzExMSI+PHBhdGggZD0iTTcuNCA0LjRWMi41YzAtMS40LTEuMS0yLjUtMi41LTIuNWMtMS40IDAtMi41IDEuMS0yLjUgMi41djEuOSBjLTAuNyAwLTEuMiAwLjUtMS4yIDEuMnYzLjFDMS4zIDkuNCAxLjggMTAgMi41IDEwaDQuOWMwLjcgMCAxLjItMC42IDEuMi0xLjJWNS42IEM4LjcgNC45IDguMSA0LjQgNy40IDQuNHogTTUuMyA3LjR2MS4wYzAgMC4yLTAuMSAwLjMtMC4zIDAuM2MtMC4yIDAtMC4zLTAuMS0wLjMtMC4zVjcuNCBjLTAuMi0wLjEtMC4zLTAuMy0wLjMtMC41YzAtMC4zIDAuMy0wLjYgMC42LTAuNmMwLjMgMCAwLjYgMC4zIDAuNiAwLjYgQzUuNiA3LjEgNS41IDcuMyA1LjMgNy40eiBNNi4yIDQuNEgzLjdWMi41YzAtMC43IDAuNS0xLjIgMS4yLTEuMmMwLjcgMCAxLjIgMC42IDEuMiAxLjIgVjQuNHoiLz48L3N2Zz4=');
|
||||
}
|
||||
.ui-keyboard-dark-theme button.ui-keyboard-toggle.ui-keyboard-disabled span {
|
||||
/* dark theme locked icon - fill: #eee */
|
||||
background-image: url('data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxMCIgaGVpZ2h0PSIxMCIgZmlsbD0iI2VlZSI+PHBhdGggZD0iTTcuNCA0LjRWMi41YzAtMS40LTEuMS0yLjUtMi41LTIuNWMtMS40IDAtMi41IDEuMS0yLjUgMi41djEuOSBjLTAuNyAwLTEuMiAwLjUtMS4yIDEuMnYzLjFDMS4zIDkuNCAxLjggMTAgMi41IDEwaDQuOWMwLjcgMCAxLjItMC42IDEuMi0xLjJWNS42IEM4LjcgNC45IDguMSA0LjQgNy40IDQuNHogTTUuMyA3LjR2MS4wYzAgMC4yLTAuMSAwLjMtMC4zIDAuM2MtMC4yIDAtMC4zLTAuMS0wLjMtMC4zVjcuNCBjLTAuMi0wLjEtMC4zLTAuMy0wLjMtMC41YzAtMC4zIDAuMy0wLjYgMC42LTAuNmMwLjMgMCAwLjYgMC4zIDAuNiAwLjYgQzUuNiA3LjEgNS41IDcuMyA1LjMgNy40eiBNNi4yIDQuNEgzLjdWMi41YzAtMC43IDAuNS0xLjIgMS4yLTEuMmMwLjcgMCAxLjIgMC42IDEuMiAxLjIgVjQuNHoiLz48L3N2Zz4=');
|
||||
}
|
||||
.ui-keyboard.ui-keyboard-disabled button:not(.ui-keyboard-toggle), .ui-keyboard.ui-keyboard-disabled input {
|
||||
opacity: 0.5;
|
||||
}
|
||||
|
||||
/*** Alt-Keys Popup extension ***/
|
||||
/* clickable overlay on top of keyboard to hide the popup */
|
||||
.ui-keyboard-overlay {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
bottom: 0;
|
||||
right: 0;
|
||||
background: rgba(0, 0, 0, 0.5);
|
||||
}
|
||||
/* the actual popup styling, class names from the css.container option are also added */
|
||||
.ui-keyboard-popup {
|
||||
display: inline-block;
|
||||
/* default buttons are 2em wide + .1em margin on either side (set in .ui-keyboard-button definition);
|
||||
so use multiples of 2.2em for a max-width if you don't want any extra white space on the sides,
|
||||
e.g. 5 buttons * 2.2em = 11em, 6 buttons * 2.2em = 13.2em, etc */
|
||||
max-width: 22em;
|
||||
/* 10 buttons */
|
||||
}
|
||||
|
||||
/*** Extender keyboard extension ***/
|
||||
div.ui-keyboard-extender {
|
||||
float: right;
|
||||
margin-left: 5px;
|
||||
margin-right: 10px;
|
||||
}
|
||||
button.ui-keyboard-extender span {
|
||||
width: .9em;
|
||||
height: .9em;
|
||||
display: inline-block;
|
||||
margin-bottom: 3px;
|
||||
background-repeat: no-repeat;
|
||||
background-position: center center;
|
||||
background-size: contain;
|
||||
/* light theme extender icon - fill: #111 */
|
||||
background-image: url('data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxNiIgaGVpZ2h0PSIxNiIgc3R5bGU9ImZpbGw6IzExMSI+PGc+PHBhdGggc3R5bGU9ImZpbGw6bm9uZTtzdHJva2U6IzExMSIgZD0iTSAwLjUsNC41IDE1LjUsNC41IDE1LjUsMTUuNSAwLjUsMTUuNSBaIj48L3BhdGg+PHJlY3Qgd2lkdGg9IjIiIGhlaWdodD0iMiIgeD0iMiIgeT0iNiI+PC9yZWN0PjxyZWN0IHdpZHRoPSIyIiBoZWlnaHQ9IjIiIHg9IjUiIHk9IjYiPjwvcmVjdD48cmVjdCB3aWR0aD0iMiIgaGVpZ2h0PSIyIiB4PSI4IiB5PSI2Ij48L3JlY3Q+PHBhdGggZD0ibSAxMSw2IDMsMCAwLDUgLTIsMCAwLC0zIC0xLDAgeiI+PC9wYXRoPjxyZWN0IHdpZHRoPSIyIiBoZWlnaHQ9IjIiIHg9IjEyIiB5PSIxMiI+PC9yZWN0PjxyZWN0IHdpZHRoPSI2IiBoZWlnaHQ9IjIiIHg9IjUiIHk9IjEyIj48L3JlY3Q+PHJlY3Qgd2lkdGg9IjIiIGhlaWdodD0iMiIgeD0iOSIgeT0iOSI+PC9yZWN0PjxyZWN0IHdpZHRoPSIyIiBoZWlnaHQ9IjIiIHg9IjYiIHk9IjkiPjwvcmVjdD48cmVjdCB3aWR0aD0iMiIgaGVpZ2h0PSIyIiB4PSIyIiB5PSIxMiI+PC9yZWN0PjxyZWN0IHdpZHRoPSIzIiBoZWlnaHQ9IjIiIHg9IjIiIHk9IjkiPjwvcmVjdD48L2c+PC9zdmc+');
|
||||
}
|
||||
.ui-keyboard-dark-theme button.ui-keyboard-extender span {
|
||||
/* dark theme extender icon - fill: #eee */
|
||||
background-image: url('data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxNiIgaGVpZ2h0PSIxNiIgc3R5bGU9ImZpbGw6I2VlZSI+PGc+PHBhdGggc3R5bGU9ImZpbGw6bm9uZTtzdHJva2U6I2VlZSIgZD0iTSAwLjUsNC41IDE1LjUsNC41IDE1LjUsMTUuNSAwLjUsMTUuNSBaIj48L3BhdGg+PHJlY3Qgd2lkdGg9IjIiIGhlaWdodD0iMiIgeD0iMiIgeT0iNiI+PC9yZWN0PjxyZWN0IHdpZHRoPSIyIiBoZWlnaHQ9IjIiIHg9IjUiIHk9IjYiPjwvcmVjdD48cmVjdCB3aWR0aD0iMiIgaGVpZ2h0PSIyIiB4PSI4IiB5PSI2Ij48L3JlY3Q+PHBhdGggZD0ibSAxMSw2IDMsMCAwLDUgLTIsMCAwLC0zIC0xLDAgeiI+PC9wYXRoPjxyZWN0IHdpZHRoPSIyIiBoZWlnaHQ9IjIiIHg9IjEyIiB5PSIxMiI+PC9yZWN0PjxyZWN0IHdpZHRoPSI2IiBoZWlnaHQ9IjIiIHg9IjUiIHk9IjEyIj48L3JlY3Q+PHJlY3Qgd2lkdGg9IjIiIGhlaWdodD0iMiIgeD0iOSIgeT0iOSI+PC9yZWN0PjxyZWN0IHdpZHRoPSIyIiBoZWlnaHQ9IjIiIHg9IjYiIHk9IjkiPjwvcmVjdD48cmVjdCB3aWR0aD0iMiIgaGVpZ2h0PSIyIiB4PSIyIiB5PSIxMiI+PC9yZWN0PjxyZWN0IHdpZHRoPSIzIiBoZWlnaHQ9IjIiIHg9IjIiIHk9IjkiPjwvcmVjdD48L2c+PC9zdmc+');
|
||||
}
|
||||
Loading…
Add table
Add a link
Reference in a new issue