thaw/gh-pages/src/pages/toast/mod.rs

63 lines
1.7 KiB
Rust
Raw Normal View History

2023-09-21 22:59:35 +08:00
use crate::{
components::{Demo, DemoCode},
pages::MobilePage,
};
2023-06-14 18:19:59 +08:00
use leptos::*;
use melt_ui::mobile::*;
use melt_ui::*;
2023-10-04 00:11:38 +08:00
use prisms::highlight_str;
2023-08-29 09:11:22 +08:00
use std::time::Duration;
2023-06-14 18:19:59 +08:00
#[component]
2023-08-29 09:11:22 +08:00
pub fn ToastPage() -> impl IntoView {
2023-09-21 22:59:35 +08:00
view! {
<div style="display: flex">
<div style="width: 896px; margin: 0 auto;">
<h1>"Toast"</h1>
<Demo>
""
2023-10-08 09:28:13 +08:00
<DemoCode
slot
html=highlight_str!(
r#"
2023-10-04 00:11:38 +08:00
let count = create_rw_signal(0u32);
let onclick = move |_| {
show_toast(ToastOptions {
message: format!("Hello {}", count.get_untracked()),
duration: Duration::from_millis(2000),
});
count.set(count.get_untracked() + 1);
};
2023-10-08 09:28:13 +08:00
"#,
"rust"
)
>
2023-10-04 00:11:38 +08:00
""
2023-09-21 22:59:35 +08:00
</DemoCode>
</Demo>
</div>
<div>
2023-10-08 09:28:13 +08:00
<MobilePage path="/melt-ui?path=/mobile/toast"/>
2023-09-21 22:59:35 +08:00
</div>
</div>
}
}
#[component]
pub fn ToastDemoPage() -> impl IntoView {
2023-08-29 09:11:22 +08:00
let count = create_rw_signal(0u32);
2023-06-14 18:19:59 +08:00
let onclick = move |_| {
2023-08-29 09:11:22 +08:00
show_toast(ToastOptions {
message: format!("Hello {}", count.get_untracked()),
duration: Duration::from_millis(2000),
});
2023-06-14 18:19:59 +08:00
count.set(count.get_untracked() + 1);
};
2023-08-29 09:11:22 +08:00
view! {
2023-06-14 18:19:59 +08:00
<div style="margin: 20px">
<Button on:click=onclick>"hi"</Button>
</div>
}
}