improve table styling

2 files changed, 49 insertions, 4 deletions

diff --git a/lib/erl_docgen/priv/css/otp_doc.css b/lib/erl_docgen/priv/css/otp_doc.css
index b1d18b09d5..1ff9bcade2 100644
--- a/lib/erl_docgen/priv/css/otp_doc.css
+++ b/lib/erl_docgen/priv/css/otp_doc.css
@@ -69,7 +69,7 @@ span.code        { font-family: mono, Courier, monospace; white-space: pre; font
 
 .note, .warning, .do, .dont {
   border: 1px solid #495057;
-  margin: 1em 3em;
+  margin: 1em 0;
 }
 .note .label {
   background-color: #2b8a3e;
@@ -161,3 +161,46 @@ footer       { }
  margin: 2em 0;
  font-size: 1.5em;
 }
+
+.doc-table-wrapper{
+ width: 100%;
+}
+
+.doc-table{
+ min-width: 50%;
+ margin: 0 auto;
+}
+
+.doc-table-caption{
+ margin-top: 1em;
+ font-style: italic;
+ text-align: center;
+}
+
+table {
+ border-collapse: collapse;
+ min-width: 50%;
+ margin: 1em;
+}
+
+table, th, td {
+ border: 1px solid #666;
+}
+
+th, td {
+ padding: 0.5em;
+ text-align: left;
+}
+
+tr:hover {
+ background-color: #f5f5f5;
+}
+
+tr:nth-child(even) {
+ background-color: #f2f2f2;
+}
+
+th {
+ background-color: #777;
+ color: #fefefe;
+}
diff --git a/lib/erl_docgen/priv/xsl/db_html.xsl b/lib/erl_docgen/priv/xsl/db_html.xsl
index bdfd839cad..529d28e88f 100644
--- a/lib/erl_docgen/priv/xsl/db_html.xsl
+++ b/lib/erl_docgen/priv/xsl/db_html.xsl
@@ -1135,7 +1135,8 @@
     <xsl:variable name="tabnum">
       <xsl:number level="any" from="chapter" count="table"/>
     </xsl:variable>
-    <table border="1" cellpadding="2" cellspacing="0">
+    <div class="doc-table-wrapper">
+    <table class="doc-table">
       <!-- tbody-->
       <xsl:apply-templates select="row">
         <xsl:with-param name="chapnum" select="$chapnum"/>
@@ -1147,6 +1148,7 @@
       <xsl:with-param name="chapnum" select="$chapnum"/>
       <xsl:with-param name="tabnum" select="$tabnum"/>
     </xsl:apply-templates>
+    </div>
   </xsl:template>
 
   <xsl:template match="row">
@@ -1166,11 +1168,11 @@
     <xsl:param name="chapnum"/>
     <xsl:param name="tabnum"/>
 
-      <em>Table
+      <p class="doc-table-caption">Table
         <xsl:value-of select="$chapnum"/>.<xsl:value-of select="$tabnum"/>:
         &#160;
         <xsl:apply-templates/>
-      </em>
+      </p>
 
   </xsl:template>