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:
parent
74f3cd1cb4
commit
4e17ef7dff
6 changed files with 152 additions and 99 deletions
43
public/hyperlegible.css
Normal file
43
public/hyperlegible.css
Normal 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
|
||||
}
|
|
@ -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 {
|
||||
font-family: "Atkinson Hyperlegible", sans-serif;
|
||||
text-align: center;
|
||||
font-size: var(--default-font-size);
|
||||
max-width: 600px;
|
||||
margin: auto;
|
||||
background-color: var(--background-color);
|
||||
color: var(--text-color)
|
||||
}
|
||||
|
||||
|
||||
a {
|
||||
font-size: var(--default-font-size);
|
||||
color: var(--link-color);
|
||||
font-size: 22px;
|
||||
}
|
||||
|
||||
p {
|
||||
font-size: 22px;
|
||||
h1 {
|
||||
font-size: var(--h1-font-size);
|
||||
}
|
||||
|
||||
@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
|
||||
h2 {
|
||||
font-size: var(--h2-font-size);
|
||||
}
|
||||
|
||||
h3 {
|
||||
font-size: var(--h3-font-size);
|
||||
}
|
||||
|
||||
@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
|
||||
h4 {
|
||||
font-size: var(--h4-font-size);
|
||||
}
|
||||
|
||||
h5 {
|
||||
font-size: var(--default-font-size);
|
||||
}
|
||||
|
||||
h6 {
|
||||
font-size: var(--h6-font-size);
|
||||
}
|
||||
|
|
|
@ -1,14 +1,29 @@
|
|||
use std::borrow::Cow;
|
||||
|
||||
use askama_rocket::Template;
|
||||
use rocket::http::Status;
|
||||
use rust_embed::RustEmbed;
|
||||
use rocket::{http::Status, response::content::RawCss};
|
||||
use rust_embed::{EmbeddedFile, RustEmbed};
|
||||
use shared::names::Site;
|
||||
use std::borrow::Cow;
|
||||
|
||||
#[derive(RustEmbed)]
|
||||
#[folder = "public/"]
|
||||
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)]
|
||||
#[response(status = 200, content_type = "font/woff2")]
|
||||
pub struct RawWoff2Font(pub Cow<'static, [u8]>);
|
||||
|
@ -21,26 +36,33 @@ pub struct RawWoffFont(pub Cow<'static, [u8]>);
|
|||
#[template(path = "error.html")]
|
||||
pub struct ErrorTemplate<'a> {
|
||||
pub error: &'a str,
|
||||
pub error_description: &'a str
|
||||
pub error_description: &'a str,
|
||||
}
|
||||
|
||||
#[derive(Template)]
|
||||
#[template(path = "index.html")]
|
||||
pub struct IndexTemplate {
|
||||
pub sites: Vec<Site>
|
||||
pub sites: Vec<Site>,
|
||||
}
|
||||
|
||||
#[derive(Responder)]
|
||||
pub struct ErrorTemplateResponder<'a> {
|
||||
template: ErrorTemplate<'a>
|
||||
template: ErrorTemplate<'a>,
|
||||
}
|
||||
|
||||
#[get("/style.css")]
|
||||
pub fn style() -> Result<rocket::response::content::RawCss<String>, Status> {
|
||||
let style = PublicAssets::get("style.css").unwrap();
|
||||
match std::str::from_utf8(&style.data) {
|
||||
Ok(style) => Ok(rocket::response::content::RawCss::<String>(style.to_string())),
|
||||
Err(_) => Err(Status::InternalServerError),
|
||||
#[get("/css/<style>")]
|
||||
pub fn style(style: &str) -> Result<rocket::response::content::RawCss<String>, Status> {
|
||||
let style_name = "style.css";
|
||||
let hyperlegible_name = "hyperlegible.css";
|
||||
|
||||
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";
|
||||
|
||||
if font == latin {
|
||||
Ok(RawWoff2Font(PublicAssets::get(latin).unwrap().data))
|
||||
Ok(RawWoff2Font(PublicAssets::get_asset(latin)?.data))
|
||||
} else if font == latin_ext {
|
||||
Ok(RawWoff2Font(PublicAssets::get(latin_ext).unwrap().data))
|
||||
Ok(RawWoff2Font(PublicAssets::get_asset(latin_ext)?.data))
|
||||
} else {
|
||||
Err(Status::NotFound)
|
||||
}
|
||||
|
@ -63,7 +85,7 @@ pub fn woff_font(font: &str) -> Result<RawWoffFont, Status> {
|
|||
let all = "atkinson-hyperlegible-all-400-normal.woff";
|
||||
|
||||
if font == all {
|
||||
Ok(RawWoffFont(PublicAssets::get(all).unwrap().data))
|
||||
Ok(RawWoffFont(PublicAssets::get_asset(all)?.data))
|
||||
} else {
|
||||
Err(Status::NotFound)
|
||||
}
|
||||
|
|
16
templates/base.html
Normal file
16
templates/base.html
Normal 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>
|
|
@ -1,15 +1,10 @@
|
|||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width">
|
||||
<title>Meowy Webring - {{ error }}</title>
|
||||
<link rel="stylesheet" href="/public/style.css" />
|
||||
</head>
|
||||
<body>
|
||||
<main>
|
||||
<h1>{{ error }}</h1>
|
||||
<p>{{ error_description }}</p>
|
||||
</main>
|
||||
</body>
|
||||
</html>
|
||||
{% extends "base.html" %}
|
||||
|
||||
{% block title %} - {{ error }}{% endblock %}
|
||||
|
||||
{% block content %}
|
||||
<main>
|
||||
<h1>{{ error }}</h1>
|
||||
<p>{{ error_description }}</p>
|
||||
</main>
|
||||
{% endblock %}
|
||||
|
|
|
@ -1,26 +1,16 @@
|
|||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
{% extends "base.html" %}
|
||||
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width">
|
||||
<title>Meowy Webring</title>
|
||||
<link rel="stylesheet" href="/public/style.css" />
|
||||
</head>
|
||||
|
||||
<body>
|
||||
<main>
|
||||
<h1>Welcome</h1>
|
||||
<h2>Sites</h2>
|
||||
{% for site in sites %}
|
||||
{% match site.name %}
|
||||
{% when Some with (value) %}
|
||||
<p><a href="{{ site.url }}">{{ value }}</a></p>
|
||||
{% when None %}
|
||||
<p><a href="{{ site.url }}">{{ site.url }}</a></p>
|
||||
{% endmatch %}
|
||||
{% endfor %}
|
||||
</main>
|
||||
</body>
|
||||
|
||||
</html>
|
||||
{% block content %}
|
||||
<main>
|
||||
<h1>Meowy Webring</h1>
|
||||
<h2>Sites</h2>
|
||||
{% for site in sites %}
|
||||
{% match site.name %}
|
||||
{% when Some with (value) %}
|
||||
<p><a href="https://{{ site.url }}">{{ value }}</a></p>
|
||||
{% when None %}
|
||||
<p><a href="https://{{ site.url }}">{{ site.url }}</a></p>
|
||||
{% endmatch %}
|
||||
{% endfor %}
|
||||
</main>
|
||||
{% endblock %}
|
||||
|
|
Loading…
Reference in a new issue