1
Fork 0

Add userstyles back.

This commit is contained in:
Bauke 2021-08-30 16:35:59 +02:00
parent 422b9452a2
commit 5a6d1e8fc7
Signed by: Bauke
GPG Key ID: C1C0F29952BCF558
9 changed files with 133 additions and 1 deletions

View File

@ -7,6 +7,7 @@ version = "1.0.0"
edition = "2018"
repository = "https://git.holllo.cc/Bauke/bauke.xyz"
license = "AGPL-3.0-or-later"
build = "source/build.rs"
[[bin]]
name = "bauke-xyz"
@ -17,6 +18,7 @@ gloo-console = "0.1.0"
gloo-timers = "0.2.1"
log = "0.4.14"
rand = "0.8.4"
userstyles = { git = "https://git.holllo.cc/Bauke/userstyles" }
wasm-logger = "0.2.0"
yew = "0.18.0"
yew-router = "0.15.0"
@ -24,3 +26,6 @@ yew-router = "0.15.0"
[dependencies.getrandom]
version = "0.2.3"
features = ["js"]
[build-dependencies]
userstyles = { git = "https://git.holllo.cc/Bauke/userstyles" }

View File

@ -9,6 +9,7 @@
<link data-trunk rel="sass" href="source/scss/modern-normalize.scss" />
<link data-trunk rel="sass" href="source/scss/index.scss" />
<link data-trunk rel="copy-file" href="source/netlify/_redirects" />
<link data-trunk rel="copy-dir" href="target/userstyles" />
</head>
<body>

View File

@ -3,7 +3,7 @@
"version": "0.0.0",
"license": "AGPL-3.0-or-later",
"scripts": {
"deploy": "trunk clean && trunk build --release && yarn deploy:netlify",
"deploy": "trunk clean && cargo build -q && trunk build --release && yarn deploy:netlify",
"deploy:netlify": "netlify deploy --prod --dir 'public/' -s bauke.xyz",
"test": "stylelint 'source/**/*.scss'"
},

23
source/build.rs Normal file
View File

@ -0,0 +1,23 @@
/// Build script for the website.
fn main() {
println!("cargo:rerun-if-changed=source/**");
let build_dir = std::path::PathBuf::from("target");
for target in userstyles::ALL_USERSTYLES {
let style = userstyles::Userstyle::load(target).unwrap();
let style_name = style.metadata.name.to_lowercase().replace(" ", "-");
let style_dir = build_dir.join("userstyles");
std::fs::create_dir_all(&style_dir).unwrap();
let style_file = style_dir.join(format!("{}.user.css", style_name));
let formatted = style.format();
std::fs::write(style_file, formatted).unwrap();
if let Some(image) = style.image {
let image_file = style_dir.join(format!("{}.png", style_name));
std::fs::write(image_file, image).unwrap();
}
}
}

View File

@ -14,6 +14,8 @@ pub(crate) mod routes;
/// All routes.
#[derive(Clone, yew_router::Switch)]
pub(crate) enum Route {
#[to = "/userstyles"]
Userstyles,
#[to = "/{}"]
NotFound(String),
#[to = "/"]
@ -51,6 +53,9 @@ impl Component for Model {
},
Route::Home => html! {
<routes::HomeRoute />
},
Route::Userstyles => html! {
<routes::UserstylesRoute />
}
}
})

View File

@ -1,4 +1,7 @@
/// The route for `/`.
mod home;
/// The route for `/userstyles`.
mod userstyles;
pub(crate) use self::userstyles::UserstylesRoute;
pub(crate) use home::HomeRoute;

View File

@ -0,0 +1,57 @@
use yew::prelude::*;
use crate::components::PageHeader;
/// The route for `/userstyles`.
pub(crate) struct UserstylesRoute;
impl Component for UserstylesRoute {
type Message = ();
type Properties = ();
fn create(_props: Self::Properties, _link: ComponentLink<Self>) -> Self {
log::trace!("Creating UserstylesRoute");
Self
}
fn update(&mut self, _msg: Self::Message) -> ShouldRender {
unimplemented!()
}
fn change(&mut self, _props: Self::Properties) -> ShouldRender {
false
}
fn view(&self) -> Html {
let styles = userstyles::ALL_USERSTYLES
.iter()
.map(|target| userstyles::Userstyle::load(target))
.flatten()
.map(|style| {
let style_name = style.metadata.name.to_lowercase().replace(" ", "-");
html! {
<div class="style">
<div class="header">
<img src=format!("/userstyles/{}.png", style_name) />
<h2>{style.metadata.name}</h2>
<a target="_blank" href={style.metadata.update_url}>{"Install"}</a>
</div>
<p>{style.metadata.description}</p>
</div>
}
})
.collect::<Vec<_>>();
html! {
<>
<PageHeader />
<main class="page-main userstyles">
{styles}
</main>
</>
}
}
}

View File

@ -0,0 +1,36 @@
.userstyles {
background-color: transparent;
display: grid;
gap: 1rem;
grid-template-columns: repeat(2, 1fr);
padding: 0;
.style {
background-color: #333;
padding: 1rem;
.header {
align-items: center;
display: flex;
margin-bottom: 0.5rem;
img {
height: 4rem;
margin-right: 0.5rem;
}
a {
border: 2px solid;
margin-left: auto;
padding: 0.5rem;
text-decoration: none;
&:hover {
background-color: #ff0;
border-color: #ff0;
color: #000;
}
}
}
}
}

View File

@ -29,3 +29,5 @@ button {
@import 'components/page-footer';
@import 'components/page-header';
@import 'components/page-main';
@import 'components/userstyles';