[epiphany] about:memory: new responsive layout, small styling tweaks

[Michael Catanzaro <mcatanzaro src gnome org>]

commit 60e34ee59c897d259cf707c9f0a65c21bef92b9b
Author: Tobias Bernard <tbernard gnome org>
Date:   Thu Jul 18 11:54:23 2019 +0200

    about:memory: new responsive layout, small styling tweaks
    
    The tables now have a smaller font size and less padding at small widths

 src/resources/about.css | 33 ++++++++++++++++++++++++---------
 1 file changed, 24 insertions(+), 9 deletions(-)
---
diff --git a/src/resources/about.css b/src/resources/about.css
index 353310810..f801774ba 100644
--- a/src/resources/about.css
+++ b/src/resources/about.css
@@ -131,19 +131,35 @@ html.epiphany-html {
   margin: 20px;
 }
 
+#memory h2 {
+  margin: 2rem 0 0;
+}
+
+.memory-table {
+    width: 100%;
+    margin: 0 0 0.9em 0;
+    font-size: 11px;
+    text-align: left;
+    border-collapse: collapse;
+}
+
 .memory-table caption {
-    font-size: 16pt;
+    margin: 1rem 0;
+    font-size: 1rem;
     font-weight: bold;
-    margin-bottom: 0.9em;
     color: #2e3436;
     text-shadow: 0 1px 0 white;
 }
 
-.memory-table {
-    margin: 0 12.5% 0.9em 12.5%;
-    width: 80%;
-    text-align: left;
-    border-collapse: collapse;
+@media (min-width: 600px) {
+    .memory-table {
+        width: 80%;
+        margin: 0 12.5% 0.9em 12.5%;
+        font-size: 1rem;
+    }
+    .memory-table caption {
+        font-size: 1.2rem;
+    }
 }
 
 .memory-table th {
@@ -155,7 +171,6 @@ html.epiphany-html {
 
 .memory-table td {
     padding: 2px;
-    background: #f6f6f8;
     border-bottom: 1px solid #d3d7cf;
     color: #2e3436;
     border-top: 1px solid transparent;
@@ -163,7 +178,7 @@ html.epiphany-html {
 }
 
 .memory-table tr:hover td {
-    background: #d3d7cf;
+    background: #deddda;
     color: #2e3436;
 }