diff --git a/guacamole/src/main/webapp/app/osk/styles/osk.css b/guacamole/src/main/webapp/app/osk/styles/osk.css index f61ac6f9d..53ebc2287 100644 --- a/guacamole/src/main/webapp/app/osk/styles/osk.css +++ b/guacamole/src/main/webapp/app/osk/styles/osk.css @@ -45,23 +45,36 @@ .guac-keyboard .guac-keyboard-key-container { display: inline-block; margin: 0.05em; + position: relative; } .guac-keyboard .guac-keyboard-key { - background: #444; - border: 1px outset #888; - -moz-border-radius: 0.1em; - -webkit-border-radius: 0.1em; - -khtml-border-radius: 0.1em; - border-radius: 0.1em; -} -.guac-keyboard .guac-keyboard-cap { + position: absolute; + left: 0; + right: 0; + top: 0; + bottom: 0; + + background: #444; + + border: 2px solid #666; + -moz-border-radius: 0.25em; + -webkit-border-radius: 0.25em; + -khtml-border-radius: 0.25em; + border-radius: 0.25em; + color: white; - font-size: 50%; + font-size: 40%; font-weight: lighter; text-align: center; white-space: pre; + + text-shadow: 1px 1px 0 rgba(0, 0, 0, 0.25), + 1px -1px 0 rgba(0, 0, 0, 0.25), + -1px 1px 0 rgba(0, 0, 0, 0.25), + -1px -1px 0 rgba(0, 0, 0, 0.25); + } .guac-keyboard .guac-keyboard-key:hover { @@ -73,6 +86,20 @@ border-color: #666; } +/* Align some keys to the left */ +.guac-keyboard .guac-keyboard-key-caps, +.guac-keyboard .guac-keyboard-key-enter, +.guac-keyboard .guac-keyboard-key-tab, +.guac-keyboard .guac-keyboard-key-lalt, +.guac-keyboard .guac-keyboard-key-ralt, +.guac-keyboard .guac-keyboard-key-lctrl, +.guac-keyboard .guac-keyboard-key-rctrl, +.guac-keyboard .guac-keyboard-key-lshift, +.guac-keyboard .guac-keyboard-key-rshift { + text-align: left; + padding-left: 0.75em; +} + /* Active shift */ .guac-keyboard.guac-keyboard-modifier-shift .guac-keyboard-key-rshift, .guac-keyboard.guac-keyboard-modifier-shift .guac-keyboard-key-lshift, @@ -86,11 +113,9 @@ .guac-keyboard.guac-keyboard-modifier-alt .guac-keyboard-key-lalt, /* Active caps */ -.guac-keyboard.guac-keyboard-modifier-caps .guac-keyboard-key-caps { - background: #882; - border-color: #DD4; -} +.guac-keyboard.guac-keyboard-modifier-caps .guac-keyboard-key-caps, +/* Active super */ .guac-keyboard.guac-keyboard-modifier-super .guac-keyboard-key-super, .guac-keyboard.guac-keyboard-modifier-super .guac-keyboard-key-menu { background: #882; @@ -100,7 +125,6 @@ .guac-keyboard .guac-keyboard-key.guac-keyboard-pressed { background: #822; border-color: #D44; - border-style: inset; } .guac-keyboard .guac-keyboard-group {