diff --git a/.env.example b/.env.example index 5e60b08..5beeaff 100644 --- a/.env.example +++ b/.env.example @@ -12,8 +12,9 @@ REDLIB_ROBOTS_DISABLE_INDEXING=off REDLIB_PUSHSHIFT_FRONTEND=undelete.pullpush.io # Default user settings -# Set the default theme (options: system, light, dark, black, dracula, nord, laserwave, violet, gold, rosebox, gruvboxdark, gruvboxlight) -REDLIB_DEFAULT_THEME=system +# Set the default theme (options: light, dark, black, dracula, nord, laserwave, violet, gold, rosebox, gruvboxdark, gruvboxlight) +REDLIB_DEFAULT_THEME_LIGHT=light +REDLIB_DEFAULT_THEME_DARK=dark # Set the default front page (options: default, popular, all) REDLIB_DEFAULT_FRONT_PAGE=default # Set the default layout (options: card, clean, compact) diff --git a/README.md b/README.md index fcae126..1b3ce95 100644 --- a/README.md +++ b/README.md @@ -370,7 +370,7 @@ REDLIB_DEFAULT_SHOW_NSFW=on redlib ``` ```bash -REDLIB_DEFAULT_WIDE=on REDLIB_DEFAULT_THEME=dark redlib -r +REDLIB_DEFAULT_WIDE=on REDLIB_DEFAULT_THEME_DARK=dark redlib -r ``` You can also configure Redlib with a configuration file named `redlib.toml`. For example: @@ -423,7 +423,8 @@ Assign a default value for each user-modifiable setting by passing environment v | Name | Possible values | Default value | | ----------------------------------- | ---------------------------------------------------------------------------------------------------------------------------------- | ------------- | -| `THEME` | `["system", "light", "dark", "black", "dracula", "nord", "laserwave", "violet", "gold", "rosebox", "gruvboxdark", "gruvboxlight", "tokyoNight", "icebergDark", "doomone", "libredditBlack", "libredditDark", "libredditLight"]` | `system` | +| `THEME_LIGHT` | `["light", "dark", "black", "dracula", "nord", "laserwave", "violet", "gold", "rosebox", "gruvboxdark", "gruvboxlight", "tokyoNight", "icebergDark", "doomone", "libredditBlack", "libredditDark", "libredditLight"]` | `light` | +| `THEME_DARK` | `["light", "dark", "black", "dracula", "nord", "laserwave", "violet", "gold", "rosebox", "gruvboxdark", "gruvboxlight", "tokyoNight", "icebergDark", "doomone", "libredditBlack", "libredditDark", "libredditLight"]` | `dark` | | `FRONT_PAGE` | `["default", "popular", "all"]` | `default` | | `LAYOUT` | `["card", "clean", "compact"]` | `card` | | `WIDE` | `["on", "off"]` | `off` | @@ -436,6 +437,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` | | `SUBSCRIPTIONS` | `+`-delimited list of subreddits (`sub1+sub2+sub3+...`) | _(none)_ | +| `FILTERS` | `+`-delimited list of subreddits (`sub1+sub2+sub3+...`) | _(none)_ | | `HIDE_AWARDS` | `["on", "off"]` | `off` | | `DISABLE_VISIT_REDDIT_CONFIRMATION` | `["on", "off"]` | `off` | | `HIDE_SCORE` | `["on", "off"]` | `off` | diff --git a/app.json b/app.json index 4af7cfe..ae983bb 100644 --- a/app.json +++ b/app.json @@ -11,7 +11,10 @@ ], "stack": "container", "env": { - "REDLIB_DEFAULT_THEME": { + "REDLIB_DEFAULT_THEME_LIGHT": { + "required": false + }, + "REDLIB_DEFAULT_THEME_DARK": { "required": false }, "REDLIB_DEFAULT_FRONT_PAGE": { diff --git a/src/config.rs b/src/config.rs index 7b1c95c..eb6d8fe 100644 --- a/src/config.rs +++ b/src/config.rs @@ -24,9 +24,13 @@ pub struct Config { #[serde(alias = "LIBREDDIT_SFW_ONLY")] pub(crate) sfw_only: Option, - #[serde(rename = "REDLIB_DEFAULT_THEME")] - #[serde(alias = "LIBREDDIT_DEFAULT_THEME")] - pub(crate) default_theme: Option, + #[serde(rename = "REDLIB_DEFAULT_THEME_LIGHT")] + #[serde(alias = "LIBREDDIT_DEFAULT_THEME_LIGHT")] + pub(crate) default_theme_light: Option, + + #[serde(rename = "REDLIB_DEFAULT_THEME_DARK")] + #[serde(alias = "LIBREDDIT_DEFAULT_THEME_DARK")] + pub(crate) default_theme_dark: Option, #[serde(rename = "REDLIB_DEFAULT_FRONT_PAGE")] #[serde(alias = "LIBREDDIT_DEFAULT_FRONT_PAGE")] @@ -137,7 +141,8 @@ impl Config { }; Self { sfw_only: parse("REDLIB_SFW_ONLY"), - default_theme: parse("REDLIB_DEFAULT_THEME"), + default_theme_light: parse("REDLIB_DEFAULT_THEME_LIGHT"), + default_theme_dark: parse("REDLIB_DEFAULT_THEME_DARK"), default_front_page: parse("REDLIB_DEFAULT_FRONT_PAGE"), default_layout: parse("REDLIB_DEFAULT_LAYOUT"), default_post_sort: parse("REDLIB_DEFAULT_POST_SORT"), @@ -167,7 +172,8 @@ impl Config { fn get_setting_from_config(name: &str, config: &Config) -> Option { match name { "REDLIB_SFW_ONLY" => config.sfw_only.clone(), - "REDLIB_DEFAULT_THEME" => config.default_theme.clone(), + "REDLIB_DEFAULT_THEME_LIGHT" => config.default_theme_light.clone(), + "REDLIB_DEFAULT_THEME_DARK" => config.default_theme_dark.clone(), "REDLIB_DEFAULT_FRONT_PAGE" => config.default_front_page.clone(), "REDLIB_DEFAULT_LAYOUT" => config.default_layout.clone(), "REDLIB_DEFAULT_COMMENT_SORT" => config.default_comment_sort.clone(), diff --git a/src/instance_info.rs b/src/instance_info.rs index a573953..5712c6a 100644 --- a/src/instance_info.rs +++ b/src/instance_info.rs @@ -138,7 +138,8 @@ impl InstanceInfo { Table::from([ ["Hide awards", &convert(&self.config.default_hide_awards)], ["Hide score", &convert(&self.config.default_hide_score)], - ["Theme", &convert(&self.config.default_theme)], + ["Light Theme", &convert(&self.config.default_theme_light)], + ["Dark Theme", &convert(&self.config.default_theme_dark)], ["Front page", &convert(&self.config.default_front_page)], ["Layout", &convert(&self.config.default_layout)], ["Wide", &convert(&self.config.default_wide)], @@ -175,7 +176,8 @@ impl InstanceInfo { Banner: {:?}\n Hide awards: {:?}\n Hide score: {:?}\n - Default theme: {:?}\n + Default light theme: {:?}\n + Default dark theme: {:?}\n Default front page: {:?}\n Default layout: {:?}\n Default wide: {:?}\n @@ -202,7 +204,8 @@ impl InstanceInfo { self.config.banner, self.config.default_hide_awards, self.config.default_hide_score, - self.config.default_theme, + self.config.default_theme_light, + self.config.default_theme_dark, self.config.default_front_page, self.config.default_layout, self.config.default_wide, diff --git a/src/main.rs b/src/main.rs index e1b010d..535486d 100644 --- a/src/main.rs +++ b/src/main.rs @@ -95,8 +95,28 @@ async fn style() -> Result, String> { let mut res = include_str!("../static/style.css").to_string(); for file in ThemeAssets::iter() { res.push('\n'); - let theme = ThemeAssets::get(file.as_ref()).unwrap(); - res.push_str(std::str::from_utf8(theme.data.as_ref()).unwrap()); + let theme: Vec<&str> = file.as_ref().split(".css").collect(); + let theme = ".".to_owned() + theme[0]; + let style = ThemeAssets::get(file.as_ref()).unwrap(); + let style = std::str::from_utf8(style.data.as_ref()).unwrap(); + let style_light = &style.replace(&theme, &(theme.clone() + "_light")); + let style_light = &format!( + " + @media (prefers-color-scheme: light) {{ + {style_light} + }} + " + ); + let style_dark = &style.replace(&theme, &(theme.clone() + "_dark")); + let style_dark = &format!( + " + @media (prefers-color-scheme: dark) {{ + {style_dark} + }} + " + ); + res.push_str(style_light); + res.push_str(style_dark); } Ok( Response::builder() diff --git a/src/settings.rs b/src/settings.rs index 2efbbba..7742704 100644 --- a/src/settings.rs +++ b/src/settings.rs @@ -24,8 +24,9 @@ struct SettingsTemplate { // CONSTANTS -const PREFS: [&str; 19] = [ - "theme", +const PREFS: [&str; 20] = [ + "theme_light", + "theme_dark", "front_page", "layout", "wide", diff --git a/src/utils.rs b/src/utils.rs index f5046cb..6fd78f0 100644 --- a/src/utils.rs +++ b/src/utils.rs @@ -627,7 +627,9 @@ pub struct Preferences { #[serde(skip_serializing, skip_deserializing)] pub available_themes: Vec, #[revision(start = 1)] - pub theme: String, + pub theme_light: String, + #[revision(start = 1)] + pub theme_dark: String, #[revision(start = 1)] pub front_page: String, #[revision(start = 1)] @@ -699,15 +701,15 @@ impl Preferences { // Build preferences from cookies pub fn new(req: &Request) -> Self { // Read available theme names from embedded css files. - // Always make the default "system" theme available. - let mut themes = vec!["system".to_string()]; + let mut themes = Vec::new(); for file in ThemeAssets::iter() { let chunks: Vec<&str> = file.as_ref().split(".css").collect(); themes.push(chunks[0].to_owned()); } Self { available_themes: themes, - theme: setting(req, "theme"), + theme_light: setting(req, "theme_light"), + theme_dark: setting(req, "theme_dark"), front_page: setting(req, "front_page"), layout: setting(req, "layout"), wide: setting(req, "wide"), @@ -1526,7 +1528,8 @@ mod tests { fn serialize_prefs() { let prefs = Preferences { available_themes: vec![], - theme: "laserwave".to_owned(), + theme_light: "laserwave".to_owned(), + theme_dark: "laserwave".to_owned(), front_page: "default".to_owned(), layout: "compact".to_owned(), wide: "on".to_owned(), diff --git a/static/style.css b/static/style.css index 608ae17..2576ef0 100644 --- a/static/style.css +++ b/static/style.css @@ -37,66 +37,6 @@ font-weight: 100 900; } -/* Automatic theme selection */ -:root, -.dark { - /* Default & fallback theme (dark) */ - --accent: #d54455; - --green: #5cff85; - --text: white; - --foreground: #222; - --background: #0f0f0f; - --outside: #1f1f1f; - --post: #161616; - --panel-border: 1px solid #333; - --highlighted: #333; - --visited: #aaa; - --shadow: 0 1px 3px rgba(0, 0, 0, 0.5); - --popup: #b80a27; - --spoiler: #ddd; - - /* Hint color theme to browser for scrollbar */ - color-scheme: dark; -} - -/* Browser-defined light theme */ -@media (prefers-color-scheme: light) { - :root { - --accent: #bb2b3b; - --green: #00a229; - --text: black; - --foreground: #f5f5f5; - --background: #ddd; - --outside: #ececec; - --post: #eee; - --panel-border: 1px solid #ccc; - --highlighted: white; - --visited: #555; - --shadow: 0 1px 3px rgba(0, 0, 0, 0.1); - --spoiler: #0f0f0f; - - /* Hint color theme to browser for scrollbar */ - color-scheme: light; - } -} - -/* Other themes are located in the "themes" folder */ - -/* Tokyo Night theme setting */ -.tokyoNight { - --accent: #565f89; - --green: #73daca; - --text: #a9b1d6; - --foreground: #24283b; - --background: #1a1b26; - --outside: #24283b; - --post: #1a1b26; - --panel-border: 1px solid #a9b1d6; - --highlighted: #414868; - --visited: #414868; - --shadow: 0 1px 3px rgba(0, 0, 0, 0.5); -} - /* General */ ::selection { diff --git a/templates/base.html b/templates/base.html index a1c141b..b70ebb0 100644 --- a/templates/base.html +++ b/templates/base.html @@ -34,7 +34,8 @@