Add userstyles back.
This commit is contained in:
parent
422b9452a2
commit
5a6d1e8fc7
|
@ -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" }
|
||||
|
|
|
@ -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>
|
||||
|
|
|
@ -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'"
|
||||
},
|
||||
|
|
|
@ -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();
|
||||
}
|
||||
}
|
||||
}
|
|
@ -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 />
|
||||
}
|
||||
}
|
||||
})
|
||||
|
|
|
@ -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;
|
||||
|
|
|
@ -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>
|
||||
</>
|
||||
}
|
||||
}
|
||||
}
|
|
@ -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;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
|
@ -29,3 +29,5 @@ button {
|
|||
@import 'components/page-footer';
|
||||
@import 'components/page-header';
|
||||
@import 'components/page-main';
|
||||
|
||||
@import 'components/userstyles';
|
||||
|
|
Loading…
Reference in New Issue