diff --git a/css/keyboard.css b/css/keyboard.css index b24dda89..4996dcd2 100644 --- a/css/keyboard.css +++ b/css/keyboard.css @@ -22,7 +22,7 @@ /*** jQuery Mobile definitions ***/ /* jQuery Mobile styles - need wider buttons because of font size and text-overflow:ellipsis */ -.ui-bar .ui-keyboard-button { width: 3em; } +.ui-bar .ui-keyboard-button { width: 3em; display: inline-block; } .ui-bar .ui-keyboard-widekey { width: 5.5em; } .ui-bar .ui-keyboard-space { width: 15em; } .ui-bar .ui-keyboard-space span { visibility: hidden; } /* hides the ellipsis */ diff --git a/demo/demo.css b/demo/demo.css index dd6d8736..f50e9555 100644 --- a/demo/demo.css +++ b/demo/demo.css @@ -69,7 +69,7 @@ textarea, input { width: 260px; background: #333; color: #ddd; border: #777 1px #info .key { font-weight: 700; color: #59b4d4; } .underline { text-decoration: underline; } -#mobile #wrap { height: 500px; } +#mobile #wrap { height: 200px; } #mobile #switcher { max-width: 920px; width: auto; margin: 0 auto; } #mobile #switcher .swatch { width: 180px; height: 80px; display: inline-block; margin: 0; } .oldie #switcher .ui-body { float: left; clear: none !important; } @@ -82,8 +82,7 @@ textarea, input { width: 260px; background: #333; color: #ddd; border: #777 1px #mobile #switcher .ui-btn-text { position: relative; top: 2px; left: 5px; width: 10px; } #footer { height: 150px; } -#footer2 { position: fixed; bottom: 0; left: 0; width: 100%; z-index: 0; font-size: small; margin-bottom: 5px; text-align: center; } -#footer2 div { margin: 0 auto; width: 650px; } +#footer2 div { margin: 160px auto; width: 650px; text-align: center; } /* tooltip (jatt) */ #tooltip { diff --git a/mobile.html b/mobile.html index e833fc2f..9c969a5d 100644 --- a/mobile.html +++ b/mobile.html @@ -1,3 +1,4 @@ + @@ -109,13 +110,21 @@

Virtual Keyboard jQuery Mobile Themes

Until the jQurey Mobile Theme Roller is complete, use the color selections below to change the keyboard

- + +
+ + + + + +
+
- Container + Container
(background) @@ -126,7 +135,7 @@

Until the jQurey Mobile Theme Roller is complete, use the color selections b
- Regular Buttons + Regular Buttons
(non-action) @@ -137,7 +146,7 @@

Until the jQurey Mobile Theme Roller is complete, use the color selections b
- Hovered Buttons + Hovered Buttons
(all) @@ -148,7 +157,7 @@

Until the jQurey Mobile Theme Roller is complete, use the color selections b
- Action Buttons + Action Buttons
(Enter) @@ -159,7 +168,7 @@

Until the jQurey Mobile Theme Roller is complete, use the color selections b
- Active Buttons + Active Buttons
(Shift down) @@ -170,15 +179,6 @@

Until the jQurey Mobile Theme Roller is complete, use the color selections b

-
- - - - - -
- -
* Note * The "Active Buttons" setting is limited in that if the swatch letter of the Regular buttons is greater than the swatch letter of the Active Buttons, the theme doesn't apply properly. For example, Regular button swatch B with Active Button swatch A won't work because of the way the css is set up.