70 lines
3.5 KiB
Rust
70 lines
3.5 KiB
Rust
|
use dioxus::prelude::*;
|
||
|
|
use crate::utils::helpers;
|
||
|
|
use crate::utils::prop_structs::{PoemChildren, PoemData};
|
||
|
|
use crate::components::void_buttons::*;
|
||
|
|
use crate::components::void_title::*;
|
||
|
|
|
||
|
|
pub fn PoemList(cx: Scope) -> Element {
|
||
|
|
let poem_list = helpers::get_poem_list();
|
||
|
|
cx.render(rsx! {
|
||
|
|
ul { class: "flex flex-col space-y-4",
|
||
|
|
poem_list.into_iter().map(|p| {
|
||
|
|
let slug = format!("/poems/{}", p.1);
|
||
|
|
rsx!{
|
||
|
|
NavigationButton { title: p.0, slug: slug }
|
||
|
|
}
|
||
|
|
})
|
||
|
|
}
|
||
|
|
})
|
||
|
|
}
|
||
|
|
|
||
|
|
pub fn MakePoem<'a>(cx: Scope<'a, PoemChildren<'a>>) -> Element {
|
||
|
|
cx.render(rsx! {
|
||
|
|
div { class: "flex-col space-y-4",
|
||
|
|
&cx.props.children
|
||
|
|
}
|
||
|
|
})
|
||
|
|
}
|
||
|
|
|
||
|
|
pub fn GetPoem(cx: Scope<PoemData>) -> Element {
|
||
|
|
let slug = String::from(cx.props.slug.clone().expect("No slug specified."));
|
||
|
|
let (title, content, creation_date) = helpers::get_poem(slug.clone());
|
||
|
|
cx.render(rsx! {
|
||
|
|
Title { title: title, is_html: true }
|
||
|
|
MakePoem{
|
||
|
|
PoemContent { content: content, creation_date: creation_date }
|
||
|
|
}
|
||
|
|
})
|
||
|
|
}
|
||
|
|
|
||
|
|
pub fn PoemContent(cx: Scope<PoemData>) -> Element {
|
||
|
|
let content = cx.props.content.clone().expect("No content specified.");
|
||
|
|
let creation_date = cx
|
||
|
|
.props
|
||
|
|
.creation_date
|
||
|
|
.clone()
|
||
|
|
.expect("No creation date specified.");
|
||
|
|
#[cfg(any(target_family = "unix", target_family = "windows"))]
|
||
|
|
return cx.render(rsx! {
|
||
|
|
div { class: "flex p-2 mx-auto max-w-full justify-center",
|
||
|
|
details { class: "group p-4 max-w-fit space-y-4 bg-alice-werefox-grey-lightest dark:bg-alice-werefox-grey-dark ring-4 ring-alice-werefox-red-dark dark:ring-alice-werefox-red text-alice-werefox-grey-dark dark:text-alice-werefox-grey-light",
|
||
|
|
summary { class: "group-open:before:content-['Close'] before:content-['Open'] flex justify-center p-2 ring-2 bg-alice-werefox-grey-lightest dark:bg-alice-werefox-grey-dark ring-alice-werefox-red-dark dark:ring-alice-werefox-red text-alice-werefox-grey-dark dark:text-alice-werefox-grey-light hover:text-alice-werefox-blue-dark dark:hover:text-alice-werefox-blue-light hover:ring-alice-werefox-blue dark:hover:ring-alice-werefox-blue hover:animate-yip transition",
|
||
|
|
}
|
||
|
|
div { class: "font-nerd flex flex-col space-y-4 py-4", "{content}{creation_date}"
|
||
|
|
}
|
||
|
|
}
|
||
|
|
}
|
||
|
|
});
|
||
|
|
#[cfg(target_family = "wasm")]
|
||
|
|
return cx.render(rsx! {
|
||
|
|
div { class: "flex p-2 mx-auto max-w-full justify-center",
|
||
|
|
details { class: "group p-4 max-w-fit space-y-4 bg-alice-werefox-grey-lightest dark:bg-alice-werefox-grey-dark ring-4 ring-alice-werefox-red-dark dark:ring-alice-werefox-red text-alice-werefox-grey-dark dark:text-alice-werefox-grey-light",
|
||
|
|
summary { class: "group-open:before:content-['Close'] before:content-['Open'] flex justify-center p-2 ring-2 bg-alice-werefox-grey-lightest dark:bg-alice-werefox-grey-dark ring-alice-werefox-red-dark dark:ring-alice-werefox-red text-alice-werefox-grey-dark dark:text-alice-werefox-grey-light hover:text-alice-werefox-blue-dark dark:hover:text-alice-werefox-blue-light hover:ring-alice-werefox-blue dark:hover:ring-alice-werefox-blue hover:animate-yip transition",
|
||
|
|
}
|
||
|
|
div { class: "font-nerd flex flex-col space-y-4 py-4",
|
||
|
|
dangerous_inner_html: "{content}{creation_date}",
|
||
|
|
}
|
||
|
|
}
|
||
|
|
}
|
||
|
|
});
|
||
|
|
}
|