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

feat(demo): Home

Browse source
This commit is contained in:
luoxiao 2024-08-26 16:17:38 +08:00
parent 7893d35239
commit e153ef722b
1 changed files with 14 additions and 3 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

17
demo/src/pages/home.rs
View file

@ -2,6 +2,7 @@ use crate::components::SiteHeader;
use leptos::prelude::*;
use leptos_router::hooks::{use_navigate, use_query_map};
use thaw::*;
use leptos_meta::Style;
#[component]
pub fn Home() -> impl IntoView {
@ -13,14 +14,24 @@ pub fn Home() -> impl IntoView {
navigate(&path, Default::default());
}
view! {
<Style>
" .main { width: 1100px; margin: calc(50vh - 200px) auto 0; display: flex; }
.main > div { width: 50%; }
@media screen and (max-width: 1100px) {
.main { width: 100%; margin: calc(50vh - 280px) 0 0; flex-direction: column-reverse; }
.main > div { width: auto; text-align: center; }
.main > div > .thaw-space { justify-content: center; }
}
"
</Style>
<Layout position=LayoutPosition::Absolute>
<SiteHeader/>
<Layout
position=LayoutPosition::Absolute
attr:style="top: 64px"
>
<div style="width: 1100px; margin: calc(50vh - 200px) auto 0; display: flex">
<div style="width: 50%">
<div class="main">
<div>
<h2 style="line-height: 64px; font-size: 56px; margin: 0 0 18px">"Thaw UI"</h2>
<p style="line-height: 36px; font-size: 24px">"An easy to use leptos component library"</p>
<Space>
@ -43,7 +54,7 @@ pub fn Home() -> impl IntoView {
</Button>
</Space>
</div>
<div style="width: 50%; text-align: center">
<div style="text-align: center">
<img src="/logo.svg" style="width: 200px"/>
</div>
</div>