diff --git a/README.md b/README.md index ed7aa30..ab9abac 100644 --- a/README.md +++ b/README.md @@ -199,6 +199,7 @@ Assign a default value for each setting by passing environment variables to Libr | `USE_HLS` | `["on", "off"]` | `off` | | `HIDE_HLS_NOTIFICATION` | `["on", "off"]` | `off` | | `AUTOPLAY_VIDEOS` | `["on", "off"]` | `off` | +| `DISABLE_VISIT_REDDIT_CONFIRMATION` | `["on", "off"]` | `off` | ### Examples diff --git a/app.json b/app.json index fd41fc8..394509e 100644 --- a/app.json +++ b/app.json @@ -40,6 +40,9 @@ }, "LIBREDDIT_HIDE_HLS_NOTIFICATION": { "required": false + }, + "LIBREDDIT_DEFAULT_DISABLE_VISIT_REDDIT_CONFIRMATION": { + "required": false } } } diff --git a/src/settings.rs b/src/settings.rs index 0fd2640..95caa3f 100644 --- a/src/settings.rs +++ b/src/settings.rs @@ -19,7 +19,7 @@ struct SettingsTemplate { // CONSTANTS -const PREFS: [&str; 11] = [ +const PREFS: [&str; 12] = [ "theme", "front_page", "layout", @@ -31,6 +31,7 @@ const PREFS: [&str; 11] = [ "use_hls", "hide_hls_notification", "autoplay_videos", + "disable_visit_reddit_confirmation", ]; // FUNCTIONS diff --git a/src/utils.rs b/src/utils.rs index 9d58e31..ccd7369 100644 --- a/src/utils.rs +++ b/src/utils.rs @@ -466,6 +466,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, @@ -498,6 +499,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 df15723..01ac57a 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; } /* Browser-defined light theme */ @@ -132,6 +155,109 @@ nav #libreddit { opacity: 0.8; } +.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; } @@ -1373,4 +1499,13 @@ td, th { padding: 7px 0px; margin-right: -5px; } + + .popup { + width: auto; + bottom: 10vh; + } + + .popup-inner > a, h1, p, img { + width: 100%; + } } diff --git a/templates/base.html b/templates/base.html index e9b51ec..2781584 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 %} +
+ + + +
diff --git a/templates/utils.html b/templates/utils.html index 110dcbe..734d640 100644 --- a/templates/utils.html +++ b/templates/utils.html @@ -156,3 +156,25 @@ {%- endmacro %} + +{% macro visit_reddit_confirmation(url) -%} + +{%- endmacro %}