diff --git a/CREDITS b/CREDITS index 5c7e3c2..8fbdeb8 100644 --- a/CREDITS +++ b/CREDITS @@ -61,6 +61,7 @@ NKIPSC <15067635+NKIPSC@users.noreply.github.com> obeho <71698631+obeho@users.noreply.github.com> obscurity Om G <34579088+OxyMagnesium@users.noreply.github.com> +potatoesAreGod <118043038+potatoesAreGod@users.noreply.github.com> RiversideRocks <59586759+RiversideRocks@users.noreply.github.com> robin <8597693+robrobinbin@users.noreply.github.com> Robin <8597693+robrobinbin@users.noreply.github.com> diff --git a/README.md b/README.md index 3fec4cc..697f94c 100644 --- a/README.md +++ b/README.md @@ -210,6 +210,7 @@ Assign a default value for each user-modifiable setting by passing environment v | `HIDE_HLS_NOTIFICATION` | `["on", "off"]` | `off` | | `AUTOPLAY_VIDEOS` | `["on", "off"]` | `off` | | `HIDE_AWARDS` | `["on", "off"]` | `off` +| `DISABLE_VISIT_REDDIT_CONFIRMATION` | `["on", "off"]` | `off` | You can also configure Libreddit with a configuration file. An example `libreddit.toml` can be found below: diff --git a/app.json b/app.json index 33a41fa..da5c1f9 100644 --- a/app.json +++ b/app.json @@ -46,9 +46,12 @@ }, "LIBREDDIT_DEFAULT_HIDE_AWARDS": { "required": false - } + }, "LIBREDDIT_BANNER": { "required": false + }, + "LIBREDDIT_DEFAULT_DISABLE_VISIT_REDDIT_CONFIRMATION": { + "required": false } } } diff --git a/src/settings.rs b/src/settings.rs index 4aa0a09..3dd4e45 100644 --- a/src/settings.rs +++ b/src/settings.rs @@ -19,7 +19,7 @@ struct SettingsTemplate { // CONSTANTS -const PREFS: [&str; 12] = [ +const PREFS: [&str; 13] = [ "theme", "front_page", "layout", @@ -32,6 +32,7 @@ const PREFS: [&str; 12] = [ "hide_hls_notification", "autoplay_videos", "hide_awards", + "disable_visit_reddit_confirmation", ]; // FUNCTIONS diff --git a/src/utils.rs b/src/utils.rs index daee4a9..a823ff5 100644 --- a/src/utils.rs +++ b/src/utils.rs @@ -505,6 +505,7 @@ pub struct Preferences { pub hide_hls_notification: String, pub use_hls: String, pub autoplay_videos: String, + pub disable_visit_reddit_confirmation: String, pub comment_sort: String, pub post_sort: String, pub subscriptions: Vec, @@ -538,6 +539,7 @@ impl Preferences { use_hls: setting(&req, "use_hls"), hide_hls_notification: setting(&req, "hide_hls_notification"), autoplay_videos: setting(&req, "autoplay_videos"), + disable_visit_reddit_confirmation: setting(&req, "disable_visit_reddit_confirmation"), comment_sort: setting(&req, "comment_sort"), post_sort: setting(&req, "post_sort"), subscriptions: setting(&req, "subscriptions").split('+').map(String::from).filter(|s| !s.is_empty()).collect(), diff --git a/static/style.css b/static/style.css index 4275b48..8ef596a 100644 --- a/static/style.css +++ b/static/style.css @@ -4,6 +4,28 @@ :root { --nsfw: #ff5c5d; --admin: #ea0027; + + /* Reddit redirect warning constants */ + --popup-red: #ea0027; + --popup-black: #111; + --popup-text: #fff; + --popup-background-1: #0f0f0f; + --popup-background-2: #220f0f; + --popup-reddit-url: var(--popup-red); + + --popup-background: repeating-linear-gradient( + -45deg, + var(--popup-background-1), + var(--popup-background-1) 50px, + var(--popup-background-2) 50px, + var(--popup-background-2) 100px + ); + + --popup-toreddit-background: var(--popup-black); + --popup-toreddit-text: var(--popup-red); + --popup-goback-background: var(--popup-red); + --popup-goback-text: #222; + --popup-border: 1px solid var(--popup-red); } @font-face { @@ -26,6 +48,7 @@ --highlighted: #333; --visited: #aaa; --shadow: 0 1px 3px rgba(0, 0, 0, 0.5); + --popup: #b80a27; /* Hint color theme to browser for scrollbar */ color-scheme: dark; @@ -134,10 +157,109 @@ nav #libreddit { margin-left: 10px; } -#reddit_link { +.popup { + display: flex; + align-items: center; + justify-content: center; + overflow: clip; + opacity: 0; + position: fixed; + width: 100vw; + height: 100vh; + bottom: 0; + right: 0; + visibility: hidden; + transition: all 0.1s ease-in-out; + z-index: 2; +} + +/* fallback for firefox esr */ +.popup { + background-color: #000000fd; +} + +/* all other browsers */ +@supports ((-webkit-backdrop-filter: none) or (backdrop-filter: none)) { + .popup { + -webkit-backdrop-filter: blur(.25rem) brightness(15%); + backdrop-filter: blur(.25rem) brightness(15%); + } +} + +.popup-inner { + display: flex; + flex-direction: column; + align-items: center; + text-align: center; + max-width: 600px; + max-height: 500px; + width: fit-content; + height: fit-content; + padding: 1rem; + background: var(--popup-background); + border: var(--popup-border); + border-radius: 5px; + transition: all 0.1s ease-in-out; +} + +.popup-inner svg { + display: unset !important; + width: 35%; + stroke: none; + margin: 1rem; +} + +.popup-inner h1 { + color: var(--popup-text); + margin: 1.5rem 1.5rem 1rem; +} + +.popup-inner p { + color: var(--popup-text); +} + +.popup-inner a { + border-radius: 5px; + padding: 2%; + width: 80%; + margin: 0.5rem; + cursor: pointer; + transition: all 0.1s ease-in-out; +} + +#goback { + background: var(--popup-goback-background); + color: var(--popup-goback-text); +} + +#goback:not(.selected):hover { opacity: 0.8; } +#toreddit { + background: var(--popup-toreddit-background); + color: var(--popup-toreddit-text); + border: 1px solid var(--popup-red); +} + +#toreddit:not(.selected):hover { + background: var(--popup-toreddit-text); + color: var(--popup-toreddit-background); +} + +.popup:target { + visibility: visible; + opacity: 1; +} + +#reddit_url { + width: 80%; + color: var(--popup-reddit-url); + font-weight: 600; + line-break: anywhere; + margin-top: 1rem; +} + #code { margin-left: 10px; } @@ -1489,4 +1611,13 @@ td, th { #post_links > li.desktop_item { display: none } #post_links > li.mobile_item { display: auto } .post_footer > p > span#upvoted { display: none } + + .popup { + width: auto; + bottom: 10vh; + } + + .popup-inner > a, h1, p, img { + width: 100%; + } } diff --git a/templates/base.html b/templates/base.html index 63c76a4..387aebb 100644 --- a/templates/base.html +++ b/templates/base.html @@ -1,3 +1,5 @@ +{% import "utils.html" as utils %} + @@ -35,12 +37,15 @@ {% block search %}{% endblock %} +
+ + + +
@@ -127,7 +132,7 @@ diff --git a/templates/utils.html b/templates/utils.html index a1095d2..3fdd76d 100644 --- a/templates/utils.html +++ b/templates/utils.html @@ -156,14 +156,32 @@
  • duplicates
  • dupes
    • {% endif %} -
  • reddit
    • -
  • reddit
    • + {% call external_reddit_link(post.permalink) %}

    {{ post.upvote_ratio }}% Upvoted

    {%- endmacro %} +{% macro external_reddit_link(permalink) %} +{% for dev_type in ["desktop", "mobile"] %} +
  • + reddit + + {% if prefs.disable_visit_reddit_confirmation != "on" %} + {% call visit_reddit_confirmation(permalink) %} + {% endif %} +
    • +{% endfor %} +{% endmacro %} + {% macro post_in_list(post) -%}

    @@ -259,3 +277,25 @@

    {%- endmacro %} + +{% macro visit_reddit_confirmation(url) -%} + +{%- endmacro %}