mirror of
https://github.com/adoyle0/thaw.git
synced 2025-03-13 05:59:49 -04:00
123 lines
4.5 KiB
Rust
123 lines
4.5 KiB
Rust
use crate::{
|
|
components::{Demo, DemoCode},
|
|
pages::MobilePage,
|
|
};
|
|
use leptos::*;
|
|
use prisms::highlight_str;
|
|
use thaw::mobile::NavBar;
|
|
use thaw::Table;
|
|
|
|
#[component]
|
|
pub fn NavBarPage() -> impl IntoView {
|
|
view! {
|
|
<div style="display: flex">
|
|
<div style="width: 896px; margin: 0 auto;">
|
|
<h1>"Navbar"</h1>
|
|
<Demo>
|
|
""
|
|
<DemoCode
|
|
slot
|
|
html=highlight_str!(
|
|
r#"
|
|
let click_text = create_rw_signal(String::from("none"));
|
|
let on_click_left = move |_| click_text.set("left".to_string());
|
|
let on_click_right = move |_| click_text.set("right".to_string());
|
|
|
|
view! {
|
|
<div style="height: 100vh; background: #f5f5f5">
|
|
<NavBar
|
|
title="Home"
|
|
left_arrow=true
|
|
left_text="back"
|
|
right_text="add"
|
|
on_click_left=on_click_left
|
|
on_click_right=on_click_right
|
|
/>
|
|
<div style="padding-top: 50px">{move || click_text.get()}</div>
|
|
</div>
|
|
}
|
|
"#,
|
|
"rust"
|
|
)
|
|
>
|
|
|
|
""
|
|
</DemoCode>
|
|
</Demo>
|
|
<h3>"NavBar Props"</h3>
|
|
<Table single_column=true>
|
|
<thead>
|
|
<tr>
|
|
<th>"Name"</th>
|
|
<th>"Type"</th>
|
|
<th>"Default"</th>
|
|
<th>"Description"</th>
|
|
</tr>
|
|
</thead>
|
|
<tbody>
|
|
<tr>
|
|
<td>"title"</td>
|
|
<td>"MaybeSignal<String>"</td>
|
|
<td>r#""""#</td>
|
|
<td>"NavBar title."</td>
|
|
</tr>
|
|
<tr>
|
|
<td>"left_arrow"</td>
|
|
<td>"MaybeSignal<bool>"</td>
|
|
<td></td>
|
|
<td>"Whether to show left arrow."</td>
|
|
</tr>
|
|
<tr>
|
|
<td>"left_text"</td>
|
|
<td>"MaybeSignal<String>"</td>
|
|
<td>r#""""#</td>
|
|
<td>"NavBar left text."</td>
|
|
</tr>
|
|
<tr>
|
|
<td>"on_click_left"</td>
|
|
<td>"MaybeSignal<String>"</td>
|
|
<td>r#""""#</td>
|
|
<td>"NavBar left click."</td>
|
|
</tr>
|
|
<tr>
|
|
<td>"right_text"</td>
|
|
<td>"MaybeSignal<String>"</td>
|
|
<td>r#""""#</td>
|
|
<td>"NavBar right text."</td>
|
|
</tr>
|
|
<tr>
|
|
<td>"on_click_right"</td>
|
|
<td>"MaybeSignal<String>"</td>
|
|
<td>r#""""#</td>
|
|
<td>"NavBar right click."</td>
|
|
</tr>
|
|
</tbody>
|
|
</Table>
|
|
</div>
|
|
<div>
|
|
<MobilePage path="/thaw?path=/mobile/nav-bar"/>
|
|
</div>
|
|
</div>
|
|
}
|
|
}
|
|
|
|
#[component]
|
|
pub fn NavBarDemoPage() -> impl IntoView {
|
|
let click_text = create_rw_signal(String::from("none"));
|
|
let on_click_left = move |_| click_text.set("left".to_string());
|
|
let on_click_right = move |_| click_text.set("right".to_string());
|
|
|
|
view! {
|
|
<div style="height: 100vh;">
|
|
<NavBar
|
|
title="Home"
|
|
left_arrow=true
|
|
left_text="back"
|
|
right_text="add"
|
|
on_click_left=on_click_left
|
|
on_click_right=on_click_right
|
|
/>
|
|
<div style="padding-top: 50px">{move || click_text.get()}</div>
|
|
</div>
|
|
}
|
|
}
|