From 99246d3e6d0c5ae5e863071dc5c01c99fc46efee Mon Sep 17 00:00:00 2001 From: dgtlmoon Date: Thu, 9 Nov 2023 19:13:18 +0100 Subject: [PATCH 01/14] Visual Selector - Small fix, Improving elements fetcher reliability (#1947) --- changedetectionio/__init__.py | 3 +-- changedetectionio/tests/visualselector/test_fetch_data.py | 7 +++++++ 2 files changed, 8 insertions(+), 2 deletions(-) diff --git a/changedetectionio/__init__.py b/changedetectionio/__init__.py index 54c02804..3a2197bf 100644 --- a/changedetectionio/__init__.py +++ b/changedetectionio/__init__.py @@ -1208,8 +1208,7 @@ def changedetection_app(config=None, datastore_o=None): # These files should be in our subdirectory try: # set nocache, set content-type - watch_dir = datastore_o.datastore_path + "/" + filename - response = make_response(send_from_directory(filename="elements.json", directory=watch_dir, path=watch_dir + "/elements.json")) + response = make_response(send_from_directory(os.path.join(datastore_o.datastore_path, filename), "elements.json")) response.headers['Content-type'] = 'application/json' response.headers['Cache-Control'] = 'no-cache, no-store, must-revalidate' response.headers['Pragma'] = 'no-cache' diff --git a/changedetectionio/tests/visualselector/test_fetch_data.py b/changedetectionio/tests/visualselector/test_fetch_data.py index 67379f90..c115ae2a 100644 --- a/changedetectionio/tests/visualselector/test_fetch_data.py +++ b/changedetectionio/tests/visualselector/test_fetch_data.py @@ -54,6 +54,13 @@ def test_visual_selector_content_ready(client, live_server): with open(os.path.join('test-datastore', uuid, 'elements.json'), 'r') as f: json.load(f) + # Attempt to fetch it via the web hook that the browser would use + res = client.get(url_for('static_content', group='visual_selector_data', filename=uuid)) + json.loads(res.data) + assert res.mimetype == 'application/json' + assert res.status_code == 200 + + # Some options should be enabled # @todo - in the future, the visibility should be toggled by JS from the request type setting res = client.get( From c905652780d6b6f0e2b748a57dd42da731fa256e Mon Sep 17 00:00:00 2001 From: dgtlmoon Date: Fri, 10 Nov 2023 17:31:00 +0100 Subject: [PATCH 02/14] UI - Adding support-us widget <3 (#1956) --- changedetectionio/static/js/toggle-theme.js | 5 ++ .../static/styles/scss/parts/_darkmode.scss | 2 +- .../static/styles/scss/parts/_love.scss | 38 +++++++++++++ .../static/styles/scss/parts/_menu.scss | 25 +++++++++ .../static/styles/scss/styles.scss | 8 ++- changedetectionio/static/styles/styles.css | 51 ++++++++++++++++-- changedetectionio/templates/base.html | 53 ++++++++++++++++++- changedetectionio/templates/svgs/github.svg | 7 ++- 8 files changed, 176 insertions(+), 13 deletions(-) create mode 100644 changedetectionio/static/styles/scss/parts/_love.scss create mode 100644 changedetectionio/static/styles/scss/parts/_menu.scss diff --git a/changedetectionio/static/js/toggle-theme.js b/changedetectionio/static/js/toggle-theme.js index 885b8907..675aa56f 100644 --- a/changedetectionio/static/js/toggle-theme.js +++ b/changedetectionio/static/js/toggle-theme.js @@ -44,4 +44,9 @@ $(document).ready(function () { } }; + $('#heart-us').click(function () { + $("#overlay").toggleClass('visible'); + heartpath.style.fill = document.getElementById("overlay").classList.contains("visible") ? '#ff0000' : 'var(--color-background)'; + }); + }); diff --git a/changedetectionio/static/styles/scss/parts/_darkmode.scss b/changedetectionio/static/styles/scss/parts/_darkmode.scss index a9719d3c..6a80ecf6 100644 --- a/changedetectionio/static/styles/scss/parts/_darkmode.scss +++ b/changedetectionio/static/styles/scss/parts/_darkmode.scss @@ -1,6 +1,6 @@ #toggle-light-mode { - width: 3rem; +/* width: 3rem;*/ /* default */ .icon-dark { display: none; diff --git a/changedetectionio/static/styles/scss/parts/_love.scss b/changedetectionio/static/styles/scss/parts/_love.scss new file mode 100644 index 00000000..ae693300 --- /dev/null +++ b/changedetectionio/static/styles/scss/parts/_love.scss @@ -0,0 +1,38 @@ +#overlay { + + opacity: 0.95; + position: fixed; + + width: 350px; + max-width: 100%; + height: 100%; + top: 0; + right: -350px; + background-color: var(--color-table-stripe); + z-index: 2; + + transform: translateX(0); + transition: transform .5s ease; + + + &.visible { + transform: translateX(-100%); + + } + + .content { + font-size: 0.875rem; + padding: 1rem; + margin-top: 5rem; + max-width: 400px; + color: var(--color-watch-table-row-text); + } +} + +#heartpath { + &:hover { + fill: #ff0000 !important; + transition: all ease 0.3s !important; + } + transition: all ease 0.3s !important; +} \ No newline at end of file diff --git a/changedetectionio/static/styles/scss/parts/_menu.scss b/changedetectionio/static/styles/scss/parts/_menu.scss new file mode 100644 index 00000000..22322eb8 --- /dev/null +++ b/changedetectionio/static/styles/scss/parts/_menu.scss @@ -0,0 +1,25 @@ +.pure-menu-link { + padding: 0.5rem 1em; + line-height: 1.2rem; +} + +.pure-menu-item { + svg { + height: 1.2rem; + } + * { + vertical-align: middle; + } + .github-link { + height: 1.8rem; + display: block; + svg { + height: 100%; + } + } + .bi-heart { + &:hover { + cursor: pointer; + } + } +} diff --git a/changedetectionio/static/styles/scss/styles.scss b/changedetectionio/static/styles/scss/styles.scss index f5ae8a9f..30b2f6f2 100644 --- a/changedetectionio/static/styles/scss/styles.scss +++ b/changedetectionio/static/styles/scss/styles.scss @@ -9,6 +9,8 @@ @import "parts/_spinners"; @import "parts/_variables"; @import "parts/_darkmode"; +@import "parts/_menu"; +@import "parts/_love"; body { color: var(--color-text); @@ -55,11 +57,6 @@ a.github-link { } } - -#toggle-search { - width: 2rem; -} - #search-q { opacity: 0; -webkit-transition: all .9s ease; @@ -1082,3 +1079,4 @@ ul { border-radius: 3px; white-space: nowrap; } + diff --git a/changedetectionio/static/styles/styles.css b/changedetectionio/static/styles/styles.css index 33071546..a970395a 100644 --- a/changedetectionio/static/styles/styles.css +++ b/changedetectionio/static/styles/styles.css @@ -331,7 +331,7 @@ html[data-darkmode="true"] { color: var(--color-watch-table-error); } #toggle-light-mode { - width: 3rem; + /* width: 3rem;*/ /* default */ } #toggle-light-mode .icon-dark { display: none; } @@ -342,6 +342,52 @@ html[data-darkmode="true"] #toggle-light-mode .icon-light { html[data-darkmode="true"] #toggle-light-mode .icon-dark { display: block; } +.pure-menu-link { + padding: 0.5rem 1em; + line-height: 1.2rem; } + +.pure-menu-item svg { + height: 1.2rem; } + +.pure-menu-item * { + vertical-align: middle; } + +.pure-menu-item .github-link { + height: 1.8rem; + display: block; } + .pure-menu-item .github-link svg { + height: 100%; } + +.pure-menu-item .bi-heart:hover { + cursor: pointer; } + +#overlay { + opacity: 0.95; + position: fixed; + width: 350px; + max-width: 100%; + height: 100%; + top: 0; + right: -350px; + background-color: var(--color-table-stripe); + z-index: 2; + transform: translateX(0); + transition: transform .5s ease; } + #overlay.visible { + transform: translateX(-100%); } + #overlay .content { + font-size: 0.875rem; + padding: 1rem; + margin-top: 5rem; + max-width: 400px; + color: var(--color-watch-table-row-text); } + +#heartpath { + transition: all ease 0.3s !important; } + #heartpath:hover { + fill: #ff0000 !important; + transition: all ease 0.3s !important; } + body { color: var(--color-text); background: var(--color-background-page); } @@ -376,9 +422,6 @@ a.github-link { a.github-link:hover { color: var(--color-icon-github-hover); } -#toggle-search { - width: 2rem; } - #search-q { opacity: 0; -webkit-transition: all .9s ease; diff --git a/changedetectionio/templates/base.html b/changedetectionio/templates/base.html index e8ef295a..d2da7aca 100644 --- a/changedetectionio/templates/base.html +++ b/changedetectionio/templates/base.html @@ -108,6 +108,20 @@ +
  • + + + + +
  • {% include "svgs/github.svg" %} @@ -131,7 +145,44 @@
    {{ right_sticky }}
    {% endif %}
    -
    +
    +
    + changedetection.io needs your support!
    +

    + You can help us by supporting changedetection.io on these platforms; +

    +

    +

    +

    +

    + The more popular changedetection.io is, the more time we can dedicate to adding amazing features! +

    +

    + Many thanks :)
    +

    +

    + changedetection.io team +

    +
    +
    +
    {% block header %}{% endblock %}
    diff --git a/changedetectionio/templates/svgs/github.svg b/changedetectionio/templates/svgs/github.svg index 31eef6df..6e7f97a2 100644 --- a/changedetectionio/templates/svgs/github.svg +++ b/changedetectionio/templates/svgs/github.svg @@ -1,3 +1,6 @@ -