adam/thaw
1
0
Fork 0
mirror of https://github.com/adoyle0/thaw.git synced 2025-01-22 22:09:22 -05:00
Code Issues Projects Releases Packages Wiki Activity Actions

feat(gh-pages): space component

Browse source
This commit is contained in:
luoxiao 2023-10-03 17:57:37 +08:00
parent c7e37d4996
commit cedd443a79
5 changed files with 65 additions and 1 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

1
gh-pages/src/app.rs
View file

@ -21,6 +21,7 @@ pub fn App() -> impl IntoView {
<Route path="/toast" view=ToastPage />
<Route path="/tabs" view=TabsPage />
<Route path="/select" view=SelectPage />
<Route path="/space" view=SpacePage />
</Route>
<Route path="/mobile/tabbar" view=TabbarDemoPage />
<Route path="/mobile/nav-bar" view=NavBarDemoPage />

2
gh-pages/src/pages/checkbox/mod.rs
View file

@ -28,7 +28,7 @@ pub fn CheckboxPage() -> impl IntoView {
}
</DemoCode>
</Demo>
<h3>"group"</h3>
<Demo>
<CheckboxGroup value>
<CheckboxItem label="apple" value="a" />

1
gh-pages/src/pages/components.rs
View file

@ -48,6 +48,7 @@ pub fn ComponentsPage() -> impl IntoView {
<MenuItem key="toast" label="toast" />
<MenuItem key="tabs" label="tabs" />
<MenuItem key="select" label="select" />
<MenuItem key="space" label="space" />
</Menu>
</LayoutSider>
<Layout style="padding: 8px 12px 28px; overflow-y: scroll;">

2
gh-pages/src/pages/mod.rs
View file

@ -10,6 +10,7 @@ mod modal;
mod nav_bar;
mod select;
mod slider;
mod space;
mod tabbar;
mod tabs;
mod toast;
@ -26,6 +27,7 @@ pub use modal::*;
pub use nav_bar::*;
pub use select::*;
pub use slider::*;
pub use space::*;
pub use tabbar::*;
pub use tabs::*;
pub use toast::*;

60
gh-pages/src/pages/space/mod.rs Normal file
View file

@ -0,0 +1,60 @@
use crate::components::{Demo, DemoCode};
use indoc::indoc;
use leptos::*;
use melt_ui::*;
#[component]
pub fn SpacePage() -> impl IntoView {
view! {
<div style="width: 896px; margin: 0 auto;">
<h1>"Space"</h1>
<Demo>
<Space>
<Button>"1"</Button>
<Button>"2"</Button>
<Button>"3"</Button>
</Space>
<DemoCode slot>
{
indoc!(r#"
<Space>
<Button>"1"</Button>
<Button>"2"</Button>
<Button>"3"</Button>
</Space>
"#)
}
</DemoCode>
</Demo>
<h3>"gap"</h3>
<Demo>
<Space gap=SpaceGap::LARGE>
<Button>"1"</Button>
<Button>"2"</Button>
<Button>"3"</Button>
</Space>
<Space gap=SpaceGap::TUPLE(36, 36)>
<Button>"1"</Button>
<Button>"2"</Button>
<Button>"3"</Button>
</Space>
<DemoCode slot>
{
indoc!(r#"
<Space gap=SpaceGap::LARGE>
<Button>"1"</Button>
<Button>"2"</Button>
<Button>"3"</Button>
</Space>
<Space gap=SpaceGap::TUPLE(36, 36)>
<Button>"1"</Button>
<Button>"2"</Button>
<Button>"3"</Button>
</Space>
"#)
}
</DemoCode>
</Demo>
</div>
}
}