UI - Cleanup fonts better display in firefox, request CSS according to version

Dockerfile

@@ -20,11 +20,6 @@ WORKDIR /install
 
 COPY requirements.txt /requirements.txt
 
-# Instructing pip to fetch wheels from piwheels.org" on ARMv6 and ARMv7 machines
-RUN if [ "$(dpkg --print-architecture)" = "armhf" ] || [ "$(dpkg --print-architecture)" = "armel" ]; then \
-      printf "[global]\nextra-index-url=https://www.piwheels.org/simple\n" > /etc/pip.conf; \
-    fi;
-
 RUN pip install --target=/dependencies -r /requirements.txt
 
 # Playwright is an alternative to Selenium

MANIFEST.in

@@ -16,3 +16,4 @@ global-exclude venv
 
 global-exclude test-datastore
 global-exclude changedetection.io*dist-info
+global-exclude changedetectionio/tests/proxy_socks5/test-datastore

changedetectionio/__init__.py

@@ -38,7 +38,7 @@ from flask_paginate import Pagination, get_page_parameter
 from changedetectionio import html_tools
 from changedetectionio.api import api_v1
 
-__version__ = '0.45.6'
+__version__ = '0.45.7.1'
 
 from changedetectionio.store import BASE_URL_NOT_SET_TEXT
 
@@ -105,6 +105,10 @@ def get_darkmode_state():
     css_dark_mode = request.cookies.get('css_dark_mode', 'false')
     return 'true' if css_dark_mode and strtobool(css_dark_mode) else 'false'
 
+@app.template_global()
+def get_css_version():
+    return __version__
+
 # We use the whole watch object from the store/JSON so we can see if there's some related status in terms of a thread
 # running or something similar.
 @app.template_filter('format_last_checked_time')

changedetectionio/static/js/toggle-theme.js

@@ -3,50 +3,50 @@
  * Toggles theme between light and dark mode.
  */
 $(document).ready(function () {
-  const button = document.getElementById("toggle-light-mode");
+    const button = document.getElementById("toggle-light-mode");
 
-  button.onclick = () => {
-    const htmlElement = document.getElementsByTagName("html");
-    const isDarkMode = htmlElement[0].dataset.darkmode === "true";
-    htmlElement[0].dataset.darkmode = !isDarkMode;
-    setCookieValue(!isDarkMode);
-  };
+    button.onclick = () => {
+        const htmlElement = document.getElementsByTagName("html");
+        const isDarkMode = htmlElement[0].dataset.darkmode === "true";
+        htmlElement[0].dataset.darkmode = !isDarkMode;
+        setCookieValue(!isDarkMode);
+    };
 
-  const setCookieValue = (value) => {
-    document.cookie = `css_dark_mode=${value};max-age=31536000;path=/`
-  }
+    const setCookieValue = (value) => {
+        document.cookie = `css_dark_mode=${value};max-age=31536000;path=/`
+    }
 
-  // Search input box behaviour
+    // Search input box behaviour
     const toggle_search = document.getElementById("toggle-search");
-  const search_q = document.getElementById("search-q");
-  window.addEventListener('keydown', function (e) {
+    const search_q = document.getElementById("search-q");
+    if(search_q) {
+      window.addEventListener('keydown', function (e) {
+        if (e.altKey == true && e.keyCode == 83) {
+          search_q.classList.toggle('expanded');
+          search_q.focus();
+        }
+      });
 
-    if (e.altKey == true && e.keyCode == 83)
-      search_q.classList.toggle('expanded');
-      search_q.focus();
-  });
-
-
-  search_q.onkeydown = (e) => {
-    var key = e.keyCode || e.which;
-    if (key === 13) {
-      document.searchForm.submit();
+      search_q.onkeydown = (e) => {
+        var key = e.keyCode || e.which;
+        if (key === 13) {
+          document.searchForm.submit();
+        }
+      };
+      toggle_search.onclick = () => {
+        // Could be that they want to search something once text is in there
+        if (search_q.value.length) {
+          document.searchForm.submit();
+        } else {
+          // If not..
+          search_q.classList.toggle('expanded');
+          search_q.focus();
+        }
+      };
     }
-  };
-  toggle_search.onclick = () => {
-    // Could be that they want to search something once text is in there
-    if (search_q.value.length) {
-      document.searchForm.submit();
-    } else {
-      // If not..
-      search_q.classList.toggle('expanded');
-      search_q.focus();
-    }
-  };
-
-  $('#heart-us').click(function () {
-    $("#overlay").toggleClass('visible');
-    heartpath.style.fill = document.getElementById("overlay").classList.contains("visible") ? '#ff0000' : 'var(--color-background)';
-  });
 
+    $('#heart-us').click(function () {
+        $("#overlay").toggleClass('visible');
+        heartpath.style.fill = document.getElementById("overlay").classList.contains("visible") ? '#ff0000' : 'var(--color-background)';
+    });
 });

changedetectionio/static/styles/scss/parts/_love.scss

@@ -31,8 +31,8 @@
 
 #heartpath {
   &:hover {
-      fill: #ff0000 !important;
-      transition: all ease 0.3s !important;
-  }
+    fill: #ff0000 !important;
     transition: all ease 0.3s !important;
-}
+  }
+  transition: all ease 0.3s !important;
+}

changedetectionio/static/styles/scss/styles.scss

@@ -15,6 +15,7 @@
 body {
   color: var(--color-text);
   background: var(--color-background-page);
+  font-family: Helvetica Neue, Helvetica, Lucida Grande, Arial, Ubuntu, Cantarell, Fira Sans, sans-serif;
 }
 
 .visually-hidden {

changedetectionio/static/styles/styles.css

@@ -390,7 +390,8 @@ html[data-darkmode="true"] #toggle-light-mode .icon-dark {
 
 body {
   color: var(--color-text);
-  background: var(--color-background-page); }
+  background: var(--color-background-page);
+  font-family: Helvetica Neue, Helvetica, Lucida Grande, Arial, Ubuntu, Cantarell, Fira Sans, sans-serif; }
 
 .visually-hidden {
   clip: rect(0 0 0 0);

changedetectionio/templates/base.html

@@ -8,10 +8,10 @@
     <title>Change Detection{{extra_title}}</title>
     <link rel="alternate" type="application/rss+xml" title="Changedetection.io » Feed{% if active_tag %}- {{active_tag}}{% endif %}" href="{{ url_for('rss', tag=active_tag , token=app_rss_token)}}" >
     <link rel="stylesheet" href="{{url_for('static_content', group='styles', filename='pure-min.css')}}" >
-    <link rel="stylesheet" href="{{url_for('static_content', group='styles', filename='styles.css')}}" >
+    <link rel="stylesheet" href="{{url_for('static_content', group='styles', filename='styles.css')}}?v={{ get_css_version() }}" >
     {% if extra_stylesheets %}
       {% for m in extra_stylesheets %}
-        <link rel="stylesheet" href="{{ m }}?ver=1000" >
+        <link rel="stylesheet" href="{{ m }}?ver={{ get_css_version() }}" >
       {% endfor %}
     {% endif %}
 

requirements.txt

@@ -1,11 +1,12 @@
-eventlet>=0.31.0
+eventlet>=0.33.3 # related to dnspython fixes
 feedgen~=0.9
 flask-compress
-flask-login~=0.6
+# 0.6.3 included compatibility fix for werkzeug 3.x (2.x had deprecation of url handlers)
+flask-login>=0.6.3
 flask-paginate
 flask_expects_json~=1.7
 flask_restful
-flask_wtf
+flask_wtf~=1.2
 flask~=2.3
 inscriptis~=2.2
 pytz
@@ -24,11 +25,7 @@ chardet>2.3.0
 wtforms~=3.0
 jsonpath-ng~=1.5.3
 
-
-# dnspython 2.3.0 is not compatible with eventlet
-# * https://github.com/eventlet/eventlet/issues/781
-# * https://datastax-oss.atlassian.net/browse/PYTHON-1320
-dnspython<2.3.0
+dnspython~=2.4 # related to eventlet fixes
 
 # jq not available on Windows so must be installed manually
 
@@ -51,7 +48,7 @@ lxml
 
 selenium~=4.14.0
 
-werkzeug
+werkzeug~=3.0
 
 # Templating, so far just in the URLs but in the future can be for the notifications also
 jinja2~=3.1