Improve darkmode

views/static/feed-item.js

@@ -9,21 +9,36 @@ class FeedItem extends HTMLElement {
     const template = document.createElement('template');
     template.innerHTML = `
     <style>
-    :root {
-      width: 100%;
-      overflow: scroll;
-      overflow-x: auto;
+    :host {
+      width: 100% !important;
+      overflow: scroll !important;
+      overflow-x: auto !important;
     }
     * {
-      max-width: 100%;
-      height: auto;
+      max-width: 100% !important;
+      height: auto !important;
     }
     table {
-      width: 100%;
+      width: 100% !important;
     }
     img {
-      margin: auto auto;
+      margin: auto auto !important;
     }
+    p {
+      font-family: 'Roboto', sans-serif;
+      font-size: 14px;
+      line-height: 20px;
+      letter-spacing: 0em;
+      font-weight: 500;
+    }
+    a {
+      color: #333;
+      font-weight: bold;
+    }
+    :host(.dark) a {
+      color: #ccc;
+    }
+
     </style>
     `;
 

views/static/style.css

@@ -9,7 +9,7 @@
 
 .dark .strong {
   font-weight: bold;
-  color: #eee;
+  color: #fefefe;
 }
 
 .loading {
@@ -114,3 +114,7 @@
     max-width: 100em;
   }
 }
+
+.dark {
+  background: #333;
+}