Better styling for keyboard badges

Signed-off-by: Michal Čihař <michal@cihar.com>

weblate/static/loader-bootstrap.js

@@ -236,7 +236,7 @@ function processMachineTranslation(data, textStatus, jqXHR) {
             if (idx < 10) {
                 var key = getNumericKey(idx);
                 $(this).find('.mt-number').html(
-                    " <span class='badge' title='" +
+                    " <span class='badge kbd-badge' title='" +
                     interpolate(gettext('Alt+M then %s'), [key]) +
                     "'>" +
                     key +
@@ -629,13 +629,13 @@ $(function () {
                 Mousetrap.bindGlobal("alt+i " + i, function(e) {});
             }
 
-            if ($(".check").length > 0 && false) {
+            if ($(".check").length > 0) {
                 $($('.check')[0].parentNode).children(".check").each(function(idx){
                     var $this = $(this);
                     if (idx < 10) {
                         var key = getNumericKey(idx);
                         $(this).find('.check-number').html(
-                            " <span class='badge' title='" +
+                            " <span class='badge kbd-badge' title='" +
                             interpolate(gettext('Alt+I then %s'), [key]) +
                             "'>" +
                             key +

weblate/static/style-bootstrap.css

@@ -259,4 +259,12 @@ img.engage-icon {
   vertical-align: middle;
   width: 10%;
   text-align: center;
+} 
+.kbd-badge {
+	background: #eee !important;
+	color: #444 !important;
+	box-shadow: inset 0 0 1px rgb(255, 255, 255), inset 0 0 .4em rgb(200, 200, 200), 0 .1em 0 rgb(130, 130, 130), 0 .11em 0 rgba(0, 0, 0, .4), 0 .1em .11em rgba(0, 0, 0, .9);
+	-moz-border-radius: .3em;
+	-webkit-border-radius: .3em;
+	border-radius: .3em;
 }