mirror of https://github.com/spikecodes/libreddit
Light theme
This commit is contained in:
parent
c58b077330
commit
08683fa5a6
|
@ -13,6 +13,7 @@ struct SettingsTemplate {
|
||||||
|
|
||||||
#[derive(serde::Deserialize)]
|
#[derive(serde::Deserialize)]
|
||||||
pub struct SettingsForm {
|
pub struct SettingsForm {
|
||||||
|
theme: Option<String>,
|
||||||
front_page: Option<String>,
|
front_page: Option<String>,
|
||||||
layout: Option<String>,
|
layout: Option<String>,
|
||||||
wide: 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 {
|
pub async fn set(req: HttpRequest, form: Form<SettingsForm>) -> HttpResponse {
|
||||||
let mut res = HttpResponse::Found();
|
let mut res = HttpResponse::Found();
|
||||||
|
|
||||||
let names = vec!["front_page", "layout", "wide", "comment_sort", "hide_nsfw"];
|
let names = vec!["theme", "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 values = vec![&form.theme, &form.front_page, &form.layout, &form.wide, &form.comment_sort, &form.hide_nsfw];
|
||||||
|
|
||||||
for (i, name) in names.iter().enumerate() {
|
for (i, name) in names.iter().enumerate() {
|
||||||
match values[i] {
|
match values[i] {
|
||||||
|
|
11
src/utils.rs
11
src/utils.rs
|
@ -91,9 +91,12 @@ pub struct Params {
|
||||||
#[template(path = "error.html", escape = "none")]
|
#[template(path = "error.html", escape = "none")]
|
||||||
pub struct ErrorTemplate {
|
pub struct ErrorTemplate {
|
||||||
pub message: String,
|
pub message: String,
|
||||||
|
pub prefs: Preferences,
|
||||||
}
|
}
|
||||||
|
|
||||||
|
#[derive(Default)]
|
||||||
pub struct Preferences {
|
pub struct Preferences {
|
||||||
|
pub theme: String,
|
||||||
pub front_page: String,
|
pub front_page: String,
|
||||||
pub layout: String,
|
pub layout: String,
|
||||||
pub wide: String,
|
pub wide: String,
|
||||||
|
@ -108,6 +111,7 @@ pub struct Preferences {
|
||||||
// Build preferences from cookies
|
// Build preferences from cookies
|
||||||
pub fn prefs(req: HttpRequest) -> Preferences {
|
pub fn prefs(req: HttpRequest) -> Preferences {
|
||||||
Preferences {
|
Preferences {
|
||||||
|
theme: cookie(&req, "theme"),
|
||||||
front_page: cookie(&req, "front_page"),
|
front_page: cookie(&req, "front_page"),
|
||||||
layout: cookie(&req, "layout"),
|
layout: cookie(&req, "layout"),
|
||||||
wide: cookie(&req, "wide"),
|
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 {
|
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)
|
HttpResponse::NotFound().content_type("text/html").body(body)
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
|
@ -3,6 +3,7 @@
|
||||||
:root {
|
:root {
|
||||||
--accent: aqua;
|
--accent: aqua;
|
||||||
--green: #5cff85;
|
--green: #5cff85;
|
||||||
|
--nsfw: #FF5C5D;
|
||||||
--text: white;
|
--text: white;
|
||||||
--foreground: #222;
|
--foreground: #222;
|
||||||
--background: #0F0F0F;
|
--background: #0F0F0F;
|
||||||
|
@ -13,7 +14,7 @@
|
||||||
}
|
}
|
||||||
|
|
||||||
::selection {
|
::selection {
|
||||||
color: var(--background);
|
color: var(--foreground);
|
||||||
background: var(--accent);
|
background: var(--accent);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@ -127,6 +128,20 @@ aside {
|
||||||
opacity: 0.5;
|
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 */
|
||||||
|
|
||||||
#user, #subreddit, #sidebar {
|
#user, #subreddit, #sidebar {
|
||||||
|
@ -225,6 +240,7 @@ select, #search {
|
||||||
#searchbox {
|
#searchbox {
|
||||||
display: flex;
|
display: flex;
|
||||||
box-shadow: var(--shadow);
|
box-shadow: var(--shadow);
|
||||||
|
border-radius: 5px;
|
||||||
}
|
}
|
||||||
|
|
||||||
#searchbox > *, #sort_submit {
|
#searchbox > *, #sort_submit {
|
||||||
|
@ -308,7 +324,7 @@ input[type="submit"]:hover { color: var(--accent); }
|
||||||
}
|
}
|
||||||
|
|
||||||
#sort_options > a, footer > a {
|
#sort_options > a, footer > a {
|
||||||
color: lightgrey;
|
color: var(--text);
|
||||||
padding: 10px 20px;
|
padding: 10px 20px;
|
||||||
text-align: center;
|
text-align: center;
|
||||||
cursor: pointer;
|
cursor: pointer;
|
||||||
|
@ -317,7 +333,7 @@ input[type="submit"]:hover { color: var(--accent); }
|
||||||
|
|
||||||
#sort_options > a.selected {
|
#sort_options > a.selected {
|
||||||
background: var(--accent);
|
background: var(--accent);
|
||||||
color: var(--background);
|
color: var(--foreground);
|
||||||
}
|
}
|
||||||
|
|
||||||
#sort_options > a:not(.selected):hover {
|
#sort_options > a:not(.selected):hover {
|
||||||
|
@ -454,9 +470,9 @@ input[type="submit"]:hover { color: var(--accent); }
|
||||||
}
|
}
|
||||||
|
|
||||||
.nsfw {
|
.nsfw {
|
||||||
color: #FF5C5D;
|
color: var(--nsfw);
|
||||||
margin-top: 20px;
|
margin-top: 20px;
|
||||||
border: 1px solid #FF5C5D;
|
border: 1px solid var(--nsfw);
|
||||||
padding: 5px;
|
padding: 5px;
|
||||||
font-size: 12px;
|
font-size: 12px;
|
||||||
border-radius: 5px;
|
border-radius: 5px;
|
||||||
|
@ -676,6 +692,7 @@ input[type="submit"]:hover { color: var(--accent); }
|
||||||
border-radius: 5px;
|
border-radius: 5px;
|
||||||
box-shadow: var(--shadow);
|
box-shadow: var(--shadow);
|
||||||
margin-left: 20px;
|
margin-left: 20px;
|
||||||
|
background: var(--foreground);
|
||||||
}
|
}
|
||||||
|
|
||||||
#save {
|
#save {
|
||||||
|
|
|
@ -11,7 +11,10 @@
|
||||||
<link rel="stylesheet" href="/style.css">
|
<link rel="stylesheet" href="/style.css">
|
||||||
{% endblock %}
|
{% endblock %}
|
||||||
</head>
|
</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 -->
|
<!-- NAVIGATION BAR -->
|
||||||
<nav>
|
<nav>
|
||||||
<p id="logo">
|
<p id="logo">
|
||||||
|
|
|
@ -7,8 +7,6 @@
|
||||||
{% call utils::search(["/r/", post.community.as_str()].concat(), "") %}
|
{% call utils::search(["/r/", post.community.as_str()].concat(), "") %}
|
||||||
{% endblock %}
|
{% endblock %}
|
||||||
|
|
||||||
{% block ui %}{% if prefs.wide == "on" %} wide{% endif %}{% endblock %}
|
|
||||||
|
|
||||||
{% block root %}/r/{{ post.community }}{% endblock %}{% block location %}r/{{ post.community }}{% endblock %}
|
{% block root %}/r/{{ post.community }}{% endblock %}{% block location %}r/{{ post.community }}{% endblock %}
|
||||||
{% block head %}
|
{% block head %}
|
||||||
{% call super() %}
|
{% call super() %}
|
||||||
|
|
|
@ -3,8 +3,6 @@
|
||||||
|
|
||||||
{% block title %}Libreddit: search results - {{ params.q }}{% endblock %}
|
{% 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 %}
|
{% block content %}
|
||||||
<div id="column_one">
|
<div id="column_one">
|
||||||
<form id="search_sort">
|
<form id="search_sort">
|
||||||
|
|
|
@ -10,13 +10,20 @@
|
||||||
{% block content %}
|
{% block content %}
|
||||||
<form id="settings" action="/settings" method="POST">
|
<form id="settings" action="/settings" method="POST">
|
||||||
<div id="prefs">
|
<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>
|
<p>Interface</p>
|
||||||
<div id="front_page">
|
<div id="front_page">
|
||||||
<label for="front_page">Front page:</label>
|
<label for="front_page">Front page:</label>
|
||||||
<select name="front_page">
|
<select name="front_page">
|
||||||
{% call utils::options(prefs.front_page, ["popular", "all"], "popular") %}
|
{% call utils::options(prefs.front_page, ["popular", "all"], "popular") %}
|
||||||
</select>
|
</select>
|
||||||
</div>
|
</div>
|
||||||
<div id="layout">
|
<div id="layout">
|
||||||
<label for="layout">Layout:</label>
|
<label for="layout">Layout:</label>
|
||||||
<select name="layout">
|
<select name="layout">
|
||||||
|
@ -27,7 +34,7 @@
|
||||||
<label for="wide">Wide UI:</label>
|
<label for="wide">Wide UI:</label>
|
||||||
<input type="checkbox" name="wide" {% if prefs.wide == "on" %}checked{% endif %}>
|
<input type="checkbox" name="wide" {% if prefs.wide == "on" %}checked{% endif %}>
|
||||||
</div>
|
</div>
|
||||||
<p>Sorting / Filtering</p>
|
<p>Content</p>
|
||||||
<div id="comment_sort">
|
<div id="comment_sort">
|
||||||
<label for="comment_sort">Default comment sort:</label>
|
<label for="comment_sort">Default comment sort:</label>
|
||||||
<select name="comment_sort">
|
<select name="comment_sort">
|
||||||
|
|
|
@ -11,8 +11,6 @@
|
||||||
{% call utils::search(["/r/", sub.name.as_str()].concat(), "") %}
|
{% call utils::search(["/r/", sub.name.as_str()].concat(), "") %}
|
||||||
{% endblock %}
|
{% endblock %}
|
||||||
|
|
||||||
{% block ui %}{% if prefs.layout != "" %}{{ prefs.layout }}{% endif %}{% if prefs.wide == "on" %} wide{% endif %}{% endblock %}
|
|
||||||
|
|
||||||
{% block body %}
|
{% block body %}
|
||||||
<main>
|
<main>
|
||||||
<div id="column_one">
|
<div id="column_one">
|
||||||
|
|
|
@ -7,8 +7,6 @@
|
||||||
|
|
||||||
{% block title %}{{ user.name.replace("u/", "") }} (u/{{ user.name }}) - Libreddit{% endblock %}
|
{% 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 %}
|
{% block body %}
|
||||||
<main>
|
<main>
|
||||||
<div id="column_one">
|
<div id="column_one">
|
||||||
|
|
|
@ -6,8 +6,6 @@
|
||||||
{% else %}Libreddit{% endif %}
|
{% else %}Libreddit{% endif %}
|
||||||
{% endblock %}
|
{% endblock %}
|
||||||
|
|
||||||
{% block ui %}{% if prefs.wide == "on" %} wide{% endif %}{% endblock %}
|
|
||||||
|
|
||||||
{% block search %}
|
{% block search %}
|
||||||
{% call utils::search(["/r/", sub.as_str()].concat(), "") %}
|
{% call utils::search(["/r/", sub.as_str()].concat(), "") %}
|
||||||
{% endblock %}
|
{% endblock %}
|
||||||
|
|
Loading…
Reference in New Issue