Light theme

This commit is contained in:
spikecodes 2021-01-10 18:15:34 -08:00
parent c58b077330
commit 08683fa5a6
10 changed files with 48 additions and 21 deletions

View File

@ -13,6 +13,7 @@ struct SettingsTemplate {
#[derive(serde::Deserialize)]
pub struct SettingsForm {
theme: Option<String>,
front_page: Option<String>,
layout: Option<String>,
wide: Option<String>,
@ -32,8 +33,8 @@ pub async fn get(req: HttpRequest) -> HttpResponse {
pub async fn set(req: HttpRequest, form: Form<SettingsForm>) -> HttpResponse {
let mut res = HttpResponse::Found();
let names = vec!["front_page", "layout", "wide", "comment_sort", "hide_nsfw"];
let values = vec![&form.front_page, &form.layout, &form.wide, &form.comment_sort, &form.hide_nsfw];
let names = vec!["theme", "front_page", "layout", "wide", "comment_sort", "hide_nsfw"];
let values = vec![&form.theme, &form.front_page, &form.layout, &form.wide, &form.comment_sort, &form.hide_nsfw];
for (i, name) in names.iter().enumerate() {
match values[i] {

View File

@ -91,9 +91,12 @@ pub struct Params {
#[template(path = "error.html", escape = "none")]
pub struct ErrorTemplate {
pub message: String,
pub prefs: Preferences,
}
#[derive(Default)]
pub struct Preferences {
pub theme: String,
pub front_page: String,
pub layout: String,
pub wide: String,
@ -108,6 +111,7 @@ pub struct Preferences {
// Build preferences from cookies
pub fn prefs(req: HttpRequest) -> Preferences {
Preferences {
theme: cookie(&req, "theme"),
front_page: cookie(&req, "front_page"),
layout: cookie(&req, "layout"),
wide: cookie(&req, "wide"),
@ -262,7 +266,12 @@ pub async fn fetch_posts(path: &str, fallback_title: String) -> Result<(Vec<Post
//
pub async fn error(msg: String) -> HttpResponse {
let body = ErrorTemplate { message: msg }.render().unwrap_or_default();
let body = ErrorTemplate {
message: msg,
prefs: Preferences::default(),
}
.render()
.unwrap_or_default();
HttpResponse::NotFound().content_type("text/html").body(body)
}

View File

@ -3,6 +3,7 @@
:root {
--accent: aqua;
--green: #5cff85;
--nsfw: #FF5C5D;
--text: white;
--foreground: #222;
--background: #0F0F0F;
@ -13,7 +14,7 @@
}
::selection {
color: var(--background);
color: var(--foreground);
background: var(--accent);
}
@ -127,6 +128,20 @@ aside {
opacity: 0.5;
}
/* Light Theme */
.light {
--accent: #009a9a;
--green: #00a229;
--text: black;
--foreground: #f5f5f5;
--background: #DDD;
--outside: #ECECEC;
--post: #eee;
--highlighted: white;
--shadow: 0 1px 3px rgba(0,0,0,0.1);
}
/* User & Subreddit */
#user, #subreddit, #sidebar {
@ -225,6 +240,7 @@ select, #search {
#searchbox {
display: flex;
box-shadow: var(--shadow);
border-radius: 5px;
}
#searchbox > *, #sort_submit {
@ -308,7 +324,7 @@ input[type="submit"]:hover { color: var(--accent); }
}
#sort_options > a, footer > a {
color: lightgrey;
color: var(--text);
padding: 10px 20px;
text-align: center;
cursor: pointer;
@ -317,7 +333,7 @@ input[type="submit"]:hover { color: var(--accent); }
#sort_options > a.selected {
background: var(--accent);
color: var(--background);
color: var(--foreground);
}
#sort_options > a:not(.selected):hover {
@ -454,9 +470,9 @@ input[type="submit"]:hover { color: var(--accent); }
}
.nsfw {
color: #FF5C5D;
color: var(--nsfw);
margin-top: 20px;
border: 1px solid #FF5C5D;
border: 1px solid var(--nsfw);
padding: 5px;
font-size: 12px;
border-radius: 5px;
@ -676,6 +692,7 @@ input[type="submit"]:hover { color: var(--accent); }
border-radius: 5px;
box-shadow: var(--shadow);
margin-left: 20px;
background: var(--foreground);
}
#save {

View File

@ -11,7 +11,10 @@
<link rel="stylesheet" href="/style.css">
{% endblock %}
</head>
<body class="{% block ui %}{% endblock %}">
<body class="
{% if prefs.layout != "" %}{{ prefs.layout }}{% endif %}
{% if prefs.wide == "on" %} wide{% endif %}
{% if prefs.theme == "light" %} light{% endif %}">
<!-- NAVIGATION BAR -->
<nav>
<p id="logo">

View File

@ -7,8 +7,6 @@
{% call utils::search(["/r/", post.community.as_str()].concat(), "") %}
{% endblock %}
{% block ui %}{% if prefs.wide == "on" %} wide{% endif %}{% endblock %}
{% block root %}/r/{{ post.community }}{% endblock %}{% block location %}r/{{ post.community }}{% endblock %}
{% block head %}
{% call super() %}

View File

@ -3,8 +3,6 @@
{% block title %}Libreddit: search results - {{ params.q }}{% endblock %}
{% block ui %}{% if prefs.layout != "" %}{{ prefs.layout }}{% endif %}{% if prefs.wide == "on" %} wide{% endif %}{% endblock %}
{% block content %}
<div id="column_one">
<form id="search_sort">

View File

@ -10,6 +10,13 @@
{% block content %}
<form id="settings" action="/settings" method="POST">
<div id="prefs">
<p>Appearance</p>
<div id="theme">
<label for="theme">Theme:</label>
<select name="theme">
{% call utils::options(prefs.theme, ["dark", "light"], "dark") %}
</select>
</div>
<p>Interface</p>
<div id="front_page">
<label for="front_page">Front page:</label>
@ -27,7 +34,7 @@
<label for="wide">Wide UI:</label>
<input type="checkbox" name="wide" {% if prefs.wide == "on" %}checked{% endif %}>
</div>
<p>Sorting / Filtering</p>
<p>Content</p>
<div id="comment_sort">
<label for="comment_sort">Default comment sort:</label>
<select name="comment_sort">

View File

@ -11,8 +11,6 @@
{% call utils::search(["/r/", sub.name.as_str()].concat(), "") %}
{% endblock %}
{% block ui %}{% if prefs.layout != "" %}{{ prefs.layout }}{% endif %}{% if prefs.wide == "on" %} wide{% endif %}{% endblock %}
{% block body %}
<main>
<div id="column_one">

View File

@ -7,8 +7,6 @@
{% block title %}{{ user.name.replace("u/", "") }} (u/{{ user.name }}) - Libreddit{% endblock %}
{% block ui %}{% if prefs.layout != "" %}{{ prefs.layout }}{% endif %}{% if prefs.wide == "on" %} wide{% endif %}{% endblock %}
{% block body %}
<main>
<div id="column_one">

View File

@ -6,8 +6,6 @@
{% else %}Libreddit{% endif %}
{% endblock %}
{% block ui %}{% if prefs.wide == "on" %} wide{% endif %}{% endblock %}
{% block search %}
{% call utils::search(["/r/", sub.as_str()].concat(), "") %}
{% endblock %}