Koha/koha-tmpl/intranet-tmpl/lib/keyboard/css/keyboard.min.css
Agustin Moyano 9e91662ac7
Bug 17178: Add virtual keyboard to advanced cataloguing editor
This patch adds Mottie keyboard (https://github.com/Mottie/Keyboard) to advanced editor.

To test:
1) Apply patches
2) perl install/data/mysql/updatedatabase.pl
3) Enable EnableAdvancedCatalogingEditor system preference
4) Go to cataloguing and to Advanced editor
5) Click on Keyboard shortcuts
SUCCESS => the keyboard shortcut "Ctrl-K" should be displayed, with "Toggle keyboard" as description
6) press Ctrl-K
SUCCESS => a virtual keyboard should be displayed, and a new toolbar button labeled "Keyboard layout" should appear.
	=> when you press a letter on both the physical and virtual keyboard, they should be added to the editor.
7) Click on "Keyboard layout"
SUCCESS => a modal should appear, where you can filter and select keyboard layouts.
	=> when you select a layout, it should be reflected on the keyboard.
	=> when you close the modal without selecting a layout, it should keep using the previous layout.
8) Sign off

Sponsored-by: Round Rock Public Library

Signed-off-by: Liz Rea <wizzyrea@gmail.com>
Signed-off-by: Josef Moravec <josef.moravec@gmail.com>
Signed-off-by: Martin Renvoize <martin.renvoize@ptfs-europe.com>
2019-06-28 15:54:33 +01:00

1 line
No EOL
8.8 KiB
CSS

.ui-keyboard{text-align:center;padding:.3em;position:absolute;left:0;top:0;z-index:16000;-ms-touch-action:manipulation;touch-action:manipulation}.ui-keyboard-has-focus{z-index:16001}.ui-keyboard div{font-size:1.1em}.ui-keyboard[contenteditable]{white-space:pre}.ui-keyboard-button{height:2em;min-width:2em;margin:.1em;cursor:pointer;overflow:hidden;line-height:2em;-moz-user-focus:ignore}.ui-keyboard-button span{padding:0;margin:0;white-space:nowrap;display:inline-block}.ui-keyboard-button-endrow{clear:left}.ui-keyboard-space{width:15em}.ui-keyboard-empty span,.ui-keyboard-space span{font:0/0 a;text-shadow:none;color:transparent}.ui-keyboard-preview-wrapper{text-align:center;position:relative;overflow:hidden}.ui-keyboard-preview{text-align:left;margin:0 0 3px 0;display:inline;width:99%}.ui-keyboard-keyset{text-align:center;white-space:nowrap}.ui-keyboard-input{text-align:left}.ui-keyboard-input-current{-moz-box-shadow:0 0 5px #4d90fe;-webkit-box-shadow:0 0 5px #4d90fe;box-shadow:0 0 5px #4d90fe}.ui-keyboard-placeholder{color:#888}.ui-keyboard-nokeyboard{color:#888;border-color:#888}.ui-keyboard-spacer{display:inline-block;width:1px;height:0;cursor:default}.ui-keyboard-LRM span,.ui-keyboard-NBSP span,.ui-keyboard-RLM span,.ui-keyboard-ZWJ span,.ui-keyboard-ZWNJ span,.ui-keyboard-ZWSP span{font-size:.5em;line-height:1.5em;white-space:normal}.ui-keyboard-button.ui-keyboard-combo.ui-state-default{border-color:#ffaf0f}button.ui-keyboard-accept.ui-keyboard-valid-input{border-color:#0c0;background:#080;color:#fff}button.ui-keyboard-accept.ui-keyboard-valid-input:not([disabled]):hover{background:#0a0}button.ui-keyboard-accept.ui-keyboard-invalid-input{border-color:#c00;background:#800;color:#fff;opacity:.5}button.ui-keyboard-accept.ui-keyboard-invalid-input:not([disabled]):hover{background:#a00}.ui-keyboard-caret{background:#c00;width:1px;margin-top:3px}div.ui-body.ui-keyboard button.ui-keyboard-button.ui-btn{padding:.5em 1em;border-color:transparent}.ui-body .ui-keyboard-button{width:3em;height:3em;display:inline-block}.ui-body .ui-keyboard-widekey{width:5.5em}.ui-body .ui-keyboard-space{width:15em}.ui-body .ui-keyboard-space span{visibility:hidden}.ui-body .ui-keyboard-keyset{line-height:.5em}.ui-body input.ui-input-text,.ui-body textarea.ui-input-text{width:95%}.ui-body .ui-btn-inner{height:2em;padding:.2em 0;margin:0}.ui-body .ui-btn{margin:0;font-size:13px}button.ui-keyboard-button.btn{padding:1px 6px}button.ui-keyboard-toggle span{width:.8em;height:.8em;display:inline-block;background-repeat:no-repeat;background-position:center center;background-size:contain}button.ui-keyboard-toggle span{background-image:url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxMCIgaGVpZ2h0PSIxMCIgZmlsbD0iIzExMSI+PHBhdGggZD0iTTguNyw0LjRINy41SDUuMHYtMS45YzAtMS40LTEuMS0yLjUtMi41LTIuNWMtMS40LDAtMi41LDEuMS0yLjUsMi41djEuOWgxLjIgdi0xLjljMC0wLjcsMC42LTEuMiwxLjItMS4yczEuMiwwLjYsMS4yLDEuMnYxLjljLTAuNywwLTEuMiwwLjYtMS4yLDEuMlY4LjggYzAsMC43LDAuNiwxLjIsMS4yLDEuMmg1LjBDOS40LDEwLDEwLDkuNCwxMCw4LjhWNS42QzEwLDUuMCw5LjQsNC40LDguOCw0LjR6IE02LjYsNy40djEuMCBjMCwwLjItMC4xLDAuMy0wLjMsMC4zUzYuMCw4LjYsNi4wLDguNFY3LjRjLTAuMi0wLjEtMC4zLTAuMy0wLjMtMC41YzAtMC4zLDAuMy0wLjYsMC42LTAuNiBTNi45LDYuNiw2LjksNi45QzYuOSw3LjEsNi44LDcuMyw2LjYsNy40eiIvPjwvc3ZnPg==)}.ui-keyboard-dark-theme button.ui-keyboard-toggle span{background-image:url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxMCIgaGVpZ2h0PSIxMCIgZmlsbD0iI2VlZSI+PHBhdGggZD0iTTguNyw0LjRINy41SDUuMHYtMS45YzAtMS40LTEuMS0yLjUtMi41LTIuNWMtMS40LDAtMi41LDEuMS0yLjUsMi41djEuOWgxLjIgdi0xLjljMC0wLjcsMC42LTEuMiwxLjItMS4yczEuMiwwLjYsMS4yLDEuMnYxLjljLTAuNywwLTEuMiwwLjYtMS4yLDEuMlY4LjggYzAsMC43LDAuNiwxLjIsMS4yLDEuMmg1LjBDOS40LDEwLDEwLDkuNCwxMCw4LjhWNS42QzEwLDUuMCw5LjQsNC40LDguOCw0LjR6IE02LjYsNy40djEuMCBjMCwwLjItMC4xLDAuMy0wLjMsMC4zUzYuMCw4LjYsNi4wLDguNFY3LjRjLTAuMi0wLjEtMC4zLTAuMy0wLjMtMC41YzAtMC4zLDAuMy0wLjYsMC42LTAuNiBTNi45LDYuNiw2LjksNi45QzYuOSw3LjEsNi44LDcuMyw2LjYsNy40eiIvPjwvc3ZnPg==)}button.ui-keyboard-toggle.ui-keyboard-disabled span{background-image:url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxMCIgaGVpZ2h0PSIxMCIgZmlsbD0iIzExMSI+PHBhdGggZD0iTTcuNCA0LjRWMi41YzAtMS40LTEuMS0yLjUtMi41LTIuNWMtMS40IDAtMi41IDEuMS0yLjUgMi41djEuOSBjLTAuNyAwLTEuMiAwLjUtMS4yIDEuMnYzLjFDMS4zIDkuNCAxLjggMTAgMi41IDEwaDQuOWMwLjcgMCAxLjItMC42IDEuMi0xLjJWNS42IEM4LjcgNC45IDguMSA0LjQgNy40IDQuNHogTTUuMyA3LjR2MS4wYzAgMC4yLTAuMSAwLjMtMC4zIDAuM2MtMC4yIDAtMC4zLTAuMS0wLjMtMC4zVjcuNCBjLTAuMi0wLjEtMC4zLTAuMy0wLjMtMC41YzAtMC4zIDAuMy0wLjYgMC42LTAuNmMwLjMgMCAwLjYgMC4zIDAuNiAwLjYgQzUuNiA3LjEgNS41IDcuMyA1LjMgNy40eiBNNi4yIDQuNEgzLjdWMi41YzAtMC43IDAuNS0xLjIgMS4yLTEuMmMwLjcgMCAxLjIgMC42IDEuMiAxLjIgVjQuNHoiLz48L3N2Zz4=)}.ui-keyboard-dark-theme button.ui-keyboard-toggle.ui-keyboard-disabled span{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:.5}.ui-keyboard-overlay{position:absolute;top:0;left:0;bottom:0;right:0;background:rgba(0,0,0,.5)}.ui-keyboard-popup{display:inline-block;max-width:22em}.ui-keyboard.ui-keyboard-popup-open .ui-keyboard-keyset .ui-keyboard-button{pointer-events:none}div.ui-keyboard-extender{margin-left:5px}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;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{background-image:url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxNiIgaGVpZ2h0PSIxNiIgc3R5bGU9ImZpbGw6I2VlZSI+PGc+PHBhdGggc3R5bGU9ImZpbGw6bm9uZTtzdHJva2U6I2VlZSIgZD0iTSAwLjUsNC41IDE1LjUsNC41IDE1LjUsMTUuNSAwLjUsMTUuNSBaIj48L3BhdGg+PHJlY3Qgd2lkdGg9IjIiIGhlaWdodD0iMiIgeD0iMiIgeT0iNiI+PC9yZWN0PjxyZWN0IHdpZHRoPSIyIiBoZWlnaHQ9IjIiIHg9IjUiIHk9IjYiPjwvcmVjdD48cmVjdCB3aWR0aD0iMiIgaGVpZ2h0PSIyIiB4PSI4IiB5PSI2Ij48L3JlY3Q+PHBhdGggZD0ibSAxMSw2IDMsMCAwLDUgLTIsMCAwLC0zIC0xLDAgeiI+PC9wYXRoPjxyZWN0IHdpZHRoPSIyIiBoZWlnaHQ9IjIiIHg9IjEyIiB5PSIxMiI+PC9yZWN0PjxyZWN0IHdpZHRoPSI2IiBoZWlnaHQ9IjIiIHg9IjUiIHk9IjEyIj48L3JlY3Q+PHJlY3Qgd2lkdGg9IjIiIGhlaWdodD0iMiIgeD0iOSIgeT0iOSI+PC9yZWN0PjxyZWN0IHdpZHRoPSIyIiBoZWlnaHQ9IjIiIHg9IjYiIHk9IjkiPjwvcmVjdD48cmVjdCB3aWR0aD0iMiIgaGVpZ2h0PSIyIiB4PSIyIiB5PSIxMiI+PC9yZWN0PjxyZWN0IHdpZHRoPSIzIiBoZWlnaHQ9IjIiIHg9IjIiIHk9IjkiPjwvcmVjdD48L2c+PC9zdmc+)}@media all and (max-width:319px){.ui-keyboard div{font-size:9px}.ui-keyboard .ui-keyboard-input{font-size:12px}.ui-body .ui-btn{margin:0;font-size:9px}.ui-body .ui-keyboard-button{width:1.8em;height:2.5em}.ui-body .ui-keyboard-widekey{width:4em}.ui-body .ui-keyboard-space{width:8em}.ui-body .ui-btn-inner{height:2.5em;padding:.3em 0}}@media all and (min-width:320px) and (max-width:479px){.ui-keyboard div{font-size:9px}.ui-keyboard .ui-keyboard-input{font-size:14px}.ui-body .ui-btn{margin:0;font-size:11px}.ui-body .ui-keyboard-button{width:1.8em;height:3em}.ui-body .ui-keyboard-widekey{width:4.5em}.ui-body .ui-keyboard-space{width:10em}.ui-body .ui-btn-inner{height:3em;padding:.7em 0}}@media all and (min-width:480px) and (max-width:767px){.ui-keyboard div{font-size:13px}.ui-keyboard .ui-keyboard-input{font-size:14px}.ui-body .ui-btn{margin:0;font-size:10px}.ui-body .ui-keyboard-button{height:2.5em}.ui-body .ui-btn-inner{height:2.5em;padding:.5em 0}}