[yelp-xsl] Better styling for key element, use HTML kdb element

[Shaun McCance <shaunm src gnome org>]

commit e4e160b2e4ab311e9c7a0a186adeb1b39da2de49
Author: Shaun McCance <shaunm gnome org>
Date:   Tue Nov 1 11:53:39 2011 -0400

    Better styling for key element, use HTML kdb element
    
    https://bugzilla.gnome.org/show_bug.cgi?id=651250

 xslt/common/html.xsl                  |   25 ++++++++++++++++++++++---
 xslt/mallard/html/mal2html-inline.xsl |   12 ++++++++++++
 2 files changed, 34 insertions(+), 3 deletions(-)
---
diff --git a/xslt/common/html.xsl b/xslt/common/html.xsl
index c43f4cc..971e955 100644
--- a/xslt/common/html.xsl
+++ b/xslt/common/html.xsl
@@ -1048,14 +1048,33 @@ pre span.input {
   font-weight: bold;
   color: </xsl:text><xsl:value-of select="$color.text_light"/><xsl:text>;
 }
-span.key {
+kbd {
+  font-family: inherit;
+  font-size: inherit;
   color: </xsl:text>
     <xsl:value-of select="$color.text_light"/><xsl:text>;
+  background-color: </xsl:text>
+    <xsl:value-of select="$color.gray_background"/><xsl:text>;
   border: solid 1px </xsl:text>
-    <xsl:value-of select="$color.yellow_border"/><xsl:text>;
-  padding: 0 0.2em 0 0.2em;
+    <xsl:value-of select="$color.gray_border"/><xsl:text>;
+  -moz-border-radius: 2px;
+  -webkit-border-radius: 2px;
+  border-radius: 2px;
+  -moz-box-shadow: 1px 1px 2px </xsl:text>
+    <xsl:value-of select="$color.gray_border"/><xsl:text>;
+  -webkit-box-shadow: 1px 1px 2px </xsl:text>
+    <xsl:value-of select="$color.gray_border"/><xsl:text>;
+  box-shadow: 1px 1px 2px </xsl:text>
+    <xsl:value-of select="$color.gray_border"/><xsl:text>;
+  margin: 0 0.2em 0 0.2em;
+  padding: 0 0.5em 0 0.5em;
   white-space: nowrap
 }
+kbd.key-Fn {
+  font-weight: bold;
+  color: </xsl:text>
+    <xsl:value-of select="$color.blue_border"/><xsl:text>;
+}
 span.keyseq {
   color: </xsl:text>
     <xsl:value-of select="$color.text_light"/><xsl:text>;
diff --git a/xslt/mallard/html/mal2html-inline.xsl b/xslt/mallard/html/mal2html-inline.xsl
index 7150a45..b63223c 100644
--- a/xslt/mallard/html/mal2html-inline.xsl
+++ b/xslt/mallard/html/mal2html-inline.xsl
@@ -208,6 +208,18 @@ an #{xref} or #{href} attribute.
   <xsl:call-template name="mal2html.span"/>
 </xsl:template>
 
+<!-- = keyseq % mal2html.inline.content.mode = -->
+<xsl:template mode="mal2html.inline.content.mode" match="mal:key">
+  <kbd>
+    <xsl:if test=". = 'Fn'">
+      <xsl:attribute name="class">
+        <xsl:text>key-Fn</xsl:text>
+      </xsl:attribute>
+    </xsl:if>
+    <xsl:apply-templates mode="mal2html.inline.mode"/>
+  </kbd>
+</xsl:template>
+
 <!-- = keyseq = -->
 <xsl:template mode="mal2html.inline.mode" match="mal:keyseq">
   <xsl:call-template name="mal2html.span"/>