Add back inlines styles for wiki pages

rowanhogan · Dec 19, 2018 · 96f2499 · 96f2499
1 parent ddba6e1
commit 96f2499
Show file tree

Hide file tree

Showing 4 changed files with 87 additions and 59 deletions.
diff --git a/src/lib/api/index.js b/src/lib/api/index.js
@@ -114,15 +114,17 @@ export const fetchPage = title =>
           title: displaytitle,
           images,
           sections,
-          content: formatHtml(text['*'])
+          content: formatHtml(text['*'], title === 'Main_page')
         })
       }
     })
   )
 
-export const formatHtml = html =>
-  html
-    .replace(/style="[^"]*"/g, '')
+export const formatHtml = (html, stripStyles) => {
+  const formatted = html
     .replace(/href="\/wiki\//g, `href="/`)
     .replace(/width="[^"]*"/g, '')
     .replace(/height="[^"]*"/g, '')
+
+  return stripStyles ? formatted.replace(/style="[^"]*"/g, '') : formatted
+}
diff --git a/src/styles/_page.scss b/src/styles/_page.scss
@@ -65,6 +65,15 @@ $sidebar-width: 20rem;
   }
 }
 
+.quotebox {
+  width: auto !important;
+  max-width: 26rem;
+  margin-left: auto !important;
+  margin-right: auto !important;
+  background: transparent !important;
+  border: 0 !important;
+}
+
 .serif-stack {
   font-family: $serif-stack;
 }
@@ -106,9 +115,12 @@ h2 {
 div.hatnote {
   padding: 0;
   line-height: 1.5em;
+  text-align: center;
 }
 
 table {
+  border: 0 !important;
+
   &.infobox {
     font-size: 90%;
     border: 0;
@@ -119,6 +131,11 @@ table {
       max-width: 100%;
     }
 
+    th,
+    td {
+      background-color: transparent !important;
+    }
+
     th[colspan='2'],
     .adr,
     .fn {

diff --git a/src/styles/_typography.scss b/src/styles/_typography.scss
@@ -94,5 +94,4 @@ table {
   margin: 1.5rem auto;
   border-spacing: 0;
   border-collapse: collapse;
-  table-layout: fixed;
 }
diff --git a/src/styles/styles.css b/src/styles/styles.css
@@ -74,8 +74,7 @@ table {
   width: 100%;
   margin: 1.5rem auto;
   border-spacing: 0;
-  border-collapse: collapse;
-  table-layout: fixed; }
+  border-collapse: collapse; }
 
 .container {
   max-width: 48rem;
@@ -565,6 +564,14 @@ table {
       text-align: justify;
       -webkit-hyphens: auto; } }
 
+.quotebox {
+  width: auto !important;
+  max-width: 26rem;
+  margin-left: auto !important;
+  margin-right: auto !important;
+  background: transparent !important;
+  border: 0 !important; }
+
 .serif-stack {
   font-family: "PT Serif", "Lora", Georgia, serif; }
 
@@ -599,59 +606,62 @@ h2 {
 
 div.hatnote {
   padding: 0;
-  line-height: 1.5em; }
-
-table.infobox {
-  font-size: 90%;
-  border: 0; }
-  table.infobox.geography, table.infobox.vcard, table.infobox.active {
-    max-width: 100%; }
-  table.infobox th[colspan='2'],
-  table.infobox .adr,
-  table.infobox .fn {
-    font-weight: bold;
-    text-align: center;
-    padding: 1rem; }
-  table.infobox td[colspan='2'] {
-    text-align: center; }
-  table.infobox th[scope='row'] {
-    text-align: right;
-    padding-right: 1.5rem; }
-  table.infobox th,
-  table.infobox td {
-    padding: 0.25rem; }
-    table.infobox th:first-child,
-    table.infobox td:first-child {
-      padding-left: 0; }
-    table.infobox th:last-child,
-    table.infobox td:last-child {
-      padding-right: 0; }
-
-table.vertical-navbox {
-  margin: 1em auto;
-  float: none;
-  border: 0;
-  background-color: transparent;
-  padding: 0; }
-  table.vertical-navbox th {
-    background-color: transparent; }
-
-table.navbox {
-  border: 0;
-  padding: 0; }
-  table.navbox th {
-    background-color: transparent; }
+  line-height: 1.5em;
+  text-align: center; }
 
-table.wikitable {
-  font-size: 90%; }
-  table.wikitable caption {
-    margin: 0 0 0.5em; }
-  table.wikitable th,
-  table.wikitable td {
-    padding: 0.25em 0.5em;
-    border: thin solid #ddd; }
-  table.wikitable img {
-    background-color: white; }
+table {
+  border: 0 !important; }
+  table.infobox {
+    font-size: 90%;
+    border: 0; }
+    table.infobox.geography, table.infobox.vcard, table.infobox.active {
+      max-width: 100%; }
+    table.infobox th,
+    table.infobox td {
+      background-color: transparent !important; }
+    table.infobox th[colspan='2'],
+    table.infobox .adr,
+    table.infobox .fn {
+      font-weight: bold;
+      text-align: center;
+      padding: 1rem; }
+    table.infobox td[colspan='2'] {
+      text-align: center; }
+    table.infobox th[scope='row'] {
+      text-align: right;
+      padding-right: 1.5rem; }
+    table.infobox th,
+    table.infobox td {
+      padding: 0.25rem; }
+      table.infobox th:first-child,
+      table.infobox td:first-child {
+        padding-left: 0; }
+      table.infobox th:last-child,
+      table.infobox td:last-child {
+        padding-right: 0; }
+  table.vertical-navbox {
+    margin: 1em auto;
+    float: none;
+    border: 0;
+    background-color: transparent;
+    padding: 0; }
+    table.vertical-navbox th {
+      background-color: transparent; }
+  table.navbox {
+    border: 0;
+    padding: 0; }
+    table.navbox th {
+      background-color: transparent; }
+  table.wikitable {
+    font-size: 90%; }
+    table.wikitable caption {
+      margin: 0 0 0.5em; }
+    table.wikitable th,
+    table.wikitable td {
+      padding: 0.25em 0.5em;
+      border: thin solid #ddd; }
+    table.wikitable img {
+      background-color: white; }
 
 table.wikitable,
 table.navbox {