Highlight the modifier keys when they're toggled.

diff --git a/src/main/webapp/layouts/en-us-qwerty-mobile.xml b/src/main/webapp/layouts/en-us-qwerty-mobile.xml
index bdcb371..0be8167 100644 (file)
--- a/src/main/webapp/layouts/en-us-qwerty-mobile.xml
+++ b/src/main/webapp/layouts/en-us-qwerty-mobile.xml
@@ -281,15 +281,15 @@
     <row><gap size="0.1"/></row>
 
     <row>
-        <key size="1.6">
+        <key size="1.6" class="control">
             <cap modifier="control" keysym="0xFFE3">Ctrl</cap>
         </key>
         <gap size="0.1"/>
-        <key size="1.6">
+        <key size="1.6" class="super">
             <cap modifier="super" keysym="0xFFEB">Super</cap>
         </key>
         <gap size="0.1"/>
-        <key size="1.6">
+        <key size="1.6" class="alt">
             <cap modifier="alt" keysym="0xFFE9">Alt</cap>
         </key>
         <gap size="0.1"/>
@@ -297,15 +297,15 @@
             <cap> </cap>
         </key>
         <gap size="0.1"/>
-        <key size="1.6">
+        <key size="1.6" class="alt">
             <cap modifier="alt" keysym="0xFFEA">Alt</cap>
         </key>
         <gap size="0.1"/>
         <key size="1.6">
-            <cap modifier="super" keysym="0xFF67">Menu</cap>
+            <cap keysym="0xFF67">Menu</cap>
         </key>
         <gap size="0.1"/>
-        <key size="1.6">
+        <key size="1.6" class="control">
             <cap modifier="control" keysym="0xFFE4">Ctrl</cap>
         </key>
     </row>

diff --git a/src/main/webapp/styles/keyboard.css b/src/main/webapp/styles/keyboard.css
index bf93eed..551acba 100644 (file)
--- a/src/main/webapp/styles/keyboard.css
+++ b/src/main/webapp/styles/keyboard.css
@@ -84,6 +84,24 @@
     border-color: #DD4;
 }
 
+.guac-keyboard.guac-keyboard-modifier-control .guac-keyboard-key.control,
+.guac-keyboard.guac-keyboard-modifier-numsym .guac-keyboard-key.numsym {
+    background: #882;
+    border-color: #DD4;
+}
+
+.guac-keyboard.guac-keyboard-modifier-alt .guac-keyboard-key.alt,
+.guac-keyboard.guac-keyboard-modifier-numsym .guac-keyboard-key.numsym {
+    background: #882;
+    border-color: #DD4;
+}
+
+.guac-keyboard.guac-keyboard-modifier-super .guac-keyboard-key.super,
+.guac-keyboard.guac-keyboard-modifier-numsym .guac-keyboard-key.numsym {
+    background: #882;
+    border-color: #DD4;
+}
+
 .guac-keyboard .guac-keyboard-key.guac-keyboard-pressed {
     background: #822;
     border-color: #D44;