adds theme support for reskinning cards

the theme.css file can include a .reskin selector
the filter.py file will parse the css file and replace the card color accordingly

app/filter.py

@@ -5,7 +5,7 @@ from cryptography.fernet import Fernet
 import re
 import urllib.parse as urlparse
 from urllib.parse import parse_qs
-
+import cssutils
 
 class Filter:
     def __init__(self, user_keys: dict, mobile=False, config=None):
@@ -30,13 +30,36 @@ class Filter:
     def elements(self):
         return self._elements
 
+    def parse_theme_colors(self):
+        """parses the css theme and looks for reskinning colors. Specifically looks for the .reskin CSS selector.
+        If no selector is found, returns default background 'fff'
+
+        Returns:
+            dict: Key-value dictionary of the properties 
+        """
+        result = {'background-color':'fff'}
+        if self.theme:
+            if self.dark:
+                sheet = cssutils.parseString(open(f'app/static/css/themes/{self.theme}-dark.css').read())
+            else:
+                sheet = cssutils.parseString(open(f'app/static/css/themes/{self.theme}-light.css').read())
+            reskin_selector = [i for i in sheet if i.selectorText=='.reskin']
+            if len(reskin_selector) == 0:
+                return result
+            for css_prop in reskin_selector[0].style:
+                result[css_prop.name] = css_prop.value
+            return result
+        
     def reskin(self, page):
         # Aesthetic only re-skinning
         page = page.replace('>G<', '>Wh<')
         pattern = re.compile('4285f4|ea4335|fbcc05|34a853|fbbc05', re.IGNORECASE)
         page = pattern.sub('685e79', page)
+
+        theme_colors = self.parse_theme_colors()
+        page = page.replace('fff', theme_colors['background-color'].replace("#",""))
         if self.dark:
-            page = page.replace('fff', '2E3440').replace('202124', 'ddd').replace('1967D2', '3b85ea')
+            page = page.replace('202124', 'ddd').replace('1967D2', '3b85ea')
 
         return page
 

app/static/css/themes/nord-dark.css

@@ -40,3 +40,13 @@ input {
 .search-container {
     background-color: #292E39 !important;
 }
+
+footer {
+    background-color: #292E39 !important;
+    color: #ECEFF4;
+}
+
+.reskin {
+    background-color: #2E3440;
+    color: #ECEFF4;
+}

app/static/css/themes/nord-light.css

@@ -40,3 +40,13 @@ input {
 .search-container {
     background-color: #f9fafb !important;
 }
+
+footer {
+    background-color: #f9fafb !important;
+    color: #3B4252;
+}
+
+.reskin {
+    background-color: #ffffff;
+    color: #3B4252;
+}

app/static/css/themes/whoogle-dark.css

@@ -40,3 +40,8 @@ input {
 .search-container {
     background-color: #000 !important;
 }
+
+.reskin {
+    background-color: #000;
+    color: #fff;
+}

app/templates/display.html

@@ -25,7 +25,7 @@
     {{ response|safe }}
 </body>
 <footer>
-    <p style=" color: {{ '#ECEFF4' if dark_mode else '#000' }};">
+    <p>
         Whoogle Search v{{ version_number }} ||
         <a style="color: #685e79" href="https://github.com/benbusby/whoogle-search">View on GitHub</a>
     </p>

app/templates/index.html

@@ -147,7 +147,7 @@
         </div>
     </div>
     <footer>
-        <p style="color: {{ '#ECEFF4' if config.dark else '#000' }};">
+        <p>
             Whoogle Search v{{ version_number }} ||
             <a style="color: #685e79" href="https://github.com/benbusby/whoogle-search">View on GitHub</a>
         </p>

requirements.txt

@@ -18,3 +18,4 @@ six==1.14.0
 soupsieve==1.9.5
 Werkzeug==0.16.0
 waitress==1.4.3
+cssutils==1.0.2