Pull tbm tab class from new enum

Created a G class enum to reference class names returned in search
results. As noted in the class doc, this should only be used/updated as
a last resort, as class names change frequently. For some instances,
such as replacing the tbm tab, it's a lot easier to just replace by
header name than attempting to replace it based on how the element is
structured.

Also updated a few styles to revert the latest styling changes being
applied by Google.

app/__init__.py

@@ -50,9 +50,11 @@ app.config['TRANSLATIONS'] = json.load(open(
     os.path.join(app.config['STATIC_FOLDER'], 'settings/translations.json'),
     encoding='utf-8'))
 app.config['THEMES'] = json.load(open(
-    os.path.join(app.config['STATIC_FOLDER'], 'settings/themes.json')))
+    os.path.join(app.config['STATIC_FOLDER'], 'settings/themes.json'),
+    encoding='utf-8'))
 app.config['HEADER_TABS'] = json.load(open(
-    os.path.join(app.config['STATIC_FOLDER'], 'settings/header_tabs.json')))
+    os.path.join(app.config['STATIC_FOLDER'], 'settings/header_tabs.json'),
+    encoding='utf-8'))
 app.config['CONFIG_PATH'] = os.getenv(
     'CONFIG_VOLUME',
     os.path.join(app.config['STATIC_FOLDER'], 'config'))

app/filter.py

@@ -1,5 +1,6 @@
 from app.models.config import Config
 from app.models.endpoint import Endpoint
+from app.models.g_classes import GClasses
 from app.request import VALID_PARAMS, MAPS_URL
 from app.utils.misc import read_config_bool
 from app.utils.results import *
@@ -16,6 +17,7 @@ minimal_mode_sections = ['Top stories', 'Images', 'People also ask']
 unsupported_g_pages = [
     'support.google.com',
     'accounts.google.com',
+    'policies.google.com',
     'google.com/preferences',
     'google.com/intl',
     'advanced_search',
@@ -154,12 +156,17 @@ class Filter:
 
     def remove_block_tabs(self, soup) -> None:
         if self.main_divs:
-            for div in self.main_divs.find_all('div',
-                                               attrs={'class': "KP7LCb"}):
+            for div in self.main_divs.find_all(
+                'div',
+                attrs={'class': f'{GClasses.main_tbm_tab}'}
+            ):
                 _ = div.decompose()
         else:
             # when in images tab
-            for div in soup.find_all('div', attrs={'class': "n692Zd"}):
+            for div in soup.find_all(
+                'div',
+                attrs={'class': f'{GClasses.images_tbm_tab}'}
+            ):
                 _ = div.decompose()
 
     def collapse_sections(self) -> None:
@@ -294,7 +301,7 @@ class Filter:
 
         # Fix body max width on images tab
         style = soup.find('style')
-        div = soup.find('div', attrs={'class': "n692Zd"})
+        div = soup.find('div', attrs={'class': f'{GClasses.images_tbm_tab}'})
         if style and div and not self.mobile:
             css = style.string
             css_html_tag = (

app/models/g_classes.py

@@ -0,0 +1,16 @@
+from enum import Enum
+
+
+class GClasses(Enum):
+    """A class for tracking obfuscated class names used in Google results that
+    are directly referenced in Whoogle's filtering code.
+
+    Note: Using these should be a last resort. It is always preferred to filter
+    results using structural cues instead of referencing class names, as these
+    are liable to change at any moment.
+    """
+    main_tbm_tab = 'KP7LCb'
+    images_tbm_tab = 'n692Zd'
+
+    def __str__(self):
+        return self.value

app/static/css/dark-theme.css

@@ -74,6 +74,7 @@ select {
 
 .ZINbbc.luh4tb {
     background: var(--whoogle-dark-result-bg) !important;
+    margin-bottom: 24px !important;
 }
 
 .bRsWnc {

app/static/css/header.css

@@ -121,7 +121,7 @@ a {
 .header-tab-div {
     border-radius: 0 0 8px 8px;
     box-shadow: 0 2px 3px rgba(32, 33, 36, 0.18);
-    margin-bottom: 10px;
+    margin-bottom: 20px;
     overflow: hidden;
 }
 
@@ -214,3 +214,10 @@ a.header-tab-a:visited {
     -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
     overflow: hidden;
 }
+
+@media (max-width: 801px) {
+    .header-tab-div {
+        margin-bottom: 10px !important
+    }
+}
+

app/static/css/light-theme.css

@@ -43,6 +43,8 @@ select {
 
 .ZINbbc.luh4tb {
     background: var(--whoogle-result-bg) !important;
+    box-shadow: 0 1px 6px rgba(32,33,36,0.28) !important;
+    margin-bottom: 24px !important;
 }
 
 .bRsWnc {

app/static/css/search.css

@@ -31,8 +31,9 @@ body {
 }
 
 details summary {
-    padding: 10px;
+    margin-bottom: 20px;
     font-weight: bold;
+    padding-left: 10px;
 }
 
 details summary span {
@@ -62,3 +63,9 @@ details summary span {
         min-width: 736px !important;
     }
 }
+
+@media (max-width: 801px) {
+    details summary {
+        margin-bottom: 10px !important
+    }
+}