Fixed #26: Better highlighting for keystrokes

material/base.html

@@ -53,7 +53,7 @@
       	font-style: normal;
       }
     </style>
-    <link rel="stylesheet" href="{{ base_url }}/assets/stylesheets/application-d83054620e.css">
+    <link rel="stylesheet" href="{{ base_url }}/assets/stylesheets/application-0dac3e5884.css">
     {% if config.extra.palette %}
       <link rel="stylesheet" href="{{ base_url }}/assets/stylesheets/palettes-05ab2406df.css">
     {% endif %}

material/manifest.json

@@ -2,6 +2,6 @@
   "assets/images/favicon.ico": "assets/images/favicon-e565ddfa3b.ico",
   "assets/javascripts/application.js": "assets/javascripts/application-997097ee0c.js",
   "assets/javascripts/modernizr.js": "assets/javascripts/modernizr-4ab42b99fd.js",
-  "assets/stylesheets/application.css": "assets/stylesheets/application-d83054620e.css",
+  "assets/stylesheets/application.css": "assets/stylesheets/application-0dac3e5884.css",
   "assets/stylesheets/palettes.css": "assets/stylesheets/palettes-05ab2406df.css"
 }

src/assets/stylesheets/modules/article/_appearance.scss

@@ -57,6 +57,18 @@
     background: #eee;
   }
 
+  /*
+   * Keyboard tags
+   */
+  kbd {
+    color: #555;
+    background-color: #fcfcfc;
+    border: solid 1px #ccc;
+    border-bottom-color: #bbb;
+    border-radius: 3px;
+    box-shadow: inset 0 -1px 0 #bbb;
+  }
+
   /*
    * Lower border for main headline
    */

src/assets/stylesheets/modules/article/_layout.scss

@@ -193,6 +193,15 @@
     padding: 2px 4px;
   }
 
+  /*
+   * Keyboard tags
+   */
+  kbd {
+    display: inline-block;
+    padding: 3px 5px;
+    line-height: 10px;
+  }
+
   /*
    * Add spacing at top of separator
    */

src/assets/stylesheets/modules/base/_typography.scss

@@ -46,7 +46,7 @@ body, input {
 /*
  * Proportional fonts
  */
-pre, code {
+pre, code, kbd {
   font-family: 'Courier New', 'Courier', monospace;
 
   /*