automatically apply system-wide theme preference for anonymous users (fixes philomena-dev/philomena#36)

This commit is contained in:
byte[] 2020-12-06 13:04:25 -05:00
parent 1f57d0041c
commit edcd4ebfde
3 changed files with 28 additions and 3 deletions

13
assets/js/theme.js Normal file
View file

@ -0,0 +1,13 @@
/**
* Theme setting
*/
function setThemeCookie() {
if (window.matchMedia('(prefers-color-scheme: dark)').matches) {
document.cookie = `theme=dark; path=/; max-age=788923800; samesite=lax`;
} else {
document.cookie = `theme=light; path=/; max-age=788923800; samesite=lax`;
}
}
export { setThemeCookie };

View file

@ -32,6 +32,7 @@ import { setupTimestamps } from './timeago';
import { setupImageUpload } from './upload';
import { setupSearch } from './search';
import { setupToolbar } from './textiletoolbar';
import { setThemeCookie } from './theme';
import { hideStaffTools } from './staffhider';
import { pollOptionCreator } from './poll';
@ -63,7 +64,8 @@ whenReady(() => {
setupTimestamps();
setupImageUpload();
setupSearch();
setupToolbar();
setupToolbar()
setThemeCookie();
hideStaffTools();
pollOptionCreator();

View file

@ -64,14 +64,24 @@ defmodule PhilomenaWeb.LayoutView do
Config.get(:footer)
end
def stylesheet_path(conn, %{theme: "default"}),
do: Routes.static_path(conn, "/css/default.css")
def stylesheet_path(conn, %{theme: "dark"}),
do: Routes.static_path(conn, "/css/dark.css")
def stylesheet_path(conn, %{theme: "red"}),
do: Routes.static_path(conn, "/css/red.css")
def stylesheet_path(conn, _user),
do: Routes.static_path(conn, "/css/default.css")
def stylesheet_path(conn, _user) do
case conn.cookies do
%{"theme" => "dark"} ->
Routes.static_path(conn, "/css/dark.css")
_ ->
Routes.static_path(conn, "/css/default.css")
end
end
def theme_name(%{theme: theme}), do: theme
def theme_name(_user), do: "default"