ada/void-werefox-cafe
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

A lot of work just getting Dioxus to route things properly, moved compile conditions to make less repetition.

Browse Source
This commit is contained in:
Ada Werefox 2023-04-12 17:25:14 -05:00
parent d84457f038
commit 961bb61553
6 changed files with 155 additions and 233 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

5
.gitignore vendored
View File

@ -11,3 +11,8 @@ Cargo.lock
# Added by Dioxus
**/dist/**
# Don't sync the NodeJS files.
**/node_modules/**
**/package-lock.json
**/package.json

2
public/styles/tailwind.min.css vendored
View File

File diff suppressed because one or more lines are too long

33
void-be/src/lib.rs
View File

@ -99,35 +99,6 @@ pub mod web_app_backend {
)
}
#[get("/")]
async fn latest_entry() -> Redirect {
let slug = void_app::get_latest_entry();
let uri = String::from("/poems/".to_string() + slug.as_str());
Redirect::to(uri)
}
#[get("/")]
async fn oldest_entry() -> Redirect {
let slug = void_app::get_oldest_entry();
let uri = String::from("/poems/".to_string() + slug.as_str());
Redirect::to(uri)
}
#[get("/?<current>")]
async fn previous_entry(current: &str) -> Redirect {
let previous =
void_app::get_previous_entry(current.to_string()).expect("There is a previous entry.");
let uri = String::from("/poems/".to_string() + previous.as_str());
Redirect::to(uri)
}
#[get("/?<current>")]
async fn next_entry(current: &str) -> Redirect {
let next = void_app::get_next_entry(current.to_string()).expect("There is a next entry.");
let uri = String::from("/poems/".to_string() + next.as_str());
Redirect::to(uri)
}
#[get("/<entry>")]
async fn poem(cookies: &CookieJar<'_>, entry: &str) -> Template {
let dark_mode = match cookies.get("dark-mode") {
@ -171,10 +142,6 @@ pub mod web_app_backend {
.mount("/images", FileServer::from("public/images"))
.mount("/styles", FileServer::from("public/styles"))
.mount("/fonts", FileServer::from("public/fonts"))
.mount("/poems/oldest", routes![oldest_entry])
.mount("/poems/previous", routes![previous_entry])
.mount("/poems/next", routes![next_entry])
.mount("/poems/latest", routes![latest_entry])
.mount("/poems", routes![poem_list, poem])
.mount("/", routes![dark_mode, index])
.attach(Template::fairing())

16
void-fe/.vscode/settings.json vendored
View File

@ -1,5 +1,19 @@
{
"rust-analyzer.cargo.extraArgs": ["--profile", "rust-analyzer"],
// "rust-analyzer.cargo.buildScripts.invocationLocation": "root",
"rust-analyzer.cargo.target": "wasm32-unknown-unknown",
// "rust-analyzer.cargo.buildScripts.overrideCommand": ["dioxus", "build"],
"rust-analyzer.check.overrideCommand": ["cargo", "check", "--quiet", "--message-format=json"],
"rust-analyzer.check.invocationLocation": "root",
"rust-analyzer.check.targets": ["wasm32-unknown-unknown", "x86_64-unknown-linux-gnu"],
// "rust-analyzer.runnables.command": "dioxus serve",
"rust-analyzer.cargo.buildScripts.enable": false,
"rust-analyzer.linkedProjects": [
"./Cargo.toml"
]
],
"rust-analyzer.showUnlinkedFileNotification": false,
"rust-analyzer.hover.actions.run.enable": true,
"rust-analyzer.hover.actions.debug.enable": true,
"rust-analyzer.hover.documentation.enable": true,
"rust-analyzer.hover.actions.enable": true
}

5
void-fe/Cargo.toml
View File

@ -16,6 +16,11 @@ wasm-logger = "0.2.0"
console_error_panic_hook = "0.1.7"
log = "0.4.17"
dioxus-helmet = "0.2.4"
dioxus-use-storage = "0.3.0"
[dependencies.serde]
version = "1.0.160"
features = ["derive"]
[dependencies.dioxus-router]
version = "0.3.0"

311
void-fe/src/lib.rs
View File

@ -12,11 +12,22 @@ pub mod void_app {
use markdown::{self, Options};
use rust_embed::RustEmbed;
use std::collections::VecDeque;
use dioxus_router::{Route, Router, Redirect};
#[cfg(any(target_family = "wasm"))]
use dioxus_helmet::Helmet;
#[cfg(any(target_family = "wasm"))]
use dioxus_router::{Link, Redirect, Route, Router};
use dioxus_router::{Link};
#[cfg(any(target_family = "wasm"))]
use dioxus_use_storage::use_local_storage;
#[cfg(any(target_family = "wasm"))]
use serde::Deserialize;
#[cfg(target_family = "wasm")]
#[derive(Deserialize)]
struct CurrentPoem {
current: String,
}
#[derive(PartialEq, Props)]
pub struct PoemRequest {
@ -54,21 +65,41 @@ pub mod void_app {
#[folder = "data/poems"]
pub struct Poems;
#[cfg(target_family = "wasm")]
pub fn DioxusApp(cx: Scope) -> Element {
use dioxus_router::Redirect;
// use dioxus_router::Redirect;
let poem_list = get_poem_list();
cx.render(rsx! {
Router {
Route { to: "/", HomePage {} }
Route { to: "/poems/:slug/", PoemPage {} }
Route { to: "/", HomePage { dark_mode: true, } }
Route { to: "/poems/", PoemListPage { slug: "".to_string(), dark_mode: true, } }
Route { to: "/poems/:slug", PoemPage { slug: "".to_string(), dark_mode: true, } }
Route { to: "", PageNotFound {} }
}
})
}
#[cfg(target_family = "wasm")]
fn RoutePreviousPage(cx: Scope<PoemRequest>) -> Element {
let current = String::from(dioxus_router::use_route(cx)
.segment("slug")
.expect("Slug to know which poem we are at."));
log::info!("{}", current.clone());
let previous = current.clone();
cx.render(rsx!{
Redirect { to: "{previous}" }
})
}
#[cfg(target_family = "wasm")]
fn RouteNextPage(cx: Scope<PoemRequest>) -> Element {
let current = String::from(dioxus_router::use_route(cx)
.segment("slug")
.expect("Slug to know which poem we are at."));
let next = current.clone();
cx.render(rsx!{
Redirect { to: "{next}" }
})
}
fn PageNotFound(cx: Scope) -> Element {
cx.render(rsx! {
p { "That page doesn't exist, sorry!" }
@ -78,65 +109,56 @@ pub mod void_app {
fn MutantStandardFooter(cx: Scope) -> Element {
cx.render(rsx!{
div { class: "flex p-4 text-md text-center ring-4 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",
div { class: "flex p-4 mx-auto max-w-full justify-center text-md text-center ring-4 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",
"This site uses Mutant Standard emoji, which are licensed under a Creative Commons Attribution-NonCommercial-ShareAlike 4.0 International License"
}
})
}
#[cfg(any(target_family = "windows", target_family = "unix"))]
fn BackToHomePage(cx: Scope) -> Element {
cx.render(rsx!{
#[cfg(any(target_family = "windows", target_family = "unix"))]
return cx.render(rsx!{
a { class: "flex justify-center p-4 text-xl text-center 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",
href: "/",
p {
"Back to the homepage"
}
}
})
}
});
#[cfg(target_family = "wasm")]
fn BackToHomePage(cx: Scope) -> Element {
cx.render(rsx!{
Link { to: "flex justify-center p-4 text-xl text-center 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",
href: "/",
return cx.render(rsx!{
Link { class: "flex justify-center p-4 text-xl text-center 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",
to: "/",
p {
"Back to the homepage"
}
}
})
});
}
#[cfg(any(target_family = "windows", target_family = "unix"))]
fn NavigationButton(cx: Scope<ButtonProps>) -> Element {
let title = cx.props.title.clone();
let title_ref = title.as_str();
let slug = cx.props.slug.clone();
let slug_ref = slug.as_str();
cx.render(rsx!{
#[cfg(any(target_family = "windows", target_family = "unix"))]
return cx.render(rsx!{
a { class: "flex mx-auto max-w-full justify-center p-4 ml-2 mr-2 text-xl text-center 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",
href: "{slug_ref}",
"{title_ref}"
}
})
}
});
#[cfg(target_family = "wasm")]
fn NavigationButton(cx: Scope<ButtonProps>) -> Element {
let title = cx.props.title.clone();
let title_ref = title.as_str();
let slug = cx.props.slug.clone();
let slug_ref = slug.as_str();
cx.render(rsx!{
Link { class: "flex mx-auto max-w-full justify-center p-4 text-xl text-center 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",
to: slug_ref,
title_ref
return cx.render(rsx!{
Link { class: "flex mx-auto max-w-full justify-center p-4 ml-2 mr-2 text-xl text-center 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",
to: "{slug_ref}",
div {
dangerous_inner_html: "{title_ref}",
}
})
}
});
}
#[cfg(any(target_family = "windows", target_family = "unix"))]
fn DarkModeButton(cx: Scope<DarkModeProps>) -> Element {
let slug = cx
.props
@ -145,7 +167,8 @@ pub mod void_app {
.expect("Slug found to know where to redirect after dark mode setting.");
let slug_ref = slug.as_str();
let dark_mode = cx.props.dark_mode;
cx.render(rsx! {
#[cfg(any(target_family = "windows", target_family = "unix"))]
return cx.render(rsx! {
a { href: "/?dark_mode&callback={slug_ref}",
match dark_mode {
true => {
@ -164,19 +187,9 @@ pub mod void_app {
},
}
}
})
}
});
#[cfg(target_family = "wasm")]
fn DarkModeButton(cx: Scope<DarkModeProps>) -> Element {
let slug = cx
.props
.slug
.clone()
.expect("Slug found to know where to redirect after dark mode setting.");
let slug_ref = slug.as_str();
let dark_mode = cx.props.dark_mode;
cx.render(rsx! {
return cx.render(rsx! {
Link { to: "{slug_ref}/toggle-dark-mode",
match dark_mode {
true => {
@ -195,50 +208,48 @@ pub mod void_app {
},
}
}
})
});
}
#[cfg(any(target_family = "unix", target_family = "windows"))]
fn PoemButton(cx: Scope<ButtonProps>) -> Element {
let title = cx.props.title.clone();
let title_ref = title.as_str();
let slug = cx.props.slug.clone();
let slug_ref = slug.as_str();
cx.render(rsx!{
#[cfg(any(target_family = "unix", target_family = "windows"))]
return cx.render(rsx!{
a { href: "/poems/{slug_ref}",
li { class: "p-4 ml-2 mr-2 text-xl text-center 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",
"{title_ref}"
}
}
})
}
});
#[cfg(target_family = "wasm")]
fn PoemButton(cx: Scope<ButtonProps>) -> Element {
let title = cx.props.title.clone();
let title_ref = title.as_str();
let slug = cx.props.slug.clone();
let slug_ref = slug.as_str();
cx.render(rsx!{
return cx.render(rsx!{
Link { to: "/poems/{slug_ref}",
li { class: "p-4 ml-2 mr-2 text-xl text-center 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",
dangerous_inner_html: "{title_ref}"
dangerous_inner_html: "{title_ref}",
}
}
})
});
}
/// Renders the app and returns the rendered Element.
pub fn HomePage(cx: Scope<DarkModeProps>) -> Element {
#[cfg(any(target_family = "unix", target_family = "windows"))]
let slug = cx.props.slug.clone().expect("Slug for dark mode redirect.");
// let slug_ref = slug.as_str();
#[cfg(target_family = "wasm")]
let slug = "".to_string();
let oldest_uri = format!("/poems/{}", get_oldest_entry());
let latest_uri = format!("/poems/{}", get_latest_entry());
let title = "A Letter to the Void".to_string();
let dark_mode = cx.props.dark_mode.clone();
cx.render(rsx!{
div { class: "min-h-screen font-nerd bg-alice-werefox-grey-light dark:bg-alice-werefox-grey",
div { class: "container space-y-4 mx-auto p-4",
div { class: "p-4 ring-4 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",
p { class: "flex flex-row mx-auto max-w-full justify-center text-xl text-center",
"A Letter to the Void&nbsp;"
"{title}"
DarkModeButton { slug: slug, dark_mode: dark_mode }
}
}
@ -256,8 +267,8 @@ pub mod void_app {
"🖤 Alice Icehart Werefox"
}
}
NavigationButton { title: "See Latest Entry".to_string(), slug: "/poems/latest".to_string() }
NavigationButton { title: "See Oldest Entry".to_string(), slug: "/poems/oldest".to_string() }
NavigationButton { title: "See Latest Entry".to_string(), slug: latest_uri }
NavigationButton { title: "See Oldest Entry".to_string(), slug: oldest_uri }
NavigationButton { title: "See All Entries".to_string(), slug: "/poems".to_string() }
MutantStandardFooter {}
}
@ -362,24 +373,30 @@ pub mod void_app {
})
}
#[cfg(any(target_family = "unix", target_family = "windows"))]
pub fn PoemPage(cx: Scope<PoemRequest>) -> Element {
#[cfg(any(target_family = "unix", target_family = "windows"))]
let slug = cx.props.slug.clone();
let mut oldest_uri = "#".to_string();
if get_oldest_entry() != slug.to_string() {
oldest_uri = format!("/poems/oldest");
#[cfg(target_family = "wasm")]
let slug = String::from(
dioxus_router::use_route(cx)
.segment("slug")
.expect("No slug specified."),
);
let mut oldest_uri = get_oldest_entry();
if oldest_uri == slug.to_string() {
oldest_uri = format!("/poems/{slug}#");
}
let mut previous_uri = "#".to_string();
if let Some(_) = get_previous_entry(slug.clone()) {
previous_uri = format!("/poems/previous/?current={slug}");
}
let mut next_uri = "#".to_string();
if let Some(_) = get_next_entry(slug.clone()) {
next_uri = format!("/poems/next/?current={slug}");
}
let mut latest_uri = "#".to_string();
if get_latest_entry() != slug.to_string() {
latest_uri = format!("/poems/latest");
let previous_uri = match get_previous_entry(slug.clone()) {
Some(p) => format!("/poems/{p}"),
None => format!("/poems/{slug}#"),
};
let next_uri = match get_next_entry(slug.clone()) {
Some(p) => format!("/poems/{p}"),
None => format!("/poems/{slug}#"),
};
let mut latest_uri = get_latest_entry();
if latest_uri == slug.to_string() {
latest_uri = format!("{slug}#");
}
let dark_mode = cx
.props
@ -404,54 +421,6 @@ pub mod void_app {
})
}
#[cfg(target_family = "wasm")]
fn PoemPage(cx: Scope) -> Element {
let slug = String::from(
dioxus_router::use_route(cx)
.segment("slug")
.expect("No slug specified."),
);
let dark_mode = cx
.props
.dark_mode
.clone()
.expect("Dark mode prop not passed.");
cx.render(rsx!{
div { class: "min-h-screen font-nerd bg-alice-werefox-grey-light dark:bg-alice-werefox-grey",
div { class: "container space-y-4 mx-auto p-4",
BackToHomePage {}
GetPoem { slug: slug, dark_mode: dark_mode }
BackToHomePage {}
MutantStandardFooter {}
}
}
})
}
// fn PoemButton(cx: Scope<PoemData>) -> Element {
// let title = cx.props.title.clone().expect("No title specified.");
// let slug = cx.props.slug.clone().expect("No slug specified.");
// let class = String::from("p-4 ml-2 mr-2 text-xl text-center 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");
// cx.render(rsx!{
// PoemButtonLink { title: title, slug: slug, classes: class }
// })
// }
// fn PoemButton(cx: Scope<PoemData>) -> Element {
// let title = cx.props.title.clone().expect("No title specified.");
// let slug = cx.props.slug.clone().expect("No slug specified.");
// let slug_ref = slug.as_str();
// cx.render(rsx!{
// Link { to: "/poems/{slug_ref}",
// li { class: "p-4 ml-2 mr-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: "mx-auto max-w-fit flex justify-center text-lg text-center",
// dangerous_inner_html: "{title}"
// }
// }
// }
// })
// }
fn GetPoem(cx: Scope<PoemData>) -> Element {
// It would be good to implement some kind of "get_poem_data" or "into" functionality for the struct, so I don't have to write all this here.
let dark_mode = cx
@ -475,13 +444,6 @@ pub mod void_app {
markdown::to_html_with_options(poem_content.as_str(), &Options::gfm()).unwrap();
cx.render(rsx! {
MakePoem{
// data: PoemData{
// title: None,
// content: Some(poem_content_to_html_string.clone()),
// creation_date: Some(creation_date.clone()),
// slug: Some(slug.clone()),
// dark_mode: Some(dark_mode),
// },
RenderPoemTitle { title: poem_title_to_html_string, slug: slug, dark_mode: dark_mode }
RenderPoemElement { content: poem_content_to_html_string, creation_date: creation_date }
}})
@ -497,54 +459,26 @@ pub mod void_app {
.clone()
.expect("Dark mode prop not passed.");
let title = cx.props.title.clone().expect("No title specified.");
cx.render(rsx!{
#[cfg(any(target_family = "unix", target_family = "windows"))]
return cx.render(rsx!{
span { class: "p-4 ml-2 mr-2 flex text-xl text-center ring-4 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",
span { class: "flex flex-row align-middle mx-auto max-w-full justify-center",
"{title}&nbsp;"
DarkModeButton { slug: callback, dark_mode: dark_mode }
}
}
})
});
#[cfg(target_family = "wasm")]
return cx.render(rsx!{
span { class: "p-4 ml-2 mr-2 flex text-xl text-center ring-4 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",
span { class: "flex flex-row align-middle mx-auto max-w-full justify-center",
div { dangerous_inner_html: "{title}", }
DarkModeButton { slug: callback, dark_mode: dark_mode }
}
}
});
}
// #[cfg(target_family = "wasm")]
// fn RenderPoemTitle(cx: Scope<PoemData>) -> Element {
// let slug = cx.props.slug.clone().expect("Slug prop was not passed.");
// let dark_mode = cx.props.dark_mode.clone().expect("Dark mode prop not passed.");
// let title = cx
// .props
// .title
// .clone()
// .expect("This poem has an empty title.");
// cx.render(rsx!{
// p { class: "mx-auto max-w-fit flex flex-row justify-center 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 p-4",
// dangerous_inner_html: "{title}&nbsp;",
// a { class: "",
// href: "/poems/{slug}/toggle-dark-mode",
// match dark_mode {
// true => {
// rsx! {
// img { class: "",
// src: "/images/white_square_button.png",
// alt: "A white square button that can toggle dark mode.",
// }
// }
// },
// false => {
// rsx! {
// img { class: "",
// src: "/images/black_square_button.png",
// alt: "A black square button that can toggle dark mode.",
// }
// }
// },
// }
// }
// }
// })
// }
#[cfg(any(target_family = "unix", target_family = "windows"))]
fn RenderPoemElement(cx: Scope<PoemData>) -> Element {
let content = cx.props.content.clone().expect("No content specified.");
let creation_date = cx
@ -552,7 +486,8 @@ pub mod void_app {
.creation_date
.clone()
.expect("No creation date specified.");
cx.render(rsx! {
#[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",
@ -561,23 +496,19 @@ pub mod void_app {
}
}
}
})
}
});
#[cfg(target_family = "wasm")]
fn RenderPoemElement(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.");
cx.render(rsx! {
div {
class: "font-nerd flex flex-col space-y-4 mx-4 py-4",
dangerous_inner_html: "{content}{creation_date}"
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}",
}
}
}
});
}
fn MakePoem<'a>(cx: Scope<'a, PoemChildren<'a>>) -> Element {