Light theme
This commit is contained in:
spikecodes
parent
c58b077330
commit
08683fa5a6
10 changed files with 48 additions and 21 deletions
|
|
@ -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] {
|
||||
|
|
|
|||
11
src/utils.rs
11
src/utils.rs
|
|
@ -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)
|
||||
}
|
||||
|
||||
|
|
|
|||
|
|
@ -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 {
|
||||
|
|
|
|||
|
|
@ -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">
|
||||
|
|
|
|||
|
|
@ -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() %}
|
||||
|
|
|
|||
|
|
@ -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">
|
||||
|
|
|
|||
|
|
@ -10,13 +10,20 @@
|
|||
{% 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>
|
||||
<select name="front_page">
|
||||
{% call utils::options(prefs.front_page, ["popular", "all"], "popular") %}
|
||||
</select>
|
||||
</div>
|
||||
</div>
|
||||
<div id="layout">
|
||||
<label for="layout">Layout:</label>
|
||||
<select name="layout">
|
||||
|
|
@ -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">
|
||||
|
|
|
|||
|
|
@ -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">
|
||||
|
|
|
|||
|
|
@ -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">
|
||||
|
|
|
|||
|
|
@ -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 %}
|
||||
|
|
|
|||
Loading…
Reference in a new issue