update stylesheet and clean up asset code

the stylesheet got a new update from my websites stylesheet with the
bigger font sizes and i split the hyperlegible font face css into its
own file and made the asset code cleaner.
This commit is contained in:
Fries 2023-07-09 22:09:07 -07:00
parent 74f3cd1cb4
commit 4e17ef7dff
6 changed files with 152 additions and 99 deletions

43
public/hyperlegible.css Normal file
View File

@ -0,0 +1,43 @@
@font-face {
font-family: Atkinson Hyperlegible;
font-style: normal;
font-display: swap;
font-weight: 400;
src: url(/public/woff2/atkinson-hyperlegible-latin-ext-400-normal.woff2) format("woff2"),
url(/public/woff/atkinson-hyperlegible-all-400-normal.woff) format("woff");
unicode-range: U+0100-024F,
U+0259,
U+1E00-1EFF,
U+2020,
U+20A0-20AB,
U+20AD-20CF,
U+2113,
U+2C60-2C7F,
U+A720-A7FF
}
@font-face {
font-family: Atkinson Hyperlegible;
font-style: normal;
font-display: swap;
font-weight: 400;
src: url(/public/woff2/atkinson-hyperlegible-latin-400-normal.woff2) format("woff2"),
url(/public/woff/atkinson-hyperlegible-all-400-normal.woff) format("woff");
unicode-range: U+0000-00FF,
U+0131,
U+0152-0153,
U+02BB-02BC,
U+02C6,
U+02DA,
U+02DC,
U+2000-206F,
U+2074,
U+20AC,
U+2122,
U+2191,
U+2193,
U+2212,
U+2215,
U+FEFF,
U+FFFD
}

View File

@ -14,64 +14,51 @@
} }
} }
:root {
--h1-font-size: 3.225rem;
--h2-font-size: 2.825rem;
--h3-font-size: 2.225rem;
--h4-font-size: 1.665rem;
--default-font-size: 1.375rem;
--h6-font-size: 1.185rem;
}
body { body {
font-family: "Atkinson Hyperlegible", sans-serif; font-family: "Atkinson Hyperlegible", sans-serif;
text-align: center; text-align: center;
font-size: var(--default-font-size);
max-width: 600px; max-width: 600px;
margin: auto; margin: auto;
background-color: var(--background-color); background-color: var(--background-color);
color: var(--text-color) color: var(--text-color)
} }
a { a {
font-size: var(--default-font-size);
color: var(--link-color); color: var(--link-color);
font-size: 22px;
} }
p { h1 {
font-size: 22px; font-size: var(--h1-font-size);
} }
@font-face { h2 {
font-family: Atkinson Hyperlegible; font-size: var(--h2-font-size);
font-style: normal; }
font-display: swap;
font-weight: 400; h3 {
src: url(/public/woff2/atkinson-hyperlegible-latin-ext-400-normal.woff2) format("woff2"), font-size: var(--h3-font-size);
url(/public/woff/atkinson-hyperlegible-all-400-normal.woff) format("woff");
unicode-range: U+0100-024F,
U+0259,
U+1E00-1EFF,
U+2020,
U+20A0-20AB,
U+20AD-20CF,
U+2113,
U+2C60-2C7F,
U+A720-A7FF
} }
@font-face { h4 {
font-family: Atkinson Hyperlegible; font-size: var(--h4-font-size);
font-style: normal; }
font-display: swap;
font-weight: 400; h5 {
src: url(/public/woff2/atkinson-hyperlegible-latin-400-normal.woff2) format("woff2"), font-size: var(--default-font-size);
url(/public/woff/atkinson-hyperlegible-all-400-normal.woff) format("woff"); }
unicode-range: U+0000-00FF,
U+0131, h6 {
U+0152-0153, font-size: var(--h6-font-size);
U+02BB-02BC,
U+02C6,
U+02DA,
U+02DC,
U+2000-206F,
U+2074,
U+20AC,
U+2122,
U+2191,
U+2193,
U+2212,
U+2215,
U+FEFF,
U+FFFD
} }

View File

@ -1,14 +1,29 @@
use std::borrow::Cow;
use askama_rocket::Template; use askama_rocket::Template;
use rocket::http::Status; use rocket::{http::Status, response::content::RawCss};
use rust_embed::RustEmbed; use rust_embed::{EmbeddedFile, RustEmbed};
use shared::names::Site; use shared::names::Site;
use std::borrow::Cow;
#[derive(RustEmbed)] #[derive(RustEmbed)]
#[folder = "public/"] #[folder = "public/"]
pub struct PublicAssets; pub struct PublicAssets;
impl PublicAssets {
fn get_asset(file_path: &str) -> Result<EmbeddedFile, Status> {
match PublicAssets::get(file_path) {
Some(asset) => Ok(asset),
None => Err(Status::NotFound),
}
}
fn get_string(file_path: &str) -> Result<String, Status> {
let asset = PublicAssets::get_asset(file_path)?;
match std::str::from_utf8(&asset.data) {
Ok(string) => Ok(string.to_string()),
Err(_) => Err(Status::InternalServerError),
}
}
}
#[derive(Responder)] #[derive(Responder)]
#[response(status = 200, content_type = "font/woff2")] #[response(status = 200, content_type = "font/woff2")]
pub struct RawWoff2Font(pub Cow<'static, [u8]>); pub struct RawWoff2Font(pub Cow<'static, [u8]>);
@ -21,26 +36,33 @@ pub struct RawWoffFont(pub Cow<'static, [u8]>);
#[template(path = "error.html")] #[template(path = "error.html")]
pub struct ErrorTemplate<'a> { pub struct ErrorTemplate<'a> {
pub error: &'a str, pub error: &'a str,
pub error_description: &'a str pub error_description: &'a str,
} }
#[derive(Template)] #[derive(Template)]
#[template(path = "index.html")] #[template(path = "index.html")]
pub struct IndexTemplate { pub struct IndexTemplate {
pub sites: Vec<Site> pub sites: Vec<Site>,
} }
#[derive(Responder)] #[derive(Responder)]
pub struct ErrorTemplateResponder<'a> { pub struct ErrorTemplateResponder<'a> {
template: ErrorTemplate<'a> template: ErrorTemplate<'a>,
} }
#[get("/style.css")] #[get("/css/<style>")]
pub fn style() -> Result<rocket::response::content::RawCss<String>, Status> { pub fn style(style: &str) -> Result<rocket::response::content::RawCss<String>, Status> {
let style = PublicAssets::get("style.css").unwrap(); let style_name = "style.css";
match std::str::from_utf8(&style.data) { let hyperlegible_name = "hyperlegible.css";
Ok(style) => Ok(rocket::response::content::RawCss::<String>(style.to_string())),
Err(_) => Err(Status::InternalServerError), if style == style_name {
let string = PublicAssets::get_string(style_name)?;
Ok(RawCss::<String>(string))
} else if style == hyperlegible_name {
let string = PublicAssets::get_string(hyperlegible_name)?;
Ok(RawCss::<String>(string))
} else {
Err(Status::NotFound)
} }
} }
@ -50,9 +72,9 @@ pub fn woff2_font(font: &str) -> Result<RawWoff2Font, Status> {
let latin_ext = "atkinson-hyperlegible-latin-ext-400-normal.woff2"; let latin_ext = "atkinson-hyperlegible-latin-ext-400-normal.woff2";
if font == latin { if font == latin {
Ok(RawWoff2Font(PublicAssets::get(latin).unwrap().data)) Ok(RawWoff2Font(PublicAssets::get_asset(latin)?.data))
} else if font == latin_ext { } else if font == latin_ext {
Ok(RawWoff2Font(PublicAssets::get(latin_ext).unwrap().data)) Ok(RawWoff2Font(PublicAssets::get_asset(latin_ext)?.data))
} else { } else {
Err(Status::NotFound) Err(Status::NotFound)
} }
@ -63,7 +85,7 @@ pub fn woff_font(font: &str) -> Result<RawWoffFont, Status> {
let all = "atkinson-hyperlegible-all-400-normal.woff"; let all = "atkinson-hyperlegible-all-400-normal.woff";
if font == all { if font == all {
Ok(RawWoffFont(PublicAssets::get(all).unwrap().data)) Ok(RawWoffFont(PublicAssets::get_asset(all)?.data))
} else { } else {
Err(Status::NotFound) Err(Status::NotFound)
} }

16
templates/base.html Normal file
View File

@ -0,0 +1,16 @@
<!DOCTYPE html>
<html lang="en">
<head>
<title>Meowy Webring{% block title %}{% endblock %}</title>
{% block head %}
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width">
<link rel="stylesheet" href="/public/css/hyperlegible.css" />
<link rel="stylesheet" href="/public/css/style.css" />
{% endblock %}
</head>
<body>
{% block content %}
{% endblock %}
</body>
</html>

View File

@ -1,15 +1,10 @@
<!DOCTYPE html> {% extends "base.html" %}
<html lang="en">
<head> {% block title %} - {{ error }}{% endblock %}
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width"> {% block content %}
<title>Meowy Webring - {{ error }}</title> <main>
<link rel="stylesheet" href="/public/style.css" /> <h1>{{ error }}</h1>
</head> <p>{{ error_description }}</p>
<body> </main>
<main> {% endblock %}
<h1>{{ error }}</h1>
<p>{{ error_description }}</p>
</main>
</body>
</html>

View File

@ -1,26 +1,16 @@
<!DOCTYPE html> {% extends "base.html" %}
<html lang="en">
<head> {% block content %}
<meta charset="UTF-8"> <main>
<meta name="viewport" content="width=device-width"> <h1>Meowy Webring</h1>
<title>Meowy Webring</title> <h2>Sites</h2>
<link rel="stylesheet" href="/public/style.css" /> {% for site in sites %}
</head> {% match site.name %}
{% when Some with (value) %}
<body> <p><a href="https://{{ site.url }}">{{ value }}</a></p>
<main> {% when None %}
<h1>Welcome</h1> <p><a href="https://{{ site.url }}">{{ site.url }}</a></p>
<h2>Sites</h2> {% endmatch %}
{% for site in sites %} {% endfor %}
{% match site.name %} </main>
{% when Some with (value) %} {% endblock %}
<p><a href="{{ site.url }}">{{ value }}</a></p>
{% when None %}
<p><a href="{{ site.url }}">{{ site.url }}</a></p>
{% endmatch %}
{% endfor %}
</main>
</body>
</html>