mirror of
https://github.com/adoyle0/thaw.git
synced 2025-01-22 22:09:22 -05:00
✨ feat: add gh-pages
This commit is contained in:
parent
95a2586276
commit
e727d2931f
21 changed files with 434 additions and 2 deletions
4
.gitignore
vendored
4
.gitignore
vendored
|
@ -9,4 +9,6 @@ Cargo.lock
|
||||||
# These are backup files generated by rustfmt
|
# These are backup files generated by rustfmt
|
||||||
**/*.rs.bk
|
**/*.rs.bk
|
||||||
|
|
||||||
/examples/**/dist
|
/examples/**/dist
|
||||||
|
/gh-pages/dist
|
||||||
|
/docs
|
|
@ -27,4 +27,4 @@ leptos_icons = { git = "https://github.com/luoxiaozero/leptos-icons.git", rev =
|
||||||
wasm-bindgen = "0.2.85"
|
wasm-bindgen = "0.2.85"
|
||||||
|
|
||||||
[workspace]
|
[workspace]
|
||||||
members = ["examples/basic"]
|
members = ["examples/basic", "gh-pages"]
|
||||||
|
|
16
gh-pages/Cargo.toml
Normal file
16
gh-pages/Cargo.toml
Normal file
|
@ -0,0 +1,16 @@
|
||||||
|
[package]
|
||||||
|
name = "gh-pages"
|
||||||
|
version = "0.1.0"
|
||||||
|
edition = "2021"
|
||||||
|
|
||||||
|
# See more keys and their definitions at https://doc.rust-lang.org/cargo/reference/manifest.html
|
||||||
|
|
||||||
|
[dependencies]
|
||||||
|
leptos = { git = "https://github.com/leptos-rs/leptos.git", rev = "3d75c71", features = [
|
||||||
|
"stable",
|
||||||
|
] }
|
||||||
|
melt-ui = { path = "../" }
|
||||||
|
leptos_icons = { git = "https://github.com/luoxiaozero/leptos-icons.git", rev = "4fe4417", features = ["AiCloseOutlined", "AiCheckOutlined"] }
|
||||||
|
leptos_router = { git = "https://github.com/leptos-rs/leptos.git", rev = "3d75c71", features = ["csr"] }
|
||||||
|
|
||||||
|
regex = "1.8.2"
|
16
gh-pages/Trunk.toml
Normal file
16
gh-pages/Trunk.toml
Normal file
|
@ -0,0 +1,16 @@
|
||||||
|
[build]
|
||||||
|
target = "index.html"
|
||||||
|
public_url = "/melt-ui/"
|
||||||
|
dist = "../docs"
|
||||||
|
release = true
|
||||||
|
|
||||||
|
[watch]
|
||||||
|
watch = [
|
||||||
|
"../src",
|
||||||
|
"./src"
|
||||||
|
]
|
||||||
|
|
||||||
|
[serve]
|
||||||
|
address = "127.0.0.1"
|
||||||
|
port = 6421
|
||||||
|
open = false
|
13
gh-pages/index.html
Normal file
13
gh-pages/index.html
Normal file
|
@ -0,0 +1,13 @@
|
||||||
|
<!DOCTYPE html>
|
||||||
|
<html lang="en">
|
||||||
|
<head>
|
||||||
|
<meta charset="UTF-8">
|
||||||
|
<meta http-equiv="X-UA-Compatible" content="IE=edge">
|
||||||
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||||
|
<title>Document</title>
|
||||||
|
<link data-trunk rel="css" href="./src/assets/css/index.css" />
|
||||||
|
</head>
|
||||||
|
<body>
|
||||||
|
|
||||||
|
</body>
|
||||||
|
</html>
|
61
gh-pages/src/app.rs
Normal file
61
gh-pages/src/app.rs
Normal file
|
@ -0,0 +1,61 @@
|
||||||
|
use crate::pages::*;
|
||||||
|
use leptos::*;
|
||||||
|
use leptos_router::*;
|
||||||
|
|
||||||
|
#[component]
|
||||||
|
pub fn App(cx: Scope) -> impl IntoView {
|
||||||
|
view! { cx,
|
||||||
|
<Router base="/melt-ui">
|
||||||
|
<Routes base="/melt-ui".to_string() >
|
||||||
|
<Route path="/" view=move |cx| view! {cx,
|
||||||
|
<Home />
|
||||||
|
} />
|
||||||
|
<Route path="/menu" view=move |cx| view! {cx,
|
||||||
|
<MenuPage />
|
||||||
|
} />
|
||||||
|
<Route path="/slider" view=move |cx| view! {cx,
|
||||||
|
<SliderPage />
|
||||||
|
} />
|
||||||
|
<Route path="/components" view=move |cx| view! {cx,
|
||||||
|
<ComponentsPage />
|
||||||
|
} >
|
||||||
|
<Route path="/menu" view=move |cx| view! {cx,
|
||||||
|
<MenuPage />
|
||||||
|
} />
|
||||||
|
<Route path="/slider" view=move |cx| view! {cx,
|
||||||
|
<SliderPage />
|
||||||
|
} />
|
||||||
|
<Route path="/tabbar" view=move |cx| view! {cx,
|
||||||
|
<MobilePage path="/melt-ui/mobile/tabbar" />
|
||||||
|
} />
|
||||||
|
<Route path="/nav-bar" view=move |cx| view! {cx,
|
||||||
|
<MobilePage path="/melt-ui/mobile/nav-bar" />
|
||||||
|
} />
|
||||||
|
<Route path="/input" view=move |cx| view! {cx,
|
||||||
|
<InputPage />
|
||||||
|
} />
|
||||||
|
<Route path="/image" view=move |cx| view! {cx,
|
||||||
|
<ImagePage />
|
||||||
|
} />
|
||||||
|
<Route path="/modal" view=move |cx| view! {cx,
|
||||||
|
<ModalPage />
|
||||||
|
} />
|
||||||
|
<Route path="/button" view=move |cx| view! {cx,
|
||||||
|
<ButtonPage />
|
||||||
|
} />
|
||||||
|
<Route path="/checkbox" view=move |cx| view! {cx,
|
||||||
|
<CheckboxPage />
|
||||||
|
} />
|
||||||
|
</Route>
|
||||||
|
</Routes>
|
||||||
|
<Routes base="/melt-ui/mobile".to_string()>
|
||||||
|
<Route path="/tabbar" view=move |cx| view! {cx,
|
||||||
|
<TabbarPage />
|
||||||
|
} />
|
||||||
|
<Route path="/nav-bar" view=move |cx| view! {cx,
|
||||||
|
<NavBarPage />
|
||||||
|
} />
|
||||||
|
</Routes>
|
||||||
|
</Router>
|
||||||
|
}
|
||||||
|
}
|
16
gh-pages/src/assets/css/index.css
Normal file
16
gh-pages/src/assets/css/index.css
Normal file
|
@ -0,0 +1,16 @@
|
||||||
|
body {
|
||||||
|
margin: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
.components-page-box {
|
||||||
|
display: flex;
|
||||||
|
}
|
||||||
|
|
||||||
|
.components-page-box aside {
|
||||||
|
width: 260px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.components-page-box main {
|
||||||
|
flex: 1;
|
||||||
|
}
|
9
gh-pages/src/main.rs
Normal file
9
gh-pages/src/main.rs
Normal file
|
@ -0,0 +1,9 @@
|
||||||
|
mod app;
|
||||||
|
mod pages;
|
||||||
|
|
||||||
|
use app::*;
|
||||||
|
use leptos::*;
|
||||||
|
|
||||||
|
fn main() {
|
||||||
|
mount_to_body(|cx| view! { cx, <App/> })
|
||||||
|
}
|
43
gh-pages/src/pages/button/mod.rs
Normal file
43
gh-pages/src/pages/button/mod.rs
Normal file
|
@ -0,0 +1,43 @@
|
||||||
|
use leptos::*;
|
||||||
|
use melt_ui::*;
|
||||||
|
|
||||||
|
#[component]
|
||||||
|
pub fn ButtonPage(cx: Scope) -> impl IntoView {
|
||||||
|
view! {cx,
|
||||||
|
<Space>
|
||||||
|
<Button type_=ButtonType::PRIMARY>
|
||||||
|
"PRIMARY"
|
||||||
|
</Button>
|
||||||
|
<Button type_=ButtonType::SOLID>
|
||||||
|
"SOLID"
|
||||||
|
</Button>
|
||||||
|
<Button type_=ButtonType::TEXT>
|
||||||
|
"TEXT"
|
||||||
|
</Button>
|
||||||
|
<Button type_=ButtonType::LINK>
|
||||||
|
"LINK"
|
||||||
|
</Button>
|
||||||
|
<Button color=ButtonColor::PRIMARY>
|
||||||
|
"PRIMARY Color"
|
||||||
|
</Button>
|
||||||
|
<Button color=ButtonColor::SUCCESS>
|
||||||
|
"SUCCESS Color"
|
||||||
|
</Button>
|
||||||
|
<Button color=ButtonColor::WARNING>
|
||||||
|
"WARNING Color"
|
||||||
|
</Button>
|
||||||
|
<Button color=ButtonColor::ERROR>
|
||||||
|
"ERROR Color"
|
||||||
|
</Button>
|
||||||
|
<Button color=ButtonColor::ERROR icon=leptos_icons::AiIcon::AiCloseOutlined>
|
||||||
|
"ERROR Color Icon"
|
||||||
|
</Button>
|
||||||
|
<Button color=ButtonColor::ERROR icon=leptos_icons::AiIcon::AiCloseOutlined round=true>
|
||||||
|
</Button>
|
||||||
|
</Space>
|
||||||
|
<div style="padding-top: 12px">
|
||||||
|
<Button style="background: blue;">"style blue"</Button>
|
||||||
|
<Button style="width: 40px; height: 20px">"size"</Button>
|
||||||
|
</div>
|
||||||
|
}
|
||||||
|
}
|
14
gh-pages/src/pages/checkbox/mod.rs
Normal file
14
gh-pages/src/pages/checkbox/mod.rs
Normal file
|
@ -0,0 +1,14 @@
|
||||||
|
use leptos::*;
|
||||||
|
use melt_ui::*;
|
||||||
|
|
||||||
|
#[component]
|
||||||
|
pub fn CheckboxPage(cx: Scope) -> impl IntoView {
|
||||||
|
let checked = create_rw_signal(cx, false);
|
||||||
|
view! {cx,
|
||||||
|
<div>
|
||||||
|
<Checkbox checked>
|
||||||
|
"Click"
|
||||||
|
</Checkbox>
|
||||||
|
</div>
|
||||||
|
}
|
||||||
|
}
|
52
gh-pages/src/pages/components.rs
Normal file
52
gh-pages/src/pages/components.rs
Normal file
|
@ -0,0 +1,52 @@
|
||||||
|
use leptos::*;
|
||||||
|
use leptos_router::{use_location, use_navigate, Outlet};
|
||||||
|
use melt_ui::*;
|
||||||
|
use regex::Regex;
|
||||||
|
|
||||||
|
#[component]
|
||||||
|
pub fn ComponentsPage(cx: Scope) -> impl IntoView {
|
||||||
|
let loaction = use_location(cx);
|
||||||
|
let navigate = use_navigate(cx);
|
||||||
|
let selected = create_rw_signal(cx, String::from(""));
|
||||||
|
create_effect(cx, move |_| {
|
||||||
|
let pathname = loaction.pathname.get();
|
||||||
|
|
||||||
|
let re = Regex::new(r"^/components/(.+)$").unwrap();
|
||||||
|
let Some(caps) = re.captures(&pathname) else {
|
||||||
|
return;
|
||||||
|
};
|
||||||
|
let Some(path) = caps.get(1) else {
|
||||||
|
return;
|
||||||
|
};
|
||||||
|
let path = path.as_str().to_string();
|
||||||
|
selected.set(path);
|
||||||
|
});
|
||||||
|
|
||||||
|
create_effect(cx, move |value| {
|
||||||
|
let selected = selected.get();
|
||||||
|
if value.is_some() {
|
||||||
|
_ = navigate(&format!("/components/{selected}"), Default::default());
|
||||||
|
}
|
||||||
|
selected
|
||||||
|
});
|
||||||
|
view! {cx,
|
||||||
|
<div class="components-page-box">
|
||||||
|
<aside>
|
||||||
|
<Menu selected>
|
||||||
|
<MenuItem key="menu" label="menu" />
|
||||||
|
<MenuItem key="slider" label="slider" />
|
||||||
|
<MenuItem key="tabbar" label="tabbar" />
|
||||||
|
<MenuItem key="input" label="input" />
|
||||||
|
<MenuItem key="image" label="image" />
|
||||||
|
<MenuItem key="modal" label="modal" />
|
||||||
|
<MenuItem key="nav-bar" label="nav-bar" />
|
||||||
|
<MenuItem key="button" label="button" />
|
||||||
|
<MenuItem key="checkbox" label="checkbox" />
|
||||||
|
</Menu>
|
||||||
|
</aside>
|
||||||
|
<main>
|
||||||
|
<Outlet />
|
||||||
|
</main>
|
||||||
|
</div>
|
||||||
|
}
|
||||||
|
}
|
40
gh-pages/src/pages/home.rs
Normal file
40
gh-pages/src/pages/home.rs
Normal file
|
@ -0,0 +1,40 @@
|
||||||
|
use leptos::*;
|
||||||
|
use leptos_router::use_navigate;
|
||||||
|
use melt_ui::*;
|
||||||
|
|
||||||
|
#[component]
|
||||||
|
pub fn Home(cx: Scope) -> impl IntoView {
|
||||||
|
let (theme, set_theme) = create_signal(cx, Theme::light());
|
||||||
|
provide_context(cx, theme);
|
||||||
|
let (count, set_count) = create_signal(cx, 0.0);
|
||||||
|
let (button_type, set_button_type) = create_signal(cx, ButtonType::TEXT);
|
||||||
|
view! { cx,
|
||||||
|
<Button on:click=move |_| {
|
||||||
|
let navigate = use_navigate(cx);
|
||||||
|
_ = navigate("/components/menu", Default::default());
|
||||||
|
}>
|
||||||
|
"components"
|
||||||
|
</Button>
|
||||||
|
<hr />
|
||||||
|
<Space>
|
||||||
|
<Button
|
||||||
|
on:click=move |_| set_theme.update(move |value| *value = Theme::dark())
|
||||||
|
type_=button_type
|
||||||
|
>
|
||||||
|
"theme"
|
||||||
|
</Button>
|
||||||
|
<Button on:click=move |_| set_button_type.update(move |value| *value = ButtonType::PRIMARY)>
|
||||||
|
"click"
|
||||||
|
</Button>
|
||||||
|
<Button
|
||||||
|
on:click=move |_| set_count.update(move |value| *value += 1.0)
|
||||||
|
type_=button_type
|
||||||
|
>
|
||||||
|
"click"
|
||||||
|
</Button>
|
||||||
|
{move || count.get()}
|
||||||
|
|
||||||
|
<Progress percentage=count/>
|
||||||
|
</Space>
|
||||||
|
}
|
||||||
|
}
|
12
gh-pages/src/pages/image/mod.rs
Normal file
12
gh-pages/src/pages/image/mod.rs
Normal file
|
@ -0,0 +1,12 @@
|
||||||
|
use leptos::*;
|
||||||
|
use melt_ui::*;
|
||||||
|
|
||||||
|
#[component]
|
||||||
|
pub fn ImagePage(cx: Scope) -> impl IntoView {
|
||||||
|
view! { cx,
|
||||||
|
<>
|
||||||
|
<Image src="https://s3.bmp.ovh/imgs/2021/10/2c3b013418d55659.jpg" width="500px"/>
|
||||||
|
<Image width="200px" height="200px"/>
|
||||||
|
</>
|
||||||
|
}
|
||||||
|
}
|
14
gh-pages/src/pages/input/mod.rs
Normal file
14
gh-pages/src/pages/input/mod.rs
Normal file
|
@ -0,0 +1,14 @@
|
||||||
|
use leptos::*;
|
||||||
|
use melt_ui::*;
|
||||||
|
|
||||||
|
#[component]
|
||||||
|
pub fn InputPage(cx: Scope) -> impl IntoView {
|
||||||
|
let value = create_rw_signal(cx, String::from("o"));
|
||||||
|
view! { cx,
|
||||||
|
<>
|
||||||
|
{move || value.get()}
|
||||||
|
<Input value/>
|
||||||
|
<Input value type_="password" />
|
||||||
|
</>
|
||||||
|
}
|
||||||
|
}
|
16
gh-pages/src/pages/menu/mod.rs
Normal file
16
gh-pages/src/pages/menu/mod.rs
Normal file
|
@ -0,0 +1,16 @@
|
||||||
|
use leptos::*;
|
||||||
|
use melt_ui::*;
|
||||||
|
|
||||||
|
#[component]
|
||||||
|
pub fn MenuPage(cx: Scope) -> impl IntoView {
|
||||||
|
let selected = create_rw_signal(cx, String::from("o"));
|
||||||
|
view! { cx,
|
||||||
|
<>
|
||||||
|
{ move || selected.get() }
|
||||||
|
<Menu selected>
|
||||||
|
<MenuItem key="a" label="and"/>
|
||||||
|
<MenuItem key="o" label="or"/>
|
||||||
|
</Menu>
|
||||||
|
</>
|
||||||
|
}
|
||||||
|
}
|
10
gh-pages/src/pages/mobile.rs
Normal file
10
gh-pages/src/pages/mobile.rs
Normal file
|
@ -0,0 +1,10 @@
|
||||||
|
use leptos::*;
|
||||||
|
|
||||||
|
#[component]
|
||||||
|
pub fn MobilePage(cx: Scope, path: &'static str) -> impl IntoView {
|
||||||
|
view! { cx,
|
||||||
|
<div style="height: 100vh; display: flex; align-items: center; justify-content: center; background: #eff2f5">
|
||||||
|
<iframe src=path style="width: 360px; height: 640px; background-color: #fff; border: none; border-radius: 16px; border: 1px solid #e1e1e1"/>
|
||||||
|
</div>
|
||||||
|
}
|
||||||
|
}
|
25
gh-pages/src/pages/mod.rs
Normal file
25
gh-pages/src/pages/mod.rs
Normal file
|
@ -0,0 +1,25 @@
|
||||||
|
mod button;
|
||||||
|
mod checkbox;
|
||||||
|
mod components;
|
||||||
|
mod home;
|
||||||
|
mod image;
|
||||||
|
mod input;
|
||||||
|
mod menu;
|
||||||
|
mod mobile;
|
||||||
|
mod modal;
|
||||||
|
mod nav_bar;
|
||||||
|
mod slider;
|
||||||
|
mod tabbar;
|
||||||
|
|
||||||
|
pub use button::*;
|
||||||
|
pub use checkbox::*;
|
||||||
|
pub use components::*;
|
||||||
|
pub use home::*;
|
||||||
|
pub use image::*;
|
||||||
|
pub use input::*;
|
||||||
|
pub use menu::*;
|
||||||
|
pub use mobile::*;
|
||||||
|
pub use modal::*;
|
||||||
|
pub use nav_bar::*;
|
||||||
|
pub use slider::*;
|
||||||
|
pub use tabbar::*;
|
15
gh-pages/src/pages/modal/mod.rs
Normal file
15
gh-pages/src/pages/modal/mod.rs
Normal file
|
@ -0,0 +1,15 @@
|
||||||
|
use leptos::*;
|
||||||
|
use melt_ui::*;
|
||||||
|
|
||||||
|
#[component]
|
||||||
|
pub fn ModalPage(cx: Scope) -> impl IntoView {
|
||||||
|
let show = create_rw_signal(cx, false);
|
||||||
|
view! { cx,
|
||||||
|
<Button on:click=move |_| show.set(true)>
|
||||||
|
"open modal"
|
||||||
|
</Button>
|
||||||
|
<Modal title="title" show>
|
||||||
|
"sd"
|
||||||
|
</Modal>
|
||||||
|
}
|
||||||
|
}
|
24
gh-pages/src/pages/nav_bar/mod.rs
Normal file
24
gh-pages/src/pages/nav_bar/mod.rs
Normal file
|
@ -0,0 +1,24 @@
|
||||||
|
use leptos::*;
|
||||||
|
use melt_ui::mobile::NavBar;
|
||||||
|
|
||||||
|
#[component]
|
||||||
|
pub fn NavBarPage(cx: Scope) -> impl IntoView {
|
||||||
|
let click_text = create_rw_signal(cx, String::from("none"));
|
||||||
|
|
||||||
|
let click_left = SignalSetter::map(cx, move |_| {
|
||||||
|
click_text.set("left".to_string())
|
||||||
|
});
|
||||||
|
|
||||||
|
let click_right = SignalSetter::map(cx, move |_| {
|
||||||
|
click_text.set("right".to_string())
|
||||||
|
});
|
||||||
|
|
||||||
|
view! { cx,
|
||||||
|
<div style="height: 100vh; background: #f5f5f5">
|
||||||
|
<NavBar title="Home" left_arrow=true left_text="back" right_text="add" click_left=click_left click_right=click_right/>
|
||||||
|
<div style="padding-top: 50px">
|
||||||
|
{ move || click_text.get() }
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
}
|
||||||
|
}
|
11
gh-pages/src/pages/slider/mod.rs
Normal file
11
gh-pages/src/pages/slider/mod.rs
Normal file
|
@ -0,0 +1,11 @@
|
||||||
|
use leptos::*;
|
||||||
|
use melt_ui::*;
|
||||||
|
|
||||||
|
#[component]
|
||||||
|
pub fn SliderPage(cx: Scope) -> impl IntoView {
|
||||||
|
let value = create_rw_signal(cx, 0.0);
|
||||||
|
|
||||||
|
view! { cx,
|
||||||
|
<Slider value/>
|
||||||
|
}
|
||||||
|
}
|
23
gh-pages/src/pages/tabbar/mod.rs
Normal file
23
gh-pages/src/pages/tabbar/mod.rs
Normal file
|
@ -0,0 +1,23 @@
|
||||||
|
use leptos::*;
|
||||||
|
use melt_ui::mobile::*;
|
||||||
|
|
||||||
|
#[component]
|
||||||
|
pub fn TabbarPage(cx: Scope) -> impl IntoView {
|
||||||
|
let selected = create_rw_signal(cx, String::from("o"));
|
||||||
|
view! { cx,
|
||||||
|
<div style="height: 100vh; background: #f5f5f5">
|
||||||
|
{ move || selected.get() }
|
||||||
|
<Tabbar selected>
|
||||||
|
<TabbarItem name="a">
|
||||||
|
"and"
|
||||||
|
</TabbarItem>
|
||||||
|
<TabbarItem name="i">
|
||||||
|
"if"
|
||||||
|
</TabbarItem>
|
||||||
|
<TabbarItem name="o" icon=leptos_icons::AiIcon::AiCloseOutlined>
|
||||||
|
"or"
|
||||||
|
</TabbarItem>
|
||||||
|
</Tabbar>
|
||||||
|
</div>
|
||||||
|
}
|
||||||
|
}
|
Loading…
Add table
Reference in a new issue